LINE Chatbot

โครงการอบรมนักวชิ าการคอมพวิ เตอร์
และพนกั งานคอมพิวเตอรป์ ระจา
หน่วยงานศาลยุติธรรมทั่วประเทศ

LINE Chatbot
29-31 มนี าคม 2564

Day 1 1
- Why are Chatbots useful? 3
- Prerequisites and Software 4
- LINE Messaging API overview 6
- Setting up a LINE Official Account 9
- Becoming a LINE Developer 11
- Creating a Provider 13
- Creating a Channel 18
- Webhook events 29
- Message Objects 37
- LINE Bot Designer

1|Page

Why are Chatbots useful?

- Chatbot คืออะไร

สำหรับนิยำมหรือควำมหมำยของ Chatbot เพ่อื ให้ทรำบทีม่ ำท่ีไป ขออธิบำยเกีย่ วกับคำวำ่ Bot ก่อน โดย
เบื้องต้นนั้น Bot จะเป็นคำเรียกย่อๆ ของคำว่ำ Robot ซึ่งก็คือโปรแกรมที่สำมำรถทำงำนตำมท่ีผู้พัฒนำกำหนด
เม่ือได้รับคำส่ังหรืออำจทำงำนได้เองอัตโนมัติตำมเงื่อนไขท่ีผู้พัฒนำกำหนด เช่น Bot ท่ีใช้ในกำรเก็บข้อมูลจำก
เว็บไซต์ Bot ที่ใช้ในเกม ดังน้ันกำรเรียกหรือกล่ำวถึงคำว่ำ Bot เฉยๆ ผู้ฟังอำจจะเข้ำใจหรือนึกถึงได้หลำย
ควำมหมำย ดังนน้ั Bot ที่นำมำใชส้ ำหรับกำร Chat เพอื่ ใหเ้ กิดควำมชัดเจน จงึ เรียกวำ่ Chatbot

สำหรับ Chatbot น้ัน ส่วนใหญ่แล้วผู้พัฒนำจะกำหนดให้ Chatbot สำมำรถทำงำนได้เองอัตโนมัติ ตำม
เงื่อนไขท่ีผู้พฒั นำกำหนด เชน่ กล่ำวสวสั ดีเม่ือเร่ิมตน้ กำรสนทนำ ตอบคำถำมตำมเงื่อนไขท่ีกำหนดไว้ แต่อยำ่ งไรก็
ตำมในปัจจุบัน เทคโนโลยีปัญญำประดิษฐ์ (Artificial Intelligence) ได้รับกำรพัฒนำไปอย่ำงรวดเร็ว ส่งผลให้
Chatbot น้นั มกี ำรนำปญั ญำประดิษฐ์เขำ้ มำประยุกตใ์ ช้ ทำให้ Chatbot สำมำรถเขำ้ ใจคำถำมและตอบคำถำมได้
ถูกต้องมำกยิ่งข้นึ รวมถึงหำกคำถำมไมช่ ดั เจน จะสำมำรถถำมคำถำมกลบั ไปยังคสู่ นทนำได้ด้วย ซงึ่ ไม่ว่ำจะเป็นกำร
ตอบกลบั หรอื กำรถำมกลับนนั้ จะเปน็ ไปตำมเงอ่ื นไขทผี่ ้พู ัฒนำกำหนดไว้

- Chatbot มปี ระโยชนอ์ ยา่ งไร

ปัจจุบันกำรใช้งำน Chatbot มีควำมจำเป็นมำกข้ึน ซ่ึงสำเหตุน่ำจะมำจำกกำรทำธุรกิจต่ำงๆ เร่ิมใช้
ชอ่ งทำงออนไลน์สำหรับติดต่อกับลูกค้ำ ซง่ึ บำงธุรกิจใช้กำร Chat สำหรับรับคำสั่งซ้ือสินค้ำจำกลูกค้ำ บำงธรุ กิจใช้
กำร Chat สำหรับให้บริกำรลูกค้ำ ซึ่งไม่ว่ำจะใช้เพ่ือวัตถุประสงค์ใดก็ตำม สิ่งหน่ึงที่ธุรกิจต่ำงๆ พยำยำมทำให้
เกิดข้ึนคือ กำรเปิดให้บริกำร 24 ช่ัวโมง ซึ่งบำงท่ำนอำจจะมองว่ำปกติ อีคอมเมิร์ซ (e-Commerce) ปกติก็
ให้บริกำรได้ 24 ชว่ั โมงอยแู่ ล้ว แตพ่ ฤตกิ รรมของผบู้ รโิ ภคปัจจุบัน ต้องกำรกำรตดิ ตอ่ ส่ือสำรก่อนกำรซ้ือสนิ ค้ำ และ
หำกพบปัญหำนัน้ มักจะเลือกใช้ช่องทำงในกำรตดิ ต่อกับผู้ขำยโดยกำร Chat ดงั นน้ั ธรุ กจิ ตำ่ งๆ จงึ พยำยำมท่ีจะทำ
ใหช้ ่องทำงในกำร Chat สำมำรถมกี ำรโต้ตอบได้ 24 ช่วั โมง

กำร Chat นั้นจะมีประสิทธิภำพมำกหำกผู้ท่ีทำหน้ำท่ีให้บริกำรในจุดน้ีมีควำมรู้ควำมเข้ำใจ มีใจบริกำรที่
จะตอบคำถำมที่หลำกหลำย แต่กำรจะหำพนักงำนหรือเจ้ำหน้ำท่ีแบบน้ีน้ันไม่ใชเ่ ร่ืองง่ำยและแม้จะหำคนเหล่ำน้ีได้
คนก็จำเป็นต้องพักผ่อน จึงเป็นเร่ืองยำกท่ีจะสำมำรถให้บริกำรด้วยคนได้ตลอด 24 ช่ัวโมง และแม้จะทำได้ก็
จำเป็นต้องใช้งบประมำณหรือค่ำตอบแทนท่ีสูงตำมไปด้วย ทำให้ธุรกิจส่วนใหญ่จะใช้คนในเวลำทำกำร และใช้
Chatbot นอกเวลำทำกำร

2|Page

โดยสิง่ ท่ีมักจะให้ Chatbot ชว่ ยติดตอ่ กับลกู ค้ำหรอื ตอบคำถำมนั้น เบื้องตน้ มักเปน็ กำรรบั เร่ือง ซง่ึ จะช่วย
ให้ลูกค้ำรู้สึกว่ำสิ่งท่ีสอบถำมไป เด๋ียวถึงเวลำท่ีสะดวกทำงเจ้ำของธุรกิจจะเข้ำมำตอบคำถำม แต่หำก Chatbot ที่
พัฒนำนั้น มีกำรกำหนดเง่ือนไขต่ำงๆ เข้ำไประดับหน่ึง Chatbot จะสำมำรถช่วยตอบคำถำมได้ทันที ซ่ึงส่วนใหญ่
คำถำมเหล่ำน้ันมักจะเป็นคำถำมท่ีพบบ่อย (FAQ: Frequently asked questions) แต่หำกเป็นคำถำมท่ีซับซ้อน
Chatbot ไมส่ ำมำรถเข้ำใจได้ ก็จะตอบคำถำมในเชงิ รบั เรื่องแทน

สำหรับธุรกิจอ่ืนๆ สำมำรถนำ Chatbot มำประยุกต์ใช้งำนแทนเว็บแอปพลิเคชัน (Web Application)
และโมบำยแอปพลิเคชัน (Mobile Application) ได้ เนื่องจำกปัจจุบัน กำรใช้งำนแอปพลิเคชันสำหรับกำร
ติดต่อสื่อสำร เช่น LINE เป็นท่ีนิยมอย่ำงมำก กำรท่ีสำมำรถใช้งำนเกี่ยวกับกำรสอบถำมหรือค้นหำข้อมูลใน
เบ้ืองต้นผ่ำน LINE ได้เลย ก็จะสำมำรถเพิ่มควำมสะดวกให้กับผู้ใช้งำนได้เป็นอย่ำงมำก หรือหำกข้อมูลเหล่ำน้ันมี
ควำมเช่ือมโยงกับผู้ใช้งำนแบบเฉพำะตัว สำมำรถทำกำรพัฒนำเพ่ือให้เกิดกำรเช่ือมโยงระหว่ำงบัญชีผู้ใช้งำนของ
เว็บแอปพลิเคชันกับบัญชี LINE ได้ เมื่อผู้ใช้ทำกำรเชื่อมโยงแล้วจะสำมำถสอบถำมข้อมูลท่ีต้องกำรได้ทันที เช่น
ตัวอย่ำงของมหำวิทยำลัยรังสิตที่พัฒนำ LINE Chatbot เพ่ือช่วยในกำร สอบถำมเกรด ตำรำงเรียน ตำรำงสอน
ของนักศกึ ษำ ซึ่งช่วยสร้ำงควำมสะดวกให้กับนักศึกษำเป็นอยำ่ งมำก

หำกพิจำรณำในมุมมองของธุรกิจหรือองค์กร กำรพฒั นำ Chatbot บน Platform ทีม่ ผี ู้ใชง้ ำนจำนวนมำก
นับเป็นข้อดีและช่วยลดต้นทุนในกำรพัฒนำแอปพลิเคชัน หำกแอปพลิเคชันนั้นไม่ได้มีฟังก์ชันสำคัญท่ีจำเป็นต้อง
พัฒนำแบบเฉพำะทำง เพรำะระบบปฏิบัติกำรบนสมำร์ทโฟน แม้ปัจจุบันจะมีระบบปฏิบัติกำรหลักๆ เพียง 2
ระบบ คือ Android และ iOS แต่กำรพัฒนำแอปพลิเคชันบนสมำร์ทโฟน ควรพัฒนำเพ่ือให้รองรับกับท้ัง 2
ระบบปฏบิ ตั ิกำร ดงั น้นั กำรพฒั นำ Chatbot เพ่อื ใชง้ ำนบนแอปพลิเคชนั LINE นน้ั จะทำใหผ้ ใู้ ชง้ ำนสำมำรถใช้งำน
Chatbot ไดก้ บั ทุกระบบปฏบิ ตั ิกำรท่สี ำมำรถใช้งำน แอปพลิเคชัน LINE ได้ และทส่ี ำคญั LINE มเี ปน็ แอปพลิเคชัน
ที่มีผู้ใช้งำนท่เี ป็น Active Users ถงึ 44 ลำ้ นคน ในประเทศไทย

https://lineforbusiness.com/files/New_OA_47Users___1.jpg

3|Page

- Prerequisites and Software

- ระบบปฏิบัติการทใี่ ช้
สำมำรถใชร้ ะบบปฏบิ ัตกิ ำร Windows หรือ macOS รุ่นใดกไ็ ด้ที่สำมำรถติดตั้งซอฟต์แวร์ที่กำหนดได้ แต่
ขอแนะนำใหใ้ ช้ Windows 10 หรอื macOS Catalina

- ซอฟตแ์ วร์ที่ใช้
1. Node.js เทคโนโลยีที่พัฒนำโดยภำษำ JavaScript ท่ีสำมำรถใช้งำนได้ท้ังฝ่ัง Client และ Server ให้
ตดิ ต้ังตวั ท่เี ปน็ LTS สำมำรถดำวน์โหลดไดจ้ ำก https://nodejs.org/en/

2. Postman สำหรับใช้ในกำรทดสอบ API (Application Programing Interface) ต่ำงๆ สำมำรถดำวน์
โหลดได้จำก https://www.getpostman.com/

3. LINE Bot Designer สำหรับใช้ในกำรสร้ำง Prototype ในรูปแบบต่ำงๆ ซึ่งสำมำรถนำมำใช้กับ
Chatbot ได้ สำมำรถดำวนโ์ หลดได้จำก https://developers.line.biz/en/bot-designer/download/

4. Rich Menu Maker สำหรับใช้ในกำรสร้ำง Rich Menu สำมำรถใช้งำนผ่ำน Browser ได้เลยท่ี
https://lineforbusiness.com/richmenumaker/

5. Ngrok สำหรับใช้ในกำรสร้ำงช่องทำงในกำรเชอื่ มต่อจำก Local Server ให้อุปกรณ์ภำยนอกเครือข่ำย
สำมำรถเข้ำใช้งำนได้ และสำมำรถรองรับกำรเชื่อมต่อในรูปแบบของ https สำมำรถดำวน์โหลดได้จำก
https://ngrok.com/download

6. Git สำหรับใช้เป็น Version Control System ซึ่งจะช่วยให้เกิดควำมสะดวกในกำรทำงำนร่วมกันเป็น
ทีม สำมำรถดำวน์โหลดได้จำก https://git-scm.com/

7. Visual Studio Code สำหรับใชเ้ ป็น Editor สำหรบั เขียนโค้ด HTML CSS JavaScript และ PHP (ให้
ตดิ ตัง้ Extension เพ่ิมเตมิ ) สำมำรถดำวนโ์ หลดได้จำก https://code.visualstudio.com/

8. XAMPP สำหรับใช้เป็นสภำพแวดล้อมในกำรพัฒนำโปรแกรมด้วยภำษำ PHP กับฐำนข้อมูล MariaDB
สำมำรถดำวน์โหลดไดจ้ ำก https://www.apachefriends.org/index.html

9. Email สำหรับใช้สมัครบริกำรต่ำงๆ เช่น LINE Business ID, Dialogflow, Heroku แนะนำให้ใช้
Gmail

4|Page

LINE Messaging API overview

- API (Applications Programming Interface) คืออะไร
API หรือส่วนต่อประสำนโปรแกรมประยุกต์ คือกำรเขียนโค้ดเพ่ือให้โปรแกรมอื่นๆ หรือแอปพลิเคชันอ่ืน
สำมำรถเชื่อมต่อกับโปรแกรมหรือฐำนข้อมูลของเรำได้ ซึ่งกำรสร้ำง API น้ัน จำเป็นต้องกำหนดข้อตกลงในกำร
รับส่งข้อมูลให้ชัดเจน เพื่อท่ีผู้พัฒนำโปรแกรมเชื่อมต่อกับ API จะสำมำรถเข้ำใจว่ำโปรแกรมจะติดต่อสื่อสำรกัน
อย่ำงไร ข้อมูลที่ส่งไปต้องส่งรูปแบบไหน และ API จะส่งข้อมูลอะไรกลับมำในรูปแบบใด ในช่วงก่อนหน้ำน้ีเรำมัก
ทำ API ในรูปแบบของ Webservice โดยใช้ SOAP (Simple Object Access Protocol) ซึ่งจะรับส่งข้อมูลใน
รูปแบบของ XML (Extensible Markup Language) แตป่ ัจจุบนั มกั API ในรูปแบบของ REST (Representational
state transfer) ซง่ึ รบั ส่งขอ้ มลู ในรปู แบบของ JSON (JavaScript Object Notation)
- LINE Messaging API
LINE ได้ให้บริกำร Messaging API สำหรับใช้พัฒนำ Chatbot ซ่ึงกำรทำงำนของ Messaging API จะ
อนุญำตให้มีกำรรับส่งข้อมูลระหว่ำง Chatbot กับ LINE Platform ซึ่งจะต้องส่งผ่ำน HTTPS (Hypertext
Transfer Protocol Secure) ในรูปแบบของ JSON ซ่ึงจะมีข้ันตอนกำรทำงำน ดังรูป ดงั น้ี

https://developers.line.biz/media/messaging-api/overview/messaging-api-architecture-cffb1d9b.png

จำกรูปดำ้ นบน มขี ้ันตอนดงั นี้
1) ผู้ใช้งำนสง่ ข้อควำมถึง LINE Platform (LINE official account)
2) LINE Platform สง่ ข้อควำมน้ันตอ่ ไปท่ี Webhook ซง่ึ เชอ่ื มต่อกบั Chatbot เอำไว้
3) Chatbot ทำกำรประมวลผลขอ้ ควำมท่ไี ด้รับ และตอบกลับไปยัง LINE Platform
4) LINE Platform สง่ ข้อควำมกลบั ไปยังผ้ใู ช้

5|Page

สำหรับข้อควำมที่ตอบกลับผ่ำน Messaging API มีหลำกหลำยรูปแบบไม่ว่ำจะเป็นข้อควำมธรรมดำ
รูปภำพ สติกเกอร์ นอกจำกน้ัน Chatbot ที่ทำงำนร่วมกับ Messaging API ยังสำมำรถรับค่ำเกี่ยวกับผู้ใช้ได้ เช่น
ชอ่ื ภำพโปรไฟล์ และเรำสำมำรถใช้ Chatbot สำหรบั พูดคุยสว่ นตวั หรอื เพมิ่ เขำ้ กลมุ่ กไ็ ด้

นอกจำกกำรทำงำนผ่ำน Chatbot แล้ว LINE ยังมี CMS (Content Management System) เพ่ือใช้
สำหรบั บริหำรจัดกำร LINE official account และสำมำรถใช้สง่ Push message เพื่อ Broadcast ขอ้ ควำมไปยัง
ผู้ใช้งำนท่ี Add LINE official account ไว้ (LINE จะนับจำนวนข้อควำม หำกต้องกำรใช้งำนเกินจำนวนที่กำหนด
จะมคี ำ่ ใชจ้ ำ่ ย) แต่หำกเปน็ ขอ้ ควำมท่ีตอบกลับ Reply message จะไม่เสียคำ่ ใช้จำ่ ย

https://developers.line.biz/assets/images/services/messaging-api-thumb0.png

6|Page

Setting up a LINE Official Account

- LINE OA (LINE Official Account)
เป็นบัญชีอย่ำงเป็นทำงกำรของ LINE ที่จะช่วยให้หน่วยงำนหรือองค์กำรสำมำรถเชื่อมโยงไปยังผู้ใช้งำน
LINE ได้ ซึง่ เบื้องต้นเมือ่ สมัครใช้งำน LINE ID จะเป็นแบบสมุ่ ซ่งึ หำกตอ้ งใช้ได้ LINE ID แบบ Premium ID ซึ่งเรำ
สำมำรถตั้งเองได้ จะมคี ่ำใช้จำ่ ยเพ่ิมเติมเปน็ รำยปี

https://lineforbusiness.com/files/Screen%20Shot%202020-09-10%20at%2013.23.51___2.png

ชนิดของบัญชี LINE OA จะมอี ยู่ 3 แบบ ดงั ภำพดำ้ นลำ่ งนี้

https://lineforbusiness.com/th/service/line-oa-features

7|Page

- การสมัครใช้งาน LINE Official Account Manager
1) สำมำรถสมัครผ่ำน URL https://manager.line.biz/ จะปรำกฏหน้ำจอดังรูปด้ำนล่ำงซ้ำย จำกน้ันให้
เลือก Create an account เมื่อเลือกแล้วจะปรำกฏหน้ำจอในกำร Sign up ดังรูปด้ำนล่ำงขวำ ให้เลือก Sign up
with LINE account จะสะดวกกวำ่ email

2) จำกน้ันจะปรำกฏหนำ้ จอใหท้ ำกำร Sign in ด้วย Account LINE ดงั รปู ดำ้ นล่ำงซำ้ ย โดยอำจมกี ำรส่ง
Code เพื่อทำกำร Verify ไปท่ี LINE แตห่ ำกเรำ Login LINE PC อยแู่ ลว้ จะปรำกฏหน้ำจอดงั รูปดำ้ นล่ำงขวำนี้

8|Page

3) หำก Login สำเร็จ จะปรำกฏหน้ำจอให้กรอกข้อมลู ในกำรสร้ำง Official Account ดงั ภำพด้ำนล่ำง ซง่ึ
หำกกรอกข้อมูลครบถ้วนแล้วให้กดปุ่ม Continue จะปรำกฏหน้ำจอให้ตรวจสอบรำยละเอียด จำกน้ันกดปุ่ม
Send จะเสร็จส้นิ ข้นั ตอนกำรสมคั ร ซง่ึ สำมำรถกดป่มุ LINE Official Account Manager ไดเ้ ลย

4) หลังจำกกดปุ่ม ระบบจะแสดงข้อตกลงเกี่ยวกับกำรใช้ข้อมูล ให้กดปุ่มยอมรับ จะเข้ำสู่หน้ำจอ LINE
Official Account Manager ดังรูปด้ำนล่ำงนี้ แต่หำกเรำมีกำรเข้ำใช้งำนก่อนหน้ำนี้แล้ว จะแสดงหน้ำจอให้เรำ
เลือก LINE Official Account ท่สี ร้ำงไว้

9|Page

Becoming a LINE Developer

- การสมัคร เปน็ LINE Developer
ก่อนที่จะทำกำรพัฒนำแอปพลิเคชันเก่ียวกับ LINE หรือใช้งำน API ต่ำงๆ ของ LINE จำเป็นต้องมีกำร
สมคั รเป็น LINE Developer ก่อน โดยทำตำมข้ันตอน ดงั น้ี
1) สมคั รผำ่ น URL https://developers.line.biz/ ปรำกฏหน้ำจอดงั รูปด้ำนลำ่ ง จำกนัน้ ใหเ้ ลือก Log in
จำก ปมุ่ ใดก็ได้

2) จะปรำกฏหน้ำจอให้ Log in เหมือนตอนสมัครใช้งำน LINE Official Account Manager เมื่อเลือก
Log in with LINE Account ดังรปู ดำ้ นล่ำงซำ้ ย จะปรำกฏหนำ้ จอดำ้ นรปู ดำ้ นล่ำงขวำ ให้เลอื ก Log in ได้เลย

10 | P a g e

3) เมอ่ื Log in สำเร็จ จะปรำกฏหน้ำจอเพื่อให้กรอกข้อมลู เก่ียวกบั ผพู้ ัฒนำ ดังภำพ ใหก้ รอกข้อมลู และ
กดปุ่ม Create my account

4) เมือ่ สร้ำง Account สำเร็จ จะปรำกฏหน้ำจอ ดงั ภำพ ซ่ึงเรำสำมำรถเข้ำถงึ ระบบของ LINE ในฐำนะ
นักพัฒนำ ที่จะสำมำรถสรำ้ ง Chatbot หรือใชง้ ำน API ตำ่ งๆ ของ LINE ได้ นอกจำกนัน้ ยังมี Link เกี่ยวกับ
เอกสำรและเคร่ืองมือท่จี ะช่วยนักพฒั นำ ในกำรพัฒนำ Chatbot ด้วย

11 | P a g e

Creating a Provider

- การสร้าง Provider
Provider ในที่นี้ เปรียบเสมือนกำรกำหนดช่ือบริษทั ชอ่ื นักพฒั นำ หรอื ชอื่ กลุ่มก็ได้ ซง่ึ เม่อื สร้ำง Provider
แล้วจะสำมำรถสร้ำง Channel ได้ ซ่ึง Channel จะเปรียบเสมือนแอปพลิเคชัน หรือ Chatbot ท่ีอยู่ภำยใต้
Provider ท่สี รำ้ งข้นึ โดยกำรสรำ้ ง Provider มขี ัน้ ตอน ดงั น้ี
1) จำก URL น้ี https://developers.line.biz/ หำก Log in แล้ว ในครั้งแรกจะปรำกฏหน้ำจอ ดังภำพ
สำมำรถกดปุ่ม Create a new provider เพ่อื สรำ้ ง Provider ได้เลย

หรือในกรณีที่เคยสร้ำง Provider ไว้ สำมำรถเลือก Add new provider ได้ โดยเลือกท่ีรูป Profile ก่อน
จำกนัน้ จะปรำกฏเมนูใหเ้ ลอื ก Add new provider ได้ ดงั รูปดำ้ นล่ำง

12 | P a g e

2) หลงั จำกกดป่มุ ระบบจะใหก้ รอกชื่อ Provider ดงั รูปด้ำนลำ่ ง เมอื่ กรอกเสร็จให้กดปุ่ม Create

3) เมอ่ื กดปุ่ม Create แล้วจะปรำกฏหนำ้ จอดงั ภำพด้ำนลำ่ ง เพอ่ื ใหท้ ำกำรสรำ้ ง Channel ต่อไป

13 | P a g e

Creating a Channel

- การสรา้ ง Channel
Channel ในท่ีน้ี จะเปรียบเสมือนแอปพลิเคชัน หรือ Chatbot ท่ีอยู่ภำยใต้ Provider ที่สร้ำงข้ึน ซึ่งใน
Provider หนึง่ สำมำรถสร้ำง Channel ไดม้ ำกกว่ำ 1 Channel โดยกำรสรำ้ ง Channel มขี น้ั ตอน ดงั นี้
1) จำกหน้ำจอ Providers เม่ือเรำเลือก Provider ท่ีต้องกำรจะปรำกฏ Tab Channels ซ่ึงเรำสำมำรถ
เลือกสร้ำง Channel ตำมประเภทที่เรำต้องกำร ซึ่งในท่ีนี้เรำจะสร้ำง Channel ประเภท Messaging API
channel

2) ซง่ึ จะปรำกฏหนำ้ จอให้ระบุรำยละเอยี ดเกี่ยวกับ Channel เช่น ช่ือ รำยละเอยี ด กลุ่ม ใหเ้ รำระบุ
รำยละเอยี ดให้เหมำะสมกับ Chatbot ของเรำ เมื่อระบุรำยละเอียดต่ำงๆ ครบถ้วนแล้ว ใหย้ อมรับข้อตกลงในกำร
ใช้งำน จำกน้ันกดปุ่ม Create ดังรูปดำ้ นลำ่ ง

14 | P a g e

3) เมอื่ กดปุ่ม Create จะปรำกฏหนำ้ จอ แสดงข้อตกลงเกี่ยวกับกำรใช้ข้อมูล ดังรูปด้ำนล่ำง ใหเ้ รำกด
ยอมรับ

15 | P a g e

4) เมื่อสร้ำงสำเร็จจะปรำกฏหนำ้ จอ ดังรปู ด้ำนล่ำงนี้

5) สำหรับ Tab ท่ีสำคัญที่เรำต้องเข้ำไปใช้งำนคือ Messaging API ซึ่งจะมีข้อมูลของ Chatbot ท่ีสำคัญ
เช่น Webhook URL กำรกำหนด Feature เบื้องตน้ Channel access token

16 | P a g e

6) ซึ่งหำกเรำเขำ้ ไปทห่ี น้ำจอ LINE OA Manager จะพบ Channel ทีเ่ รำสรำ้ งขึ้น ปรำกฏเป็น 1 Account
ใหเ้ รำเขำ้ ไปตง้ั คำ่ ตำ่ งๆ และใชง้ ำน Messaging API ได้

7) ทดสอบ Add LINE Chatbot โดยคน้ หำตำม ID หรอื Scan QR Code ดังรปู

17 | P a g e

8) เมอ่ื ค้นหำหรือ Scan สำเร็จ จะปรำกฏหนำ้ จอให้ Add friend ดงั รูปดำ้ นลำ่ งซำ้ ย เม่อื กดปมุ่ Add แลว้
จะแสดงหนำ้ จอดังรูปดำ้ นลำ่ งขวำพร้อม Greeting message โดยอตั โนมัติ

9) หำกต้องกำร Broadcasts ให้ไปท่ี LINE OA Manager แล้วเลือก Tab Home จำกน้ันเลือก เมนู
Broadcast และกดปุ่ม Create new

10) หำกต้องกำร Broadcasts ให้ไปท่ี LINE OA Manager แล้วเลือก Tab Home จำกนั้นเลือก เมนู
Broadcast และกดปุ่ม Create new จะปรำกฏหน้ำจอสำหรับกำรสร้ำง Broadcast ให้เรำกำหนดเงื่อนไขตำมที่
ต้องกำร จำกน้นั พิมพข์ อ้ ควำมที่ต้องกำร ระบบจะทำกำร Preview ข้อควำมใหเ้ หน็ หำกตรงตำมทตี่ ้องกำรแลว้ ให้
กดป่มุ Send ดงั รูป ขอ้ ควำมจะสง่ ไปตำมทเ่ี รำกำหนดไว้

18 | P a g e

Webhook events

- Webhook events คอื อะไร
Webhook events คือ event ท่ีเกิดขึ้นกับ Chatbot ซ่ึง event ต่ำงๆ จะรับมำจำก LINE Platform
และส่งมำยัง Chatbot ซึ่งหำกเป็นกรณีของ Greeting message และ Auto-response messages เรำสำมำรถ
กำหนดข้อควำมตอบกลับ หรือกำหนดเงื่อนไขเบื้องต้นได้ผ่ำน LINE OA Manager ได้เลย แต่หำกเรำต้องกำรให้
Chatbot สำมำรถตอบคำถำมได้ตำมเงื่อนไขท่ีกำหนด เรำจำเป็นต้องทำกำรกำหนด Webhook URL (ต้องเป็น
URL ที่เป็น HTTPS) ให้กับ Chatbot หรือ Channel ท่ีสร้ำงข้ึน โดย Webhook URL ก็คือ ที่อยู่ของ โปรแกรมท่ี
จะรับ event หรือคำถำมท่ีส่งมำ ตำมหลักกำรของ Messaging API แล้วทำกำรประมวลผล เมื่อประมวลผล
เรยี บรอ้ ยแล้วกต็ อบกลบั ไปยัง LINE Platform ดงั รปู ด้ำนลำ่ งน้ี

https://miro.medium.com/max/1280/1*wh2SnEKjgatKexIwst2sTw.png

19 | P a g e

ซ่ึง Webhook น้ันเรำจะพัฒนำขึ้นเองก็ได้ จำกกำรเขียนโปรแกรมเอง โดยใช้ภำษำต่ำงๆ ที่รองรับ หรือ
จะใช้ Dialogflow ทำหน้ำท่เี ปน็ Webhook ก็ได้

- ข้อมลู พน้ื ฐานของ Webhook events

Webhook events จะมกี ำรส่งข้อมูลโดยมขี ้อมูลพน้ื ฐำนท่สี ำคญั ได้แก่

1) type คอื ประเภทของ event เชน่ message event, follow event, beacon event
2) mode คือ สถำนะของ Channel ซึ่งจะระบวุ ำ่ active หรอื standby
3) timestamp คอื เวลำที่ event เกดิ ข้นึ หนว่ ยเป็น milliseconds
4) source: แหล่งท่ีมำจำก LINE Platform ซ่ึงจะส่งมำอยู่ในรูปแบบของ object ได้แก่ user, group

และ room

ข้อมูลเพ่ิมเติมเกีย่ วกับ Webhook events ศึกษำได้จำก https://developers.line.biz/en/
reference/messaging-api/#common-properties

- ทดลองสรา้ ง Webhook (Node.js)

ในเบ้อื งตน้ จะพัฒนำ Webhook ดว้ ยภำษำ JavaScript โดยเขียนในรูปแบบของ Node.js ผ่ำน Firebase
Cloud Function ดงั น้นั เพอื่ ให้สำมำรถใช้งำน Cloud Function ไดส้ ะดวก ขอแนะนำให้ทำกำรติดต้ัง Firebase
emulator suite ก่อน โดยดำเนินกำร ดังนี้

1) สร้ำง Folder: Webhook จำกนั้นเปิด Folder น้ันด้วย VSCode หรือ CMD แล้วทดสอบ พิมพ์คำส่ัง
node -v ดงั ภำพ

20 | P a g e

2) หำกไม่ปรำกฏ Version ของ Node แสดงวำ่ ยังไม่ได้ติดตั้ง Node.js ซ่งึ หำกตดิ ต้ังแล้วให้พมิ พ์คำสง่ั npm
install -g firebase-tools ดังภำพ

3) จำกนั้นให้พิมพ์คำสั่ง firebase login ดังภ ำพ (ก่อนที่จะทำข้ันต อน น้ีคว รเ ข้ำ ไป Login ท่ี
https://console.firebase.google.com/ ก่อน เพ่ือให้มั่นใจว่ำ Account ที่มีอยู่ใช้งำนได้ และทำกำร
สร้ำง Project ช่ือว่ำ cojwebook ไว้เลย)

4) ระบบจะทำกำรเปิด Browser Tab ใหม่ข้ึนมำเพื่อให้เลือก Account ท่ีจะ Login เพื่อทำกำรเลือกแล้ว
จะปรำกฏหนำ้ จอเพื่อขอเข้ำถงึ ข้อมูล ดงั ภำพ ให้กดปุ่ม Allow ซง่ึ เม่ือกดแลว้ ใน CMD จะแจง้ วำ่ Success

21 | P a g e

5) ข้ันตอนต่อไปให้ใช้คำส่ัง firebase init เพื่อสร้ำง Project และทำตำมข้ันตอน จำกน้ันเลือกบริกำร
Functions และ Emulators ดงั ภำพ

6) จำกนั้นให้เลือก Use an existing project ท่ีสร้ำงไว้ เลือกใช้ภำษำ JavaScript และดำเนินกำรตำมที่
ระบบแนะนำ ดังภำพ

22 | P a g e

7) เมือ่ เสรจ็ ขัน้ ตอนข้ำงตน้ ระบบจะให้ทำกำรติดต้งั Emulator ใหด้ ำเนนิ กำรตำมคำแนะนำ ดังภำพ
8) ใหท้ ดลองเขียนโค้ดท่ไี ฟล์ index.js ซ่ึงอยู่ใน Folder: functions ดงั ภำพ

23 | P a g e

9) หำกต้องกำรทดสอบกำรใช้งำนให้ใช้คำสง่ั cd functions เพื่อเข้ำถึง Folder: functions จำกนั้นใช้คำสั่ง
firebase emulators:start ระบบจะทำกำร deploy ไปท่ี emulator ซึง่ สำมำรถทดสอบกำรใช้งำนแบบ
Local ได้

10) ทดสอบกำรใช้งำนโดยใช้ URL: http://localhost:4000/functions เมื่อเปดิ เข้ำไป จะพบหนำ้ จอดงั ภำพ

11) ใ ห้ เ ร ำ Copy URL ส ำ ห รั บ ใ ช้ ง ำ น Function ที่ เ ขี ย น ไ ว้ โ ด ย ใ น ตั ว อ ย่ ำ ง นี้ คื อ URL:
http://localhost:5001/cojwebhook/us-central1/helloWorld เมื่อเปิดเข้ำไป จะพบหน้ำจอแสดง
ขอ้ ควำม Hello from Firebase! ตำมทีเ่ รำเขียนโปรแกรมไว้

24 | P a g e

12) หำกดำเนินกำรตำมขั้นตอนดังกล่ำวจะไม่สำมำรถทดสอบ Function จำกภำยนอกหรือนำไปเช่ือมต่อกับ
LINE ได้ ดังน้ัน จึงจำเป็นต้องใช้ซอฟต์แวร์อื่นเพ่ิมเติม ซึ่งเรำจะใช้ ngrok ซึ่งเมื่อดำวห์โหลดเสร็จ แตก
ไฟลจ์ ำกนัน้ ใหเ้ ปดิ ไฟล์ ngrok.exe จะปรำกฏ ดงั ภำพ

13) ให้พิมพ์คำสั่ง ngrok http 5001 เพ่ือสร้ำงเส้นทำงเช่ือมต่อไปยัง Firebase Emulator หำกไม่มี
ขอ้ ผดิ พลำดจะแสดง URL สำหรับนำไปใชไ้ ด้ ดังภำพ

14) ใหท้ ดลองนำ URL ทเ่ี ปน็ https มำตอ่ ดว้ ย path ของฟังก์ชนั เช่น
https://4d6096900a7c.ngrok.io/cojwebhook/us-central1/helloWorld จะสำมำรถเรียกใชง้ ำน
จำกภำยนอกได้

15) ใหน้ ำ Code จำก Link น้ี มำเพอ่ื ทดสอบใชง้ ำน โดยให้ติดตั้ง axios เพิม่ เตมิ ด้วยคำสั่ง npm install
axios

25 | P a g e

16) เข้ำไปที่ LINE Developer (https://developers.line.biz/) เลือก Channel ทีต่ ้องกำรและเลือก Tab
Messaging API เพือ่ ขอ Channel access token โดยกดที่ปุม่ Issue ดงั รูปด้ำนล่ำง

17) เมอื่ ได้ Channel access token แลว้ ให้นำไปวำงใน Code แทนคำ่ xxx เพื่อเก็บคำ่ token ในตัวแปร
ดังรูป

Node.js

18) ให้นำ URL ของ Webhook ทไี่ ด้จำก ngrok เชน่ https://a7f67dc28020.ngrok.io/cojwebhook/us-
central1/Chatbot ไปใส่ใน Channel โดยไปที่ LINE Developer จำกน้นั เลือก Tab Messaging API
แล้วใส่ Webhook URL จำกน้นั กดปมุ่ Save ดังรูป

26 | P a g e

ตอนนี้เรำดำเนินกำรตง้ั ค่ำให้ LINE Platform เชอื่ มโยงกับ Webhook เรยี บรอ้ ยแลว้ แต่อย่ำงไรกต็ ำม
หำกเรำพิมพ์ขอ้ ควำมใดๆ Chatbot จะตอบตำม Auto-response messages ดว้ ย ดงั รูป

ให้ทำกำรปิด Auto-response messages โดยไปท่ี LINE OA Manager จำกน้ันเลอื กเมนู Settings
จำกนั้นเลือก Response settings แลว้ เลอื ก Disabled ดังรูป

27 | P a g e

หมายเหตุ หำกต้องกำรใช้ภำษำ PHP และ Upload ไปยัง Hosting ท่ีรองรับ สำมำรถทดสอบโดยสร้ำง
ไฟล์ชื่อว่ำ webhook.php (สำมำรถ download ไฟล์ ได้จำก Link นี้) จำกน้ันนำ Channel access token ไป
วำงใน Code เพ่ือเก็บคำ่ token ในตวั แปร ดงั รปู

จำกน้ันให้ Upload ไฟล์ webhook.php ไปยัง Server ท่ีต้องกำรหรือสมัคร Server ที่รองรับ PHP ได้ท่ี
เวบ็ ไซต์ https://www.hostinger.in.th/free-hosting เพื่อสมคั รขอใช้งำน Server ที่รองรับกำรประมวลผลภำษำ
PHP และใชง้ ำน HTTPS ได้ โดยดำเนินกำร ดังน้ี

1) โดยหำกกรอกขอ้ มลู เพ่ือสมคั รเรียบร้อยแล้วจะมีอเี มลส่งมำเพื่อให้ยนื ยันอีเมล เมอื่ คลิกที่ Link ในอเี มลจะ
เชอ่ื มโยงไปยังหนำ้ จอในกำรสร้ำงเว็บไซต์ ดังรปู ด้ำนล่ำง

2) โดยหำกกรอกขอ้ มูลเพื่อสมคั รเรยี บรอ้ ยแล้วจะมีอีเมลส่งมำเพ่ือใหย้ ืนยันอีเมล เมื่อคลิกท่ี Link ในอเี มลจะ
เชอ่ื มโยงไปยงั หนำ้ จอในกำรสร้ำงเวบ็ ไซต์

28 | P a g e

3) เม่ือเข้ำส่หู น้ำจอ My Websites ให้เลือกเวบ็ ที่สร้ำงข้นึ จำกน้นั เลือก Manage Website ดังรปู

4) จำกนัน้ ให้กดป่มุ Upload ในส่วนของ File Manager ดงั รปู

5) ในหน้ำจอของ File Manager ให้เลือก Icon upload file และทำกำร upload file webhook.php ที่
ระบุ Channel access token แลว้ ดังรปู

29 | P a g e

6) ใหน้ ำ URL ของ Webhook ท่ี upload แลว้ ซงึ่ จะมี Subdomain ตำมช่อื เวบ็ ไซต์ที่ต้ังขึ้น เชน่
https://testcoj.000webhostapp.com/webhook.php ไปใสใ่ น Messaging API ตำมทไี่ ด้กลำ่ วไว้
ข้ำงตน้

7) หำกตอ้ งกำรตรวจสอบวำ่ สง่ิ ที่ LINE สง่ ไปเป็นอย่ำงไร สำมำรถเพิ่มโค้ดดำ้ นล่ำงน้ีไปที่ไฟล์
webhook.php เพ่ือให้ระบบเขียนขอ้ มูลลงไฟล์ log.txt

file_put_contents('log.txt', file_get_contents('php://input') . PHP_EOL, FILE_APPEND);

Message Objects

ส่งิ ท่ี Chatbot จะตอบกลับไปยังผู้ใช้ได้นั้น มีหลำกหลำยประเภท ซึ่งสำมำรถทำได้ใกล้เคียงกับกำร Chat
ปกตผิ ำ่ น LINE โดย Message Object น้ันมรี ปู แบบต่ำงๆ ดงั นี้

1. Text message ซ่ึงเป็นข้อควำมปกติ ดังตัวอย่ำงท่ีเคยได้ลองทำในหัวข้อที่แล้ว ซ่ึงมีรูปแบบของ
Object ดงั รูป

30 | P a g e

2. Sticker message จะเป็นกำรส่ง Sticker ซ่ึงมีรูปแบบของ Object ดังรูป โดยสำมำรถตรวจสอบ
packageId แ ล ะ stickerId ไ ด้ จ ำ ก URL https://developers.line.biz/media/messaging-
api/sticker_list.pdf

- ซงึ่ กำรสร้ำง Sticker message สำมำรถทำไดด้ งั Code ด้ำนลำ่ งนี้
Node.js

messages: [
{
type: "sticker",
packageId: request.body.events[0].message.packageId,
stickerId: request.body.events[0].message.stickerId,
}

]

PHP

function getFormatSticker($packageId, $stickerId)
{

$datas = [];
$datas['type'] = 'sticker';
$datas['packageId'] = $packageId;
$datas['stickerId'] = $stickerId;
return $datas;
}

- สำมำรถเรียกใชง้ ำนได้ตำมตวั อยำ่ งน้ี จะปรำกฏผลลัพธต์ ำมรปู ดำ้ นลำ่ งน้ี

31 | P a g e

else if($question == "sticker")
{

$messages['messages'][0] = getFormatSticker("1","1");
}

3. Image message จะเป็นกำรส่ง Image ซ่งึ มรี ปู แบบของ Object ดังรปู

Node.js

messages: [
{
type: "image",
originalContentUrl: "https://upload.wikimedia.org/wikipedia/c

ommons/0/0a/No-image-available.png",
previewImageUrl: "https://upload.wikimedia.org/wikipedia/comm

ons/0/0a/No-image-available.png",
}

]

32 | P a g e

PHP

- ซ่ึงกำรสร้ำง Image message สำมำรถทำไดด้ ัง Code ด้ำนล่ำงน้ี

function getFormatImage($originalContentUrl, $previewImageUrl)
{

$datas = [];
$datas['type'] = 'image';
$datas['originalContentUrl'] = $originalContentUrl;
$datas['previewImageUrl'] = $previewImageUrl;
return $datas;
}

- สำมำรถเรยี กใช้งำนได้ตำมตัวอยำ่ งน้ี จะปรำกฏผลลัพธต์ ำมรูปด้ำนลำ่ งนี้

else if($question == "image")
{

$messages['messages'][0] = getFormatImage("https://coj.go.th/th/file/get/
file/20180611f9829f3a4145d4678f38a76db3a50d16202026.png","https://coj.go.th/th/fi
le/get/file/20180611f9829f3a4145d4678f38a76db3a50d16202026.png");

}

33 | P a g e

4. Video message จะเป็นกำรส่ง Video ซึง่ มีรูปแบบของ Object ดังรูป

Node.js

messages: [
{
type: "video",
originalContentUrl: "https://example.com/original.mp4",
previewImageUrl: "https://example.com/preview.jpg",
trackingId: "track_id"
}

]

PHP

- ซึ่งกำรสรำ้ ง Video message สำมำรถทำได้ดงั Code ดำ้ นลำ่ งน้ี

function getFormatVideo($originalContentUrl, $previewImageUrl)
{

$datas = [];
$datas['type'] = 'video';
$datas['originalContentUrl'] = $originalContentUrl;
$datas['previewImageUrl'] = $previewImageUrl;
return $datas;
}

34 | P a g e

- สำมำรถเรยี กใช้งำนได้ตำมตัวอยำ่ งนี้ จะปรำกฏผลลัพธ์ตำมรูปด้ำนลำ่ งนี้

else if($question == "video")
{

$messages['messages'][0] = getFormatVideo("https://www.youtube.com/watch?
v=7CVtTOpgSyY","https://vignette.wikia.nocookie.net/pixar/images/4/48/227760_1015
0186156309078_35245929077_6705507_928932_n.jpg");

}

5. Audio message จะเปน็ กำรส่ง Audio ซง่ึ มรี ปู แบบของ Object ดงั รปู * สำมำรถใช้ mp3 ได้

Node.js

messages: [
{
type: "audio",
originalContentUrl: "https://example.com/original.m4a",
duration: 60000
}

]

35 | P a g e

PHP
- ซึง่ กำรสรำ้ ง Audio message สำมำรถทำได้ดงั Code ด้ำนลำ่ งนี้

function getFormatAudio($originalContentUrl, $duration)
{

$datas = [];
$datas['type'] = 'audio';
$datas['originalContentUrl'] = $originalContentUrl;
$datas['duration'] = $duration;
return $datas;
}

- สำมำรถเรียกใชง้ ำนไดต้ ำมตวั อยำ่ งน้ี จะปรำกฏผลลัพธต์ ำมรปู ด้ำนล่ำงน้ี

else if($question == "audio")
{

$messages['messages'][0] = getFormatAudio("https://appstudio.space/filefo
rtraining/audio.m4a","210000");

}

6. Location message จะเปน็ กำรส่ง Location ซงึ่ มรี ูปแบบของ Object ดังรูป

36 | P a g e

Node.js

messages: [
{
type: "location",
title: "my location",
address: "〒160-0022 東京都新宿区新宿４丁目１−６",
latitude: 35.688806,
longitude: 139.701739
}

]

PHP

- ซง่ึ กำรสรำ้ ง Location message สำมำรถทำไดด้ งั Code ด้ำนลำ่ งนี้

function getFormatLocation($title, $address, $latitude, $longitude)
{

$datas = [];
$datas['type'] = 'location';
$datas['title'] = $title;
$datas['address'] = $address;
$datas['latitude'] = $latitude;
$datas['longitude'] = $longitude;
return $datas;
}

- สำมำรถเรียกใช้งำนไดต้ ำมตัวอย่ำงนี้ จะปรำกฏผลลัพธต์ ำมรูปดำ้ นล่ำงน้ี

else if($question == "location")
{

$messages['messages'][0] = getFormatLocation("COJ","ศาลยตุ ธิ รรม ถนน
รัชดาภิเษก แขวง จอมพล เขตจตุจกั ร กรุงเทพมหานคร 10900","13.816282","100.574797");

}

37 | P a g e

LINE Bot Designer

เป็นโปรแกรมสำหรับใช้ในกำรสร้ำง Prototype ในรูปแบบต่ำงๆ ซึ่งสำมำรถนำมำใช้กับ Chatbot ได้
ทันที โดยสนับสนุน Message Objects ในรูปแบบต่ำงๆ รวมไปถึง Rich Menu ด้วย ทำให้เกิดควำมสะดวกกับ
ผู้พัฒนำเป็นอย่ำงมำก ซึ่งเมื่อติดตั้งเสร็จจะปรำกฏหน้ำจอ ดังรูปด้ำนล่ำงซ้ำย เรำสำมำรถใช้บัญชี LINE ในกำร
Log in ได้เลย โดยถ้ำ Log in สำเร็จ จะปรำกฏหน้ำจอดังรูปด้ำนล่ำงขวำ ให้กดปุ่ม Start a New Project เพื่อ
เร่ิมใช้งำน

- ซ่ึงหำกเรำกดปุ่ม Start a New Project จะปรำกฏหน้ำจอให้ใส่รำยละเอียด ดังรูป ด้ำนล่ำง เมื่อ
กรอกข้อมลู ครบแล้ว ให้กดปุ่ม OK

38 | P a g e

- ทดลองสร้ำง Image Message โดยใช้ LINE Bot Designer ให้เลือกท่ี Message จำกนั้นกดปุ่ม +
แล้วเลือก Image Message จำกน้ันใส่รำยละเอียดในส่วนของ Properties โปรแกรมจะทำกำร
Preview และสร้ำง Code ในรูปแบบ JSON ให้

- เม่อื ได้ JSON แล้ว สำมำรถนำไปใชง้ ำนไดต้ ำมปกติ
- ทดลองสร้ำง Imagemap Message โดยใช้ LINE Bot Designer ให้เลือกที่ Message จำกน้ันกดปุม่

+ แล้วเลือก Imagemap Message จำกน้ันใส่รำยละเอียดในส่วนของ Properties โปรแกรมจะทำ
กำร Preview และสร้ำง Code ในรปู แบบ JSON ให้

39 | P a g e

- เม่ือได้ JSON แล้ว สำมำรถเรียกใช้งำนได้โดยอำจแก้ไข URL ของรูปภำพให้สำมำรถเรียกใช้งำนผ่ำน
อินเทอรเ์ นต็ ได้

Day 2 1
- Dialogflow overview 2
- Setting up a Dialogflow Account 5
- Creating an agent 7
- What is "Intent"? 9
- Pre-defined intents 10
- Creating your first intent 13
- Creating a follow-up intent
- Input and Output context 15
- Action and parameters
- No follow-up intent 17
- Yes follow-up intent 22
- Get parameters from previous intent 25
- Integration with LINE 27
- Customize LINE message responses 28
- What is "Fulfillment"? 33
- Creating a function by Inline Editor 41
- Customize LINE messages 65
69

1|Page

Dialogflow overview

- Dialogflow คืออะไร ?
Api.ai เปน็ product ที่ถูกพัฒนาข้ึนโดย Speaktoit แตถ่ ูก Google ซื้อ และนาไปพฒั นาตอ่ ยอดในปี
2016 และพงึ่ เปลยี่ นชอ่ื มาเป็น Dialogflow ในภายหลงั

https://miro.medium.com/max/816/1*N2PIWPpL-VgSkS2fk4fD1w.png

- ทำไมตอ้ ง Dialogflow ?
จุดเด่นของ Dialogflow คือการรองรับการทา Natural Language Understanding (NLU)โดยที่เรา
แทบไมต่ อ้ งเขียนโปรแกรมอะไรเพ่ิมเติม หรอื พดู แบบละเอียดได้วา่ Dialogflow สามารถแปลง input หรอื query
ของผู้ใช้งานให้เป็น Intent โดยผ่านกระบวนการ Natural Language Processing (NLP) ซ่ึงจะช่วยให้แชทบอ
ทสามารถหา Intent และทา Entity Recognition ตา่ งๆได้โดยไมต่ อ้ งเขียนโปรแกรมเพม่ิ และสง่ิ ที่สาคัญทสี่ ดุ ก็คือ
ใช้งานฟรี (สาหรับ Standard Edition)
Dialogflow รองรับการทา Natural Language processing มากกว่า 30 ภาษารวมถึงภาษาไทย ซ่ึง
รวมๆก็ให้ผลลัพธ์ได้ค่อนข้างดี นอกจากนี้ Dialogflow ก็ยังรองรับการเชื่อมต่อกับ Channel ได้ค่อนข้าง
หลากหลายไมว่ ่าจะเป็น Facebook Messenger, Twitter, Line ตลอดจน webhook ของตัวเอง
ปัจจุบัน Dialogflow ถูกพัฒนาเป็น version CX โดยมี engine NLP ใหม่ และ UI ใหม่ ท่ีใช้งานได้ง่าย
และ ฉลาดกว่าเดมิ โดยให้บริการเปน็ สว่ นหน่ึงของ Google Cloud - Google Cloud Platform (GCP) ในขณะน้ี
เวอรช์ ัน่ เกา่ ยังคงใหบ้ ริการฟรีอยู่ โดยต้ังชือ่ เวอร์ชัน่ ว่า ES (Essentials)

2|Page

Setting up a Dialogflow Account

- STEP1 : ลงทะเบียน/ล๊อกอินเข้ำ Dialogflow
แนน่ อนวำ่ ก่อนทเี่ รำจะไปทำควำมเข้ำใจ Dialogflow ให้มำกกวำ่ น้ี เรำต้องลงทะเบยี นเข้ำใชง้ ำน
ก่อนนะ โดยไปยังหนำ้ เวบ็ ของ Dialogflow บน GCP ( https://cloud.google.com/dialogflow ) และกดที่
Compare editions จำกนนั้ กเ็ ขำ้ สู่ขัน้ ตอนกำร Login หรือลงทะเบียน โดยคลกิ ท่ี Go to console
สำหรบั เวอร์ช่นั ES

3|Page
ลงชื่อเขา้ ใช้ ด้วย google account

4|Page

5|Page

Creating an agent

STEP 2: สร้ำง Agent
หลังจำก Login สำเรจ็ เรำก็จะเจอกบั Workplace ในกำรทำแชทบอทละ ใหไ้ ปที่เมนูด้ำนซ้ำย และ
เลอื ก Create Agent ก็จะพบกับหน้ำจอสำหรับตง้ั ค่ำแชทบอทของเรำ โดยตอ้ งสำมำรถต้ังช่อื ภำษำ และ
Timezone ท่ีต้องกำร

คลกิ Create Agent

ต้งั ช่ือ Agent ภาษา และ Timezone ทต่ี อ้ งการ

6|Page

เสร็จแลว้ ^^

ทำควำมเขำ้ ใจกับ Dialogflow basics กนั สกั นิด ก่อนไปสขู่ ้ันตอนต่อไป

https://cloud.google.com/dialogflow/docs/basics

Dialogflow Agent หรอื ส่วนที่ทำหนำ้ ท่ีทำควำมควำมใจสิ่งทผี่ ู้ใช้งำนพูด หรือสื่อสำรออกมำ ซง่ึ ถำ้ ดู
จำกภำพจะพบว่ำ Agent ก็จะคือส่วนสีส้มๆ ที่มีหน้ำที่ในกำรรับ Query หรือ Input ท่ีผู้ใช้ส่งเข้ำมำ (ผ่ำน
อุปกรณ์ใดๆ) จำกน้ัน Agent ก็จะทำ NLU เพ่ือดูว่ำผู้ใช้ต้องกำรอะไร หมำยถึง Intent ไหน จำกนั้นก็
Response Actionable data กลับไปหำผู้ใช้งำน โดยอำจจะมีกำรเช่ือมต่อกับระบบอื่นๆผ่ำน API ในส่วน
ของ Fulfillment ตำมภำพกไ็ ด้

7|Page

What is "Intent"?

Dialogflow มีลักษณะการทางานเป็น Intent-based chatbot กล่าวคือ แชทบอทที่หาความต้องการ
หรือความตั้งใจ (Intent) ของผู้ใช้จากข้อความพิมพ์มา แล้วหาคาตอบที่เหมาะสมสาหรับ Intent น้ันๆ ใน
Dialogflow เราสามารถจัดกลุ่มประโยคท่ีมีความต้องการ (Intent) เหมือนกันให้บอทเรียนรู้ และกาหนดคาตอบ
สาหรับแต่ละ Intent ได้ ถ้าคาตอบท่ีเรากาหนดไว้มีหลายแบบ Dialogflow จะสุ่มเลือกคาตอบให้เอง

basic flow for intent matching and responding to the end-user

Training phrase : สว่ นประกอบหลักของการสรา้ ง intent น่ีเอง โดยเราสามารถใส่ประโยคตวั อยา่ งของ
intent น้ีเข้าไปได้ (มากกว่า 1 ประโยค) โดยท่ีประโยคน้นั ไม่จาเป็นต้องเหมือนกับ user input ก็ได้ แค่มี
keyword ท่ตี รง Dialogflow กจ็ ะเรยี นรู้ จากท่ีเรากรอก แล้วทาการจับคู่ user input เขา้ กบั intent น้ใี ห้นั่นเอง
(โดยท่ีเราไม่ตอ้ งทา NLP เองเลย)

Action and parameter : Dialogflow สามารถ extract entity ออกมาจาก user input ไดเ้ ชน่ กนั
ถ้าเรากาหนดตวั parameter ไว้ พรอ้ มระบชุ นดิ ของ entity เช่น เวลา,ชื่อภาษา,ชื่อประเทศ,ช่ือหน่วยเงิน เพื่อท่ี
เอาไปใชต้ อ่ ที่อ่นื ไดง้ ่ายๆ โดยไมต่ ้องมาดักจับเอง

Response : เป็นอกี หน่งึ สว่ นประกอบหลกั ของ intent โดยที่ response คือรปู แบบของสิ่งทีเ่ รา
ตอ้ งการตอบกลับไปหา user ใน intent น้ันๆ ซง่ึ สามารถเปน็ ไดต้ ้ังแต่ plain text ธรรมดา, custom json, หรือ
template chatbot response ของแต่ละ platform กไ็ ด้ ( ในการอบรมน้ี เราจะนาเสนอ การตอบกลับใน
รปู แบบของ LINE Messaging API )

8|Page

ตัวอยา่ งการทางานของ intent

จากรปู ด้านซา้ ยใน Dialogflow เราใสป่ ระโยคตัวอย่าง (Training phases) สาหรับ Intent: Welcome
เพอ่ื ถาม เป็นคาทักทาย และกาหนดคาตอบ (Responses) สาหรบั Intent นี้ไว้ 2 แบบ

พอลองมาพมิ พ์ทดสอบ (รปู ด้านขวา) จะเห็นวา่ เราพิมพ์ไม่ได้ตรงกับ Training phases เป๊ะๆ แตบ่ อทก็
หา Intent จากข้อความของเราได้เพราะบอทเรยี นร้จู ากประโยคทเ่ี ราใส่ไปแลว้ ส่วนคาตอบบอทก็สุม่ จากประโยค
ท่ีเรากาหนดไว้ ทาใหบ้ อทตอบได้หลากหลาย ดเู ปน็ ธรรมชาตมิ ากกว่าตอบแคแ่ บบเดียว