วิธีใช้ Cloudflare Tunnel เชื่อม Localhost ออกเน็ต โดยไม่ต้องเปิด Port

เชื่อว่า Developer ทุกคนต้องเคยเจอปัญหานี้: เขียนเว็บเสร็จแล้วในเครื่อง (Localhost) แต่อยากส่งให้ลูกค้าดู หรืออยากจะทดสอบ Webhook จาก Line, Stripe หรือ Facebook แต่ติดปัญหาเรื่อง Network จะทำ Port Forwarding ที่ Router ก็ยุ่งยาก แถมเน็ตบ้านสมัยนี้ส่วนใหญ่เป็น Private IP (CGNAT) ที่ทำยังไงก็เปิด Port ไม่ได้

วันนี้ Superdev Academy จะพาไปรู้จักกับทางออกที่ดีที่สุดในยุคนี้ นั่นคือ Cloudflare Tunnel ครับ

Cloudflare Tunnel คืออะไร?

Cloudflare Tunnel (ชื่อเดิมคือ Argo Tunnel) เป็นส่วนหนึ่งของบริการ Cloudflare Zero Trust มันทำหน้าที่สร้าง "ท่อ" ที่ปลอดภัยเชื่อมต่อระหว่าง Server ในเครื่องของเรา (ไม่ว่าจะอยู่ในบ้าน, Office หรือ Data Center) เข้ากับ Network ของ Cloudflare โดยตรง

ความเจ๋งคือ: ปกติเวลาคนจะเข้าเว็บเรา เขาต้องวิ่งมาหาเรา (Inbound) แต่ Cloudflare Tunnel จะให้เครื่องเราวิ่งไปหา Cloudflare เอง (Outbound) ทำให้เราไม่ต้องเปิด Port ใดๆ บน Router เลยแม้แต่ Portเดียว!

ทำไมต้องใช้ Cloudflare Tunnel? (เทียบกับ ngrok)

ฟรีและไม่จำกัด: ต่างจาก ngrok ตัวฟรีที่โดนจำกัดทั้งเวลาและ Bandwidth
ใช้ Domain ตัวเองได้: คุณสามารถเชื่อมต่อเข้ากับ Domain ที่คุณมีอยู่ใน Cloudflare ได้ทันที
ปลอดภัยสูง: ซ่อน Public IP ของเครื่องเราอย่างมิดชิด และได้ระบบป้องกัน DDoS จาก Cloudflare มาช่วยกรอง Traffic
HTTPS อัตโนมัติ: ไม่ต้องปวดหัวกับการทำ SSL Certificate เพราะ Cloudflare จัดการให้เสร็จสรรพ

🔒 ปิดประตูบ้านถาวร (Zero Attack Surface):

ปกติการทำ Port Forwarding คือการแง้มประตูบ้านทิ้งไว้ให้คนข้างนอกเข้ามาหาเราได้ ซึ่งเสี่ยงต่อการโดน Scan หาช่องโหว่ แต่ Cloudflare Tunnel จะทำการ "ปิดประตูสนิท" ไม่ต้องเปิด Port ใดๆ และไม่เปิดเผย Public IP ของเน็ตบ้านเราเลยแม้แต่นิดเดียว (Zero Attack Surface) ทำให้แฮกเกอร์หาทางเข้าเครื่องเราไม่เจอครับ

🛠 สิ่งที่ต้องเตรียมตัวก่อนเริ่ม (Prerequisites)

เพื่อให้การติดตั้ง Cloudflare Tunnel เป็นไปอย่างรวดเร็วและไม่ติดขัด คุณควรเตรียม 3 สิ่งนี้ให้พร้อมครับ:

1. บัญชี Cloudflare (Free Account)

ทำไมถึงต้องมี: เราต้องใช้ระบบจัดการของ Cloudflare Zero Trust ในการสร้างและควบคุม Tunnel
ข้อแนะนำ: เพียงแค่บัญชีแบบ Free Plan ก็เพียงพอสำหรับการใช้งาน Tunnel แล้วครับ คุณไม่จำเป็นต้องเสียเงินเพื่อใช้งานฟีเจอร์พื้นฐานนี้ โดยสามารถสมัครได้ที่ dash.cloudflare.com

2. Domain Name ที่จัดการผ่าน Cloudflare DNS

หัวใจสำคัญคือ Cloudflare Tunnel จะทำงานไม่ได้เลยถ้าไม่มีที่อยู่ (Domain) ให้มันยึดครับ

สิ่งที่ต้องเช็ก:

ต้อง Active: เข้าไปดูในหน้า Dashboard ของ Cloudflare ให้ชัวร์ว่าโดเมนเราขึ้นสีเขียว Active แล้วนะ
ย้ายค่าย DNS: ใครที่จดโดเมนไว้ที่อื่น (เช่น GoDaddy หรือ Namecheap) อย่าลืมเปลี่ยนค่า Name Server มาใช้ของ Cloudflare ให้เรียบร้อย

เหตุผลเพราะ Tunnel มันจะแอบไปสร้าง 'ทางลัด' หรือ CNAME Record ให้เราเองแบบอัตโนมัติครับ สะดวกสุดๆ!

3. Service หรือ Application ที่รันอยู่ในเครื่อง (Localhost)

