Dev local webhook ของ UnifyPort ด้วย ngrok

ngrok แก้ปัญหาอะไร

คำสั่งเดียวก็ได้ HTTPS URL สาธารณะที่ forward ทุก request ไปยังพอร์ตในเครื่อง. ทุก traffic ที่ผ่านถูก inspector จับที่ http://127.0.0.1:4040 — มี headers, body, timing และปุ่ม replay พร้อม. inspector นี่แหละคือเหตุผลที่เรายังใช้ ngrok อยู่ แม้จะมี tunnel ฟรีตัวอื่น ๆ: มันบีบสิ่งที่ปกติต้องไล่ log ให้เหลือแค่เหลือบมองตา.

Setup handler UnifyPort ภายในห้านาที

สมมติ handler ฟังอยู่ที่ port 3000:

1. 1. ngrok http 3000 — copy URL https://*.ngrok-free.app ที่มันพิมพ์ออกมา.
2. 2. ลงทะเบียน URL ผ่าน POST /v1/webhook-endpoints — ตั้ง url เป็น https://<your-tunnel>.ngrok-free.app/events และเลือก subscribed_events ที่ต้องการ (ตอน iterate ใช้ ["*"] รับทั้งหมดก็ได้).
3. 3. เปิด http://127.0.0.1:4040 บน browser. Trigger อีเวนต์จากฝั่ง provider — DM ใน Telegram, ข้อความ WhatsApp — แล้วดูมันเข้ามา.
4. 4. ใช้ปุ่ม replay ส่ง delivery เดิมไปยัง handler ที่อัปเดตแล้ว. นี่คือสิ่งที่ทำให้ ngrok เร็วกว่าการไปยุให้ provider ยิงอีเวนต์ซ้ำทุกครั้งที่เปลี่ยนโค้ด.

ตรวจสอบลายเซ็นที่เครื่อง local

tunnel ngrok แพ็กฟรีตัด TLS ที่ upstream, ดังนั้นเวลา handler เห็น request นั้น body ถูกถอดแล้ว — เป็นไบต์ที่ UnifyPort เซ็นพอดี. แปลว่าการ verify ลายเซ็นทำเหมือน production: คำนวณ hex(HMAC-SHA256(secret, timestamp + "." + body)) แล้วเทียบกับ header X-Device-Signature. ถ้าอยากยืนยันด้วยมือก่อนเพิ่มโค้ด, recipe CyberChef ของเราทำอัลกอริทึมเดียวกันใน browser.

เมื่อ ngrok ไม่ใช่คำตอบที่ดีที่สุดแล้ว

• สภาพแวดล้อม staging หรือ demo. URL ฟรีเปลี่ยนทุกครั้งที่ restart, ทำให้ config ระยะยาวเสีย. ขึ้นแพ็กเสียเงินใช้ reserved domain — หรือสลับไปใช้ Cloudflare Tunnel เพื่อชื่อ host คงที่ฟรี.
• Load test ความถี่สูง. ngrok ฟรี throttle หนักมาก. หรืออัปเกรด หรือไปรัน handler ในสภาพแวดล้อมจริง.
• Workflow ที่ใช้แต่ webhook ไม่มี HTTP traffic อื่น. smee.io เบากว่า — ไม่ต้องลง binary, แค่ client script.