ทำ PHP LINE Webhook ง่ายๆ ไม่ต้องง้อ Server ด้วย ngrok(EP.7)
กราบสวัสดี ท่านผู้อ่านทุกท่านที่เคารพรัก น้องกวิ้นกลับมาแล้ววว กลับมาพร้อมกับบทความที่หวังว่าจะเป็นประโยชน์ต่อทุกท่านอีกเช่นเคย ถ้าพร้อมแล้วก็ไปลุยกันเลย
สำหรับคนที่เขียนภาษา PHP สำหรับการทำ LINE Chatbot นั้นทุกคนจะรู้กันดีว่าการที่เราจะสามารถทดสอบ LINE Webhook ได้ หรือ ทดสอบ Chatbot ที่เราเขียนได้นั้นจะต้องทดสอบผ่าน Webhook ที่เป็น Https เท่านั้นซึ่งนั่นหมายความว่าเราจะต้องทำการ Deploy ขึ้น Server ทุกครั้งนั่นเอง แถมเราจะต้องมี Domain ที่เป็น Https ด้วยนะ แต่ว่าถ้าเกิดเราสามารถทำให้เครื่องเราสามารถที่จะทดสอบ LINE Chatbot ที่เราเขียนขึ้นมาได้โดยที่เราไม่ต้องไปหาเครื่อง Server มา Deploy ละ มันจะสะดวกขนาดไหน วันนี้กวิ้นจะมาพาทุกคนทำให้เครื่องคอมของเราสามารถที่จะรองรับ Webhook ได้กัน ส่วนจะต้องทำยังไงบ้างตามมาดูกันเลย
PART 1 — สมัคร และ ติดตั้ง ngrok
ก่อนอื่นเลยเราจะต้องมาทำความรู้จักพระเอกในวันนี้ของเราซะก่อน นั่นก็คือเจ้า ngrok ตัวนี้ของเรานั่นเอง ซึ่งเจ้าตัว ngrok เนี่ยเป็น Tool Open Source ซึ่งมันสามารถทำให้ Website หรือ Application ที่เราทำการ Run อยู่บนเครื่องของเราสามารถที่จะ Online ได้นั่นเอง โดยหลักการจะเป็น ประมาณนี้
ก่อนอื่นเราจะต้องทำการสมัครใช้งานซะก่อนโดยเข้าไปที่ https://dashboard.ngrok.com/signup หลังจากนั้นให้เราทำการสมัครสมาชิก โดยจะใช้ Email หรือจะใช้การ Sign up ผ่านทาง Google หรือ Github ก็ตามแต่จะสะดวกเลย
เมื่อเราทำการ Sign up เรียบร้อยแล้วก็ให้เราทำการ Sign in เพื่อเข้าสู่หน้า Console ของ ngrok
เมื่อเราเข้ามาถึงหน้านี้แล้วให้ทำการ Download ngrok ก่อนโดยที่สามารถเลือกตาม OS ของเราได้เลย (กวิ้นขอยกตัวอย่างเป็น Mac OS นะจ๊ะ)
เมื่อเราทำการ Download มาแล้วเราจะได้มาเป็น File Zip แบบนี้
ให้เราทำการ Unzip ออกมาจะได้เป็นไฟล์แบบนี้
หลังจากนั้นให้เราทำการเปิด Terminal ของเราขึ้นมา และ cd ไปยัง Folder ที่ไฟล์ ngrok ของเราอยู่
ให้เราทำการ Copy คำสั่งจากในหน้า ngrok Console
ไปวางที่ Terminal แบบนี้ อย่าลืมสังเกตุว่าชื่อของ ngrok จะต้องตรงกับ ไฟล์ที่เราทำการ Unzip มาด้วยนะ ถ้าหากว่าเราทำการเปลี่ยนชื่อไฟล์ จะต้องเปลี่ยนค่าให้ตรงด้วย
หลังจากนั้นให้ทำการ Enter เมื่อสำเร็จจะขึ้นแบบนี้
เมื่อขึ้นแบบนี้แล้วแปลว่าเราทำการ Setup ngrok สำเร็จ และพร้อมที่จะ Run แล้ว
PART 2— Run PHP
เมื่อเราทำการ Setup ngrok เรียบร้อยแล้วเราก็จะมาทำการ เตรียมความพร้อมฝั่งของ PHP ของเรากันบ้าง ให้เราทำการเขียนไฟล์ PHP สำหรับการรับค่าจาก Webhook ขึ้นมา ถ้าใครยังไม่เคยเขียนให้ไปดู EP.1 ก่อนนะจ๊ะ
เมื่อเราทำการเขียน Code สำหรับรองรับ Webhook เรียบร้อยแล้วก็ให้เราทำการ เปิด Terminal ขึ้นมาอีกครั้ง และทำการ cd เข้าไปยัง Folder ที่ไฟล์ PHP ของเราเขียนไว้และทำการ Run คำสั่ง php -S 127.0.0.1:8080 เพื่อ Start Local Server ของเราขึ้นมา
PART 3— Run ngrok
เมื่อเราทำการ Run PHP เรียบร้อยแล้ว ต่อมาเราก็จะมาทำการ Run ฝั่ง ngrok กันบ้างให้เราทำการ เปิด Terminal ขึ้นมาใหม่อีก Tab และ ทำการ Cd เข้าไปที่ Folder ที่เราทำการ Unzip ngrok ไว้ และ ทำการ Run คำสั่ง ./ngrok http -region jp 8080 (Port จะต้องตรงกับที่เราทำการ Set ตั้งแต่ตอนที่เรา Run PHP ด้วยนะ) เมื่อ Run แล้วจะขึ้นหน้าจอแบบนี้
สังเกตุเห็นอะไรกันไหมเอ่ยยยย ถั่วต้มแล้วครับเราจะได้ Link ที่เป็น Https มาแล้วนั่นเอง ส่วน Region ที่เราเห็นเป็น Japan ไม่ต้องตกใจไป นั่นเพราะว่าเราทำการ Set Region ให้เป็น Japan ตอนที่เราสั่ง Run ngrok นั่นเอง เพื่อให้ Webhook ของเราได้รับข้อความมาแบบไม่สะดุด และ ไม่ขาดหายไป
PART 4— Link LINE Webhook
ให้เราทำการ Copy Link ที่เป็น Https
และนำไปใส่ใน Webhook URL
ทดสอบกันสักหน่อย
ตอบแล้วววว !!!!
เป็นยังไงกันบ้างครับสำหรับ EP นี้หวังว่าเพื่อนๆ จะสนุกไปกับการได้ทดลองทำกันนะครับ พบกันใหม่ EP หน้า สำหรับวันนี้ บ๊ายบายยย
ตอนนี้ LINE Developers เรามีแฟนเพจแล้วนะจ๊ะอย่าลืมไปกด LIKE กันด้วยนะ
https://www.facebook.com/LINEDEVTH
ส่วนใครที่ยังไม่ได้เข้าร่วมกลุ่มกับเรา คลิ๊กที่นี่ได้เลย
https://www.facebook.com/groups/LINEDEVTH
Resources
Developer console
https://developers.line.biz/en/
Messaging API Document
https://developers.line.biz/en/docs/messaging-api/
Messaging API Reference
https://developers.line.biz/en/reference/messaging-api/