ทำไมถึงต้องมี: Tunnel คือทางผ่าน ดังนั้นต้องมี "ปลายทาง" เตรียมรอไว้เพื่อให้ Traffic วิ่งไปถึง
ตัวอย่าง:
- Web App: หากคุณรัน Next.js, React หรือ Vue อยู่ในเครื่อง ให้เช็กว่ารันอยู่ที่ Port อะไร (เช่น http://localhost:3000)
- Backend: หากเป็น API ที่เขียนด้วย Go, Python หรือ Node.js (เช่น http://localhost:8080)
- Docker: หากรันผ่าน Container ตรวจสอบให้แน่ใจว่า Container นั้นทำงานอยู่ปกติและเราทราบ Internal Port ของมัน

Tip: ก่อนจะทำ Tunnel ให้ลองเข้าเว็บผ่าน Browser ในเครื่องตัวเองให้ได้ก่อน เพื่อยืนยันว่า Service ของเราทำงานได้ปกติครับ

Step-by-Step: วิธีการติดตั้งและตั้งค่า

ในบทความนี้เราจะใช้วิธีที่จัดการง่ายที่สุดผ่านหน้า Cloudflare Dashboard (Remote Config) ครับ

1. สร้าง Tunnel ใน Dashboard

เข้าไปที่หน้า Cloudflare Zero Trust
ไปที่เมนู Networks > Tunnels
กดปุ่ม Add a Tunnel เลือกเป็นแบบ Cloudflare (Managed)
ตั้งชื่อ Tunnel ของคุณ (เช่น superdev-local-server) แล้วกด Save

2. ติดตั้ง Connector (แนะนำวิธี Docker)

ในหน้าจอถัดไป Cloudflare จะมีคำสั่งให้เลือกตาม OS แต่สำหรับชาว Superdev เราแนะนำให้ใช้ Docker เพราะจัดการง่ายและไม่รกเครื่องครับ

คัดลอกคำสั่งที่ได้จากหน้าจอ (ซึ่งจะมี Token เฉพาะของคุณ) มาวางใน Terminal:

Bash
docker run cloudflare/cloudflared:latest tunnel --no-autoupdate run --token <YOUR_TOKEN_HERE>

เมื่อรันแล้ว สถานะในหน้า Dashboard จะเปลี่ยนเป็น Healthy แสดงว่า "ท่อ" ของเราเชื่อมต่อสำเร็จแล้ว!

3. ตั้งค่า Public Hostname

ขั้นตอนสุดท้ายคือการบอก Cloudflare ว่าจะให้ Domain ไหนวิ่งมาที่เครื่องเรา:

Subdomain: เช่น dev
Domain: เลือกโดเมนของคุณ
Service Type: เลือก HTTP (สำหรับ Web App ทั่วไปที่ยังไม่มี SSL ในเครื่องตัวเอง)
URL: > * กรณีรัน App ปกติ (Non-Docker): กรอก localhost:3000
- กรณีรัน Tunnel ผ่าน Docker (ตามขั้นตอนที่ 2): ให้กรอก host.docker.internal:3000 แทนคำว่า localhost ครับ เพื่อให้ Container ของ Cloudflare มองเห็นโปรเจกต์ที่รันอยู่บนเครื่อง Host ของเรา

💡 Tip สำหรับชาว Docker: > สาเหตุที่ต้องใช้ host.docker.internal เพราะถ้าเราใส่ localhost เฉยๆ ตัว Cloudflare Connector จะพยายามมองหา App ภายในตัวมันเอง ซึ่งหาไม่เจอแน่นอน การใช้คำสั่งนี้คือการบอกให้มันวิ่งกลับออกไปหาเครื่องคอมพิวเตอร์หลักของเรานั่นเองครับ

ลองทดสอบดูเลย!

ตอนนี้คุณสามารถเข้าเว็บที่รันอยู่ในเครื่องตัวเองผ่าน https://dev.yourdomain.com ได้จากทุกที่ทั่วโลกแล้วครับ! ไม่ว่าคุณจะใช้เน็ตหอพัก เน็ตมือถือ หรือเน็ตออฟฟิศที่ Firewall หนาแค่ไหน Cloudflare Tunnel ก็เอาอยู่

หมายเหตุ: ในการเข้าใช้งานครั้งแรกอาจจะรู้สึกว่าช้ากว่าการเข้า localhost เล็กน้อย เพราะข้อมูลต้องวิ่งไปที่ Network ของ Cloudflare ก่อน แต่ความเสถียรและความปลอดภัยที่ได้มานั้นคุ้มค่าแน่นอนครับ!

Pro Tip: เพิ่มความปลอดภัยด้วย Zero Trust Access

ถ้าคุณเอาไว้ตรวจงานข้างในทีม และไม่อยากให้คนนอกที่รู้ URL เข้ามาดูได้ คุณสามารถไปที่เมนู Access > Applications เพื่อสร้างหน้า Login กั้นไว้ได้ (เช่น ให้เฉพาะคนที่มี Email @company.com เท่านั้นที่เข้าได้) ซึ่งทั้งหมดนี้ "ฟรี" สำหรับผู้ใช้งานไม่เกิน 50 คนครับ

สรุป

Cloudflare Tunnel คือเครื่องมือที่ช่วยให้ชีวิต Developer ง่ายขึ้นมาก ทั้งเรื่องความปลอดภัย ความสะดวก และประหยัดค่าใช้จ่าย ใครที่ยังใช้วิธีแบบเดิมๆ อยู่ แนะนำให้ลองเปลี่ยนมาใช้ดูครับ แล้วจะลืมการทำ Port Forwarding ไปเลย!

ติดตามเทคนิคดีๆ สำหรับโปรแกรมเมอร์ได้ที่ Superdev Academy ครับ

อ่านบทความ Series อื่นๆ:

Follow Us: