การใช้ Pinggy กับ ServBay เพื่อเปิดเว็บไซต์และบริการท้องถิ่นสู่ภายนอก

Pinggy เป็นเครื่องมือทะลุเน็ตเวิร์ก (Local Tunnel) ที่ใช้งานง่ายมาก ด้วยเทคนิค Reverse Proxy สามารถนำบริการเว็บที่รันในเครื่องของคุณ (เช่น ในสภาพแวดล้อม ServBay) เผยแพร่สู่ภายนอกได้อย่างปลอดภัย คู่มือนี้จะสอนวิธีใช้ Pinggy กับ ServBay อย่างละเอียด ช่วยให้นักพัฒนาสามารถแชร์เว็บจากเครื่องตนเองสู่อินเทอร์เน็ตได้อย่างรวดเร็ว เหมาะสำหรับการเดโมระยะไกล ทำงานร่วมกันในทีม หรือรับ Webhook จากภายนอก ฯลฯ

หลักการทางเทคนิค

จุดเด่นของ Pinggy คือการสร้างอุโมงค์ SSH ที่ปลอดภัย โดยจะนำพอร์ตในเครื่องที่ใช้งานอยู่ (ซึ่งอาจอยู่หลัง NAT หรือ Firewall) มาเชื่อมโยงผ่าน SSH ไปยังเซิร์ฟเวอร์สาธารณะของ Pinggy เมื่อมีผู้ใช้เข้าถึง URL ที่ Pinggy แจกจ่ายให้ คำขอจะถูกส่งผ่านอุโมงค์มายังเซิร์ฟเวอร์ท้องถิ่นของคุณอย่างปลอดภัย

ในมุมมองการใช้งานกับ ServBay หมายความว่า คุณสามารถแมป เว็บไซต์ ใดๆ ที่รันใน ServBay (เช่น https://myproject.servbay.demo) ออกสู่อินเทอร์เน็ตผ่าน Pinggy โดยไม่ต้องยุ่งกับการฟอร์เวิร์ดพอร์ตหรือคอนฟิก Firewall ใดๆ

เตรียมแวดล้อม

การใช้ Pinggy ไม่จำเป็นต้องติดตั้งไคลเอนต์เพิ่มในเครื่องของคุณ มีเพียง:

1. ติดตั้งและใช้งาน ServBay แล้ว: ยืนยันว่า ServBay ของคุณติดตั้งถูกต้อง และเว็บไซต์/บริการที่ต้องการแชร์นั้นกำลังรันอยู่
2. มีเว็บไซต์รันใน ServBay: ต้องสร้างและเปิดใช้งานเว็บไซต์อย่างน้อยหนึ่งเว็บใน ServBay ซึ่งส่วนใหญ่รันผ่านเซิร์ฟเวอร์ Caddy หรือ Nginx ที่ Listen ท้องถิ่นไว้ที่พอร์ต 80 (HTTP) หรือ 443 (HTTPS)
3. เครื่องมือ Terminal ที่รองรับ SSH: บน macOS มี Terminal ติดมากับระบบ หรือใช้ Terminal อื่นที่รองรับ SSH ก็ได้
4. เข้าใจพื้นฐาน SSH: ทราบวิธีใช้งานคำสั่ง SSH เบื้องต้น

วิธีตั้งค่าอุโมงค์

คำสั่งหลัก

การสร้างอุโมงค์ด้วย Pinggy ทำได้ง่ายมาก เพียงรันคำสั่ง SSH เดียวใน Terminal ตัวอย่างนี้คือการเผยแพร่เว็บไซต์ servbay.new ที่รันบนพอร์ต 443 ในเครื่องของคุณผ่าน Pinggy:

ssh -p 443 -R0:localhost:443 -o StrictHostKeyChecking=no -o ServerAliveInterval=30 -t [email protected] x:localServerTls:servbay.new "u:host:servbay.new"

ข้อควรจำ: เปลี่ยนส่วน XXXXXXXXXXX ให้ตรงกับชื่อผู้ใช้ที่ได้จากเว็บไซต์ Pinggy (มักเป็นข้อความสุ่ม) และแทนที่ servbay.new ด้วยชื่อโดเมนเว็บไซต์ที่รันใน ServBay ที่คุณต้องการเผยแพร่ (เช่น myproject.servbay.demo)

มาดูความหมายของแต่ละส่วนในคำสั่งนี้:

ส่วนของคำสั่ง	คำอธิบายฟังก์ชัน
-p 443	ระบุว่าเชื่อมต่อ SSH ไปที่พอร์ต 443 ของเซิร์ฟเวอร์ Pinggy ใช้พอร์ตมาตรฐาน HTTPS เพื่อช่วยทะลุ Firewall ได้ง่ายขึ้น
-R0:localhost:443	การฟอร์เวิร์ดพอร์ตแบบ Remote: 0 ให้ Pinggy จ่ายพอร์ตสุ่มสาธารณะ, localhost:443 ให้ส่งทราฟฟิคไปยังพอร์ต 443 ในเครื่องคุณ (ซึ่งเซิร์ฟเวอร์ Caddy/Nginx ของ ServBay จะรับฟัง HTTPS อยู่)
-o StrictHostKeyChecking=no	ปิดระบบตรวจสอบ Host Key ครั้งแรก สะดวกในการทดสอบ แต่อย่างยิ่งไม่ควรมองข้ามการตรวจสอบเพื่อความปลอดภัยในกรณีใช้งานจริง
-o ServerAliveInterval=30	ส่งสัญญาณ keep-alive ไปยังเซิร์ฟเวอร์ทุก 30 วินาที ป้องกันการหลุด
-t [email protected]	ชื่อผู้ใช้ Pinggy และที่อยู่เซิร์ฟเวอร์ (แทนที่ส่วน XXXXXXXXXXX ด้วยของคุณ)
x:localServerTls:servbay.new	พารามิเตอร์ custom บอก Pinggy ว่าบริการที่ท้องถิ่นรองรับ TLS (HTTPS) และโดเมนคือ servbay.new (กรุณาแทนที่เป็นของคุณเอง) ช่วยให้การ handle HTTPS ถูกต้อง
"u:host:servbay.new"	พารามิเตอร์ custom อีกตัว กำหนดให้ฟอร์เวิร์ด HTTP Host header ไปเป็น servbay.new (หรือโดเมนที่คุณระบุใน ServBay) จำเป็นมากสำหรับระบบ virtual host ใน ServBay

เมื่อรันคำสั่งสำเร็จ Terminal จะแสดง URL สาธารณะสำหรับเข้าถึงบริการท้องถิ่นของคุณ ซึ่งมักจะมีทั้ง HTTP และ HTTPS ให้ใช้ เช่น:

http://rnirh-172-188-50-148.a.free.pinggy.link
https://rnirh-172-188-50-148.a.free.pinggy.link

ตรวจสอบการให้บริการ

หลังสร้างอุโมงค์แล้ว, สามารถตรวจสอบการเข้าถึงจากภายนอกได้ดังนี้:

1. ตรวจสอบผ่าน curl (แนะนำ): ใช้คำสั่ง curl -I (ดู header อย่างเดียว) ทดสอบ URL สาธารณะ (เปลี่ยน URL เป็นอันที่ Pinggy ให้คุณ)

   curl -I https://rnirh-172-188-50-148.a.free.pinggy.link

   หากทุกอย่างถูกต้อง จะได้ header ตอบกลับคล้ายนี้ ซึ่งจะเห็นชื่อเซิร์ฟเวอร์ท้องถิ่น (Nginx หรือ Caddy) ที่คุณใช้:

   HTTP/1.1 200 OK
   Connection: close
   Access-Control-Allow-Credentials: true
   Access-Control-Allow-Headers: Content-Type, Authorization
   Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS
   Access-Control-Allow-Origin: *
   Cache-Control: max-age=0, must-revalidate, no-cache, no-store, private
   Connection: keep-alive
   Content-Type: text/html; charset=UTF-8
   Date: Tue, 18 Feb 2025 11:51:48 GMT # วันที่อาจแตกต่าง
   Expires: Sun, 02 Jan 1990 00:00:00 GMT
   Pragma: no-cache
   Server: nginx # หรือ caddy แล้วแต่เซิร์ฟเวอร์ที่เซ็ตบน ServBay
   Vary: Accept-Encoding
   X-Frame-Options: SAMEORIGIN
   X-Powered-By: PHP/8.4.3 # หรือ stack อื่นที่ใช้

   การเห็น HTTP/1.1 200 OK และหัวข้อ Server ถูกต้อง แปลว่าเชื่อมต่อจากภายนอกได้ชัวร์แล้ว

2. เปิดในเบราว์เซอร์: ลองเปิด HTTPS URL ที่ Pinggy ให้ในเบราว์เซอร์ (บนอุปกรณ์ใดก็ได้ ไม่ต้องอยู่เครือข่ายเดียวกัน) จะเห็นเว็บเหมือนกับที่เปิดในเครื่องผ่าน ServBay

3. ผลลัพธ์ที่ควรได้:

   • ผู้ใช้ภายนอกสามารถเข้าถึงเว็บไซต์หรือบริการที่รันใน ServBay ของคุณได้
   • หากเซ็ตบริการที่ ServBay เป็น HTTPS (ปกติ ServBay ออก self-signed cert ให้เอง) Pinggy จะออกใบรับรองสาธารณะจาก CA ฟรีให้อัตโนมัติ ไม่ต้องตั้งค่าอะไรเพิ่ม
   • ความเร็วและเสถียรภาพขึ้นอยู่กับอินเตอร์เน็ตในเครื่องคุณ, การเชื่อมต่อไปยังเซิร์ฟเวอร์ของ Pinggy และโหลดของระบบ Pinggy เอง

เทคนิคขั้นสูง

1. เผยแพร่พอร์ตหรือบริการอื่น: หากบริการของคุณไม่ได้รันที่ 80/443 หรือไม่ใช่ Web Service (เช่น รัน Python/Node บนพอร์ต 8000) เพียงเปลี่ยนเลขพอร์ตใน -R เช่น

   ssh -p 443 -R0:localhost:8000 -o StrictHostKeyChecking=no -o ServerAliveInterval=30 -t [email protected]

   สำหรับกรณีไม่ใช่ web หรือไม่สนใจเรื่อง Host header ไม่ต้องใส่ x:localServerTls และ u:host

2. ใช้โดเมนของตนเอง (Pinggy Pro): หากเป็นสมาชิก Pinggy Pro สามารถตั้งค่า custom domain ได้ ดูรายละเอียดวิธีตั้งค่าที่เอกสาร Pinggy

3. อุโมงค์ถาวร (ใช้ autossh): หากต้องการให้ tunnel เปิดตลอดแต่กลัวหลุด แนะนำใช้ autossh ซึ่งจะดูแลการเชื่อมต่อและต่ออุโมงค์อัตโนมัติเมื่อล่ม ติดตั้ง autossh (เช่นบน macOS brew install autossh) แล้วเรียกใช้แบบนี้:

   autossh -M 0 -t "ssh -p 443 -R0:localhost:443 -o StrictHostKeyChecking=no -o ServerAliveInterval=30 -t [email protected] x:localServerTls:servbay.new \"u:host:servbay.new\""

   พารามิเตอร์ -M 0 สั่งให้ไม่ต้องใช้พอร์ตเสริมในการ monitor ให้ autossh เช็คด้วย ServerAliveInterval แทน

4. Pinggy แบบไม่ต้องส่ง Token ในคำสั่ง: Pinggy มีโหมดที่ไม่ต้องใส่ username/token ในคำสั่ง เพียงเข้าเว็บเพื่อรับคำสั่งหนึ่งครั้งแล้วนำมาใช้ เหมาะกับการแชร์หรือแจกคำสั่งให้คนอื่น โดยไม่ต้องห่วง token หลุด

ตัวอย่างสถานการณ์ที่นิยมใช้

• นำเสนอระยะไกล: โชว์เว็บไซต์/แอปที่พัฒนาบน ServBay ให้ลูกค้าหรือทีมเห็นโดยไม่ต้อง deploy จริง
• ดีบัก Webhook: รับ Webhook จากภายนอก (เช่นจาก Gateway, GitHub ฯลฯ) มาดีบักในแวดล้อม local ได้เลย
• ทดสอบข้ามอุปกรณ์: เปิดดูเว็บ local ของตนเองจากมือถือ/แท็บเล็ต เครื่องอื่นๆ ได้แม้อยู่ต่าง network
• ทำงานร่วมในทีม: ให้เพื่อนร่วมทีมเข้าถึงหรือทดสอบบริการที่ run ใน ServBay เครื่องตัวเองได้ง่ายขึ้น

การแก้ปัญหาที่พบบ่อย

อาการ	วิธีแก้ไข
SSH ต่อไม่ติด/ค้าง/หลุด	ตรวจสอบเน็ตเวิร์ค เปิดพอร์ต 443 ออกขาออกได้ไหม ลอง ping a.pinggy.io เช็คชื่อผู้ใช้ว่าใส่ถูกหรือไม่
URL ที่ Pinggy แจกเข้าไม่ได้ / เกิด error (เช่น 502 Bad Gateway)	เช็คว่าเว็บ/บริการใน ServBay รันอยู่จริง และฟังอยู่พอร์ต localhost:443 (หรือพอร์ตที่ระบุใน -R) และ Config Caddy/Nginx ใน ServBay ให้ถูกต้อง
เปิด Pinggy แล้วเจอ 404 Not Found หรือหน้าเว็บไซต์ดีฟอลต์ของ ServBay	ถ้าเซ็ต virtual host หลายเว็บ ต้องตรวจสอบว่าในคำสั่ง SSH ได้กำหนด x:localServerTls กับ u:host เป็นโดเมนที่ต้องการแน่ๆ เช่น myproject.servbay.demo นี่คือกุญแจบอกให้เซิร์ฟเวอร์ใน ServBay ตอบเว็บที่ต้องการ
มีอาการหลุดเป็นช่วงๆ	อาจเป็นเพราะเน็ตหลุดหรือ SSH timeout ให้ลองเพิ่ม ServerAliveInterval หรือใช้ autossh (ดูหัวข้อเทคนิคขั้นสูงด้านบน)
ใช้ HTTPS แล้วขึ้น Error ของ Certificate	ปกติ Pinggy ออก CA สาธารณะให้ผู้ใช้ฟรี แต่ถ้าใน ServBay ใช้ self-signed cert เบราว์เซอร์อาจเตือน, Pinggy CA จะช่วยให้ไม่เตือน ขอเพียงใน ServBay รันบริการบน HTTPS จริง (พอร์ต 443)

สรุปข้อดีแนวทางนี้

Pinggy ทำให้ผู้ใช้ ServBay เปิดบริการ Local สู่ภายนอกได้ง่ายและรวดเร็ว ด้วยข้อดีหลักๆ คือ

• ไม่ต้องติดตั้งไคลเอนต์เสริม: ลดความยุ่งยากทั้งด้านตั้งค่าและการใช้งาน
• คำสั่งเดียวก็พร้อมใช้งาน: รัน SSH พร้อมพารามิเตอร์ก็เปิดอุโมงค์ได้เลย
• รองรับ HTTPS อัตโนมัติ: Pinggy แจกใบรับรอง CA ฟรี แก้ปัญหา certificate สำหรับการเข้าถึงจากภายนอก
• รองรับ HTTP และ TCP Tunnel: รองรับงานบริการหลากหลายประเภท
• ทำงานร่วมกับ ServBay ได้ดีมาก: กำหนด Host header ได้ตรงเป๊ะ บอกได้ว่าจะเผยแพร่เว็บใด
• โหมดไม่ต้องใช้ token ในคำสั่ง: แชร์คำสั่งให้คนอื่นใช้ได้อย่างปลอดภัยขึ้น

เมื่อเทียบกับเครื่องมือทะลุเน็ตเวิร์กแบบอื่นที่ซับซ้อน ต้องลงไคลเอนต์เองหรือเซ็ตไฟล์ config มากมาย Pinggy เป็นทางเลือกที่เบาและสะดวก เหมาะกับ dev ServBay ที่ต้องการทดสอบ-แชร์-เดโมเว็บอย่างรวดเร็ว หากต้องการความเสถียรสูงหรือโดเมนกำหนดเองสำหรับงานจริง สามารถอัปเกรดเป็น Pinggy แผนเสียเงิน ผสมผสานจุดเด่นของ ServBay แวดล้อมพัฒนา local กับ Pinggy ทำให้ขั้นตอน dev และการร่วมทีมของคุณง่ายขึ้นอีกระดับ!