portless - เครื่องมือแทนที่หมายเลขพอร์ตด้วย URL .localhost แบบอิงชื่อ

• ยูทิลโอเพนซอร์สจาก Vercel Labs ที่ช่วยแก้ปัญหา พอร์ตชนกัน ระหว่างการพัฒนาแบบโลคัล และ ความลำบากในการต้องจำว่าใช้พอร์ตหมายเลขอะไรอยู่
• กำหนด ซับโดเมน app.localhost ที่ไม่ซ้ำให้กับแต่ละเซิร์ฟเวอร์พัฒนา เพื่อมอบ ระบบ URL ที่ทั้งคนและ AI เอเจนต์เข้าใจได้
  เมื่อรันด้วย next dev จะเป็น http://localhost:3000 จึงต้องจำเลข 3000
  แต่ถ้ารัน portless myapp next dev จะเข้าถึงได้ในรูปแบบ http://myapp.localhost:1355
  และหากรันแบบ portless api.myapp pnpm start ก็รองรับการเข้าถึงผ่านซับโดเมนอย่าง http://api.myapp.localhost:1355 ได้เช่นกัน
• ทำงานด้วย โครงสร้างแบบพร็อกซี โดย portless proxy จะทำหน้าที่กระจายคำขอจากศูนย์กลาง
  • เมื่อแอปเริ่มทำงาน พร็อกซีจะเริ่มต้นให้อัตโนมัติ และแต่ละแอปจะถูกจัดสรรไปยังพอร์ตแบบสุ่ม (4000–4999)
  • เฟรมเวิร์กส่วนใหญ่ (Next.js, Express, Nuxt เป็นต้น) รับรู้ตัวแปรสภาพแวดล้อม PORT โดยอัตโนมัติ
  • สำหรับบางเฟรมเวิร์กอย่าง Vite, Astro จะมี ฟังก์ชันฉีดแฟล็กอัตโนมัติ เพื่อให้ใช้งานร่วมกันได้
• รองรับ HTTP/2 และ HTTPS เพื่อให้การโหลดหน้าเร็วขึ้นและการสื่อสารแบบโลคัลปลอดภัย
  • เบราว์เซอร์จำกัดการเชื่อมต่อ HTTP/1.1 ไว้ที่ 6 การเชื่อมต่อต่อโฮสต์
    • ทำให้ประสิทธิภาพของดีเวลอปเมนต์เซิร์ฟเวอร์ที่ส่งไฟล์ที่คลายการบีบอัดแล้วหลายไฟล์ เช่น Vite/Nuxt ลดลง
    • HTTP/2 จะมัลติเพล็กซ์ทุกคำขอผ่านการเชื่อมต่อเดียว
  • สร้างใบรับรองเองและลงทะเบียนกับ system trust store ให้อัตโนมัติ
  • สามารถใช้ ใบรับรองแบบกำหนดเอง ได้ด้วยตัวเลือก --cert, --key
• มีอินเทอร์เฟซ CLI ที่ยึดคำสั่งเป็นหลัก
  • portless <name> <cmd> : รันแอปด้วยชื่อที่กำหนด
  • portless list : แสดงรายการเส้นทางที่กำลังใช้งาน
  • portless proxy start/stop : ควบคุมพร็อกซี
  • สามารถรันแบบข้ามพร็อกซีได้ด้วยตัวแปรสภาพแวดล้อม PORTLESS=0
• จัดเก็บข้อมูลเส้นทางและ PID ผ่าน ไดเรกทอรีจัดการสถานะ
  • ในโหมดผู้ใช้ทั่วไปจะใช้ ~/.portless และในโหมดรูทจะใช้ /tmp/portless
  • สามารถกำหนดพาธใหม่ได้ด้วย PORTLESS_STATE_DIR
• เมื่อตั้งค่า API พร็อกซีใน Vite, webpack-dev-server เป็นต้น จำเป็นต้องเขียน Host header ใหม่
  • หากตั้งค่าผิด จะมีการตอบกลับ 508 Loop Detected เพื่อบอกปัญหา
• รองรับ Node.js 20 ขึ้นไป และสภาพแวดล้อม macOS และ Linux
• โครงสร้างโมโนรีโปที่ใช้ pnpm + Turborepo
• ไลเซนส์ Apache-2.0 และโค้ดเบส TypeScript (ประมาณ 74%)

[xguru]

อัปเดตให้รองรับ worktree แล้ว

https://github.com/vercel-labs/portless/releases/tag/v0.5.2

ตอนนี้จะตรวจจับ worktree อัตโนมัติและนำชื่อบรাঞ্চไปใส่ไว้หน้าชื่อโฮสต์

[ragingwind]

มันไม่ค่อยเข้ากับ worktree ของโปรเจ็กต์เดียวกัน เลยไม่ได้ใช้อยู่ครับ

[ndrgrd]

ตอนแรกนึกว่ามันจะจัดสรรให้โดยอัตโนมัติ แต่ดูเหมือนว่าจะเป็นแบบต้องลงทะเบียนเองเฉยๆ
ผมใช้งาน Caddy อยู่แล้ว เลยคงไม่มีเหตุผลอะไรที่ต้องเปลี่ยนมาใช้อันนี้

[ksc2601]

เดิมก็ทำอยู่แล้วด้วย docker + traefik + mkcert แต่ดูเหมือนว่าใช้อันนั้นจะสะดวกกว่านะครับ

[bytecakelake]

เป็นบทความที่มีประโยชน์นะครับ

[xguru]

งั้นก็ลาก่อน error EADDRINUSE ได้เลยเหรอ?
ช่วงนี้พอพัฒนานั่นนี่ผ่านเอเจนต์แล้วต้องรันอะไรต่อมิอะไรเต็มไปหมด มันก็ชนกันเองวุ่นวายเลย 55

[xguru]

มีการพูดถึงเรื่องนี้บน X และบอกว่าถ้าใช้กับ Docker การใส่ PID ของ Docker daemon แบบบังคับก็ใช้ได้เช่นกัน.

https://github.com/vercel-labs/portless/issues/61