ใน Codelab นี้คุณจะได้เรียนรู้แนวทางการบูรณาการ LINE Chatbot เข้ากับ Dialogflow และ Google Gemini AI โดยใช้แพลตฟอร์ม Make.com เป็นตัวกลางในการเชื่อมต่อกระบวนการทำงาน หลักการสำคัญคือการใช้ประโยชน์จากความสามารถในการจัดการบทสนทนาของ Dialogflow, พลังการประมวลผลภาษาธรรมชาติขั้นสูงของ Google Gemini AI, และความยืดหยุ่นในการสร้าง Workflow อัตโนมัติของ Make.com เพื่อสร้างประสบการณ์การสนทนาที่ชาญฉลาดและเป็นธรรมชาติยิ่งขึ้นบน LINE
สิ่งที่คุณจะได้เรียนรู้
- การตั้งค่าการใช้งาน Fallback Intent ใน Dialogflow
- การสร้าง Workflow ใน Make.com
- การใช้งาน Module "Google Cloud Dialogflow ES (Watch for Fullfillment)"
- การใช้งาน Module "Google Gemini AI (Create a completion)"
- การใช้งาน Module "LINE (Send a Reply Message)"
สิ่งที่คุณต้องเตรียมพร้อมก่อนเริ่ม Codelab
- แอปพลิเคชัน LINE(สมาร์ทโฟน) ที่ sign in พร้อมใช้งาน
- บัญชี Google เช่น Gmail
- Browser(Desktop หรือ Mobile)
- LINE OA ที่เชื่อมต่อกับ Dialogflow แล้ว (สามารถทำต่อจาก Codelab https://codelab.line.me/codelabs/chatbot)
Sign In เพื่อเข้าใช้งาน Make.com
ให้เข้าไปที่ URL: https://www.make.com/ จะปรากฏหน้าจอ ดังภาพ
จากนั้นให้ Sign in ด้วย Account ที่มี เช่น Sign in with Google ระบบจะให้กรอกข้อมูล เช่น ชื่อ ประเทศ เพื่อเป็นข้อมูลในการ Sign up จากนั้นจะปรากฏแบบสอบถามเบื้องต้นให้ตอบคำถามให้เรียบร้อย เมื่อครบแล้วจะปรากฏหน้าจอ ดังภาพ
สร้าง Scenario ที่จะใช้งาน
ให้กดปุ่ม Create a new scenario ที่อยู่ด้านขวาบนของจอ จะปรากฏหน้าจอ ดังภาพ
ให้เลือก Build from scratch จะปรากฏหน้าจอ ดังภาพ
ให้คลิปที่สัญลักษณ์ + ตามที่ระบบแนะนำ จะมี Apps หรือ Modules ให้เลือก ดังภาพ
การสร้าง Webhook ใน Module Google Cloud Dialogflow ES
ให้ทำการค้นหา Module Google Cloud Dialogflow ES โดยพิมพ์ที่ช่องค้นหา ดังภาพ
จากนั้นให้กดที่ Show more เพื่อแสดงผลลัพธ์ทั้งหมด และเลือก Watch for Fulfillment ดังภาพ
เมื่อเลือกแล้วจะได้ Module ที่ต้องการ ดังภาพ
จากนั้นให้กดปุ่ม Create a webhook ตั้งชื่อ Webhook name และกดปุ่ม Create a connection ดังภาพ
เมื่อกดปุ่มแล้วจะปรากฏหน้าจอให้ใส่ Client ID และ Client Secret ดังภาพ
การสร้าง Credentials ผ่าน Google Cloud Platform
เราต้องไปหา Client ID และ Client Secret จาก Google Cloud Platform ให้ไปที่ URL: https://console.cloud.google.com/ และเลือก Project ที่ใช้สร้าง Agent ใน Dialogflow หรือกลับไปที่ Dialogflow และกดที่สัญลักษณ์เฟือง จะเห็นข้อมูล Google Project ให้คลิกที่ Project ID จะ Link ไปยัง Google Cloud Platform เช่นเดียวกัน
เมื่อเข้ามาที่ Google Cloud Platform แล้ว ให้ค้นหาด้วยคำว่า dialogflow จากนั้น เลือก Dialogflow API ดังภาพ
เมื่อกดแล้วจะปรากฏหน้าจอ Dialogflow API ให้ทำการตรวจสอบว่า API ได้ถูกเปิดใช้งานเรียบร้อยแล้ว จากนั้นให้กดปุ่ Manage
เมื่อกดแล้วจะปรากฏหน้าจอ ดังภาพ ในกดปุ่ม Create credentials ที่อยู่บริเวณด้านขวาบน
เมื่อเข้าสู่หน้าจอการสร้าง Credential แล้ว ให้เลือก User data ดังภาพ แล้วกด Next
เมื่อกดแล้วจะปรากฏหน้าจอ ดังภาพ ให้ทำการระบุ App name และ email และกดปุ่ม Save and continue
ในส่วนของ Scopes .ให้กดปุ่ม Save and continue ได้เลย จะปรากฏหน้าจอ ดังภาพ
หน้าจอนี้ให้เลือก Application type เป็น Web Application และระบุชื่อลงไป จากนั้นให้กดปุ่ม Create ได้เลย จะปรากฏหน้าจอ ดังภาพ
ซึ่งเมื่อมาถึงจุดนี้เราจะได้ Client ID แล้ว ให้กดปุ่ม Done ได้เลย ซึ่งเมื่อกลับมาที่หน้าจอ Credentials ให้กดปุ่มดินสอ ในรายการที่สร้างไว้ ดังภาพ
ถึงขั้นตอนนี้เราจะพบ Client ID และ Client Secret แล้ว ดังภาพ
ถึงจุดนี้ยังเหลืออีก 1 ขั้นตอนคือ การเพิ่ม Authorized redirect URIs ให้เพิ่ม https://www.integromat.com/oauth/cb/google-custom
ดังภาพ
จากนั้น ให้ Copy Client ID และ Client Secret ไปใส่ใน Make.com ดังภาพ แล้วอย่าลืมกด Save ในส่วนของ Credentials ที่เพิ่ม Authorized redirect URIs เอาไว้
เมื่อ Save ในส่วนของ Authorized redirect URIs แล้ว ให้มาที่ Make.com แล้วกดปุ่ม Sign in with Google และเลือก Email ที่ใช้ในการสร้าง Agent ใน Dialogflow หากสำเร็จจะปรากฏ ดังภาพ ให้กดปุ่ม Save
เมื่อกดปุ่ม Save แล้วจะปรากฏหน้าจอ ดังภาพ ซึ่งแสดง Webhook ให้ทำการ Copy เอาไว้ เพื่อเก็บไว้ใส่ใน Dialogflow Fulfillment จากนั้นกดปุ่ม Save ในส่วนของ Module ก็จะพร้อมใช้งาน
ลบ Responses ทั้งหมด และเปิดใช้ Fulfillment
เมื่อเราเข้ามาที่ Default Fallback Intent แล้ว ให้ไปยังส่วนของ Responses เพื่อลบข้อมูลทั้งหมดที่ใช้ในการตอบกลับออกและทำการเปิดใช้งาน Fulfillment ดังภาพ
ที่เราทำแบบนี้ เนื่องจากเราไม่ต้องการให้ Dialogflow ตอบข้อมูลใดๆ กลับไป แต่จะทำการส่งคำถามไปประมวลผลต่อที่ Make.com ผ่าน Fulfillment ดังนั้น ตอนนี้หากเราส่งข้อความหรือคำถามใดๆ มาที่ Dialogflow จะไม่มีข้อความตอบกลับ
เชื่อมต่อ Dialogflow กับ Module Google Cloud Dialogflow Watch for Fulfillment
ให้นำ Webhook จาก Module Watch for Fulfillment ไปใส่ใน ช่อง URL ในเมนู Fulfillment ดังภาพ จากนั้นกดปุ่ม Save ที่อยู่ด้านล่าง
ให้ลองทดสอบการใช้งานโดย กดปุ่ม Run once
ซึ่งเมื่อกดแล้วจะแสดงดังภาพ
ให้ลองส่งข้อความที่ไม่เข้า Intent ใดๆ ใน Dialogflow ซึ่งตามการทำงานจะไปยัง Fallback Intent และส่งต่อมาที่ make.com หากสำเร็จจะแสดงดังภาพ
เพิ่ม Module Google Gemini AI (Create a completion)
ให้กดปุ่ม + เพื่อเพิ่ม Module ดังภาพ
ให้ค้นหาด้วยคำว่า Gemini และเลือก Module Create a Completion ดังภาพ
เมื่อเลือกแล้วจะปรากฏหน้าจอ ดังภาพ
ให้กดปุ่ม Create a connection ระบบจะให้ระบุ API Key ดังภาพ
ถ้ายังไม่มี API Key ให้เข้าไปที่ https://aistudio.google.com/ และ Sign In ด้วย Account ที่ใช้สร้าง Agent ใน Dialogflow ดังภาพ จากนั้นกดปุ่ม Get API key
จากนั้นจะปรากฏหน้าจอดังภาพ ให้กดปุ่ม Create API key
จากนั้นให้เลือก Project ที่ใช้ แล้วกดปุ่ม Create API key in existing project
เมื่อได้ API key แล้วให้ Copy มาใส่ แล้วกดปุ่ม Save จะปรากฏหน้าจอ ดังภาพ
จากนั้นให้เลือก Model เช่น Gemini 1.5 Pro จากนั้นเลือกใส่ข้อมูลตามภาพ ซึ่งจะเป็นการกำหนดบทบาทให้กับ Module นี้ โดยในส่วนของ Text จะเป็นการเขียน Prompt พร้อมกับข้อมูล
จากนั้นให้กดปุ่ม Add item แล้วเลือกรายละเอียดตามภาพ จากนั้นกด Save
เพิ่ม Module LINE (Send a Reply Message)
ให้กดปุ่ม + เพื่อเพิ่ม Module และค้นหาด้วยคำว่า LINE ดังภาพ
จากนั้นกดที่ Show more เพื่อเลือก Send a Reply Message ดังภาพ
เมื่อเลือกแล้วจะปรากฏหน้าจอ ดังภาพ
ให้กดปุ่ม Create a connection จะปรากฏหน้าจอให้ใส่ Channel Access Token
เมื่อใส่ Channel Access Token แล้วกดปุ่ม Save จะปรากฏหน้าจอ ดังภาพ
ให้เลือก Reply Token และ การตอบกลับตามตัวอย่าง ดังภาพ
ซึ่งตามตัวอย่างจะนำ Reply Token ที่ส่งต่อมาจาก Dialogflow เพื่อใช้ในการตอบกลับโดยการตอบกลับจะนำผลลัพธ์ที่ได้จาก Gemini มาใช้ ซึ่งเมื่อระบุตามตัวอย่างเรียบร้อยแล้วให้กดปุ่ม Save จากนั้นทดสอบการใช้งาน โดยครั้งนี้ให้กดที่เมนู Scenarios แล้ว อย่าลืม Save Scenario ที่สร้างเอาไว้
เมื่อ Save แล้วจะปรากฏหน้าจอดังภาพ
ให้เลือก Senario ที่สร้างไว้ จากนั้นให้เปิดใช้งาน Senario นี้ ดังภาพ
จากนั้นพิมพ์ตัวอย่างคำถาม เช่น "reply message ใช้ทำอะไร" แล้วดูผลลัพธ์ที่ปรากฏ ระบบจะช่วยตอบข้อมูลที่กำหนดไว้ แต่หากถามว่า "รู้เกี่ยวกับ LIFF ไหม" ระบบจะตอบว่า "ไม่ทราบค่ะ ขออภัยด้วยนะคะ" ซึ่งเป็นไปตาม Prompt ที่กำหนดไว้
ยินดีด้วยครับ ถึงตรงนี้คุณก็มี LINE Chatbot ที่สามารถใช้งานร่วมกับ Dialogflow และ Gemini ได้แล้ว
สิ่งที่คุณได้เรียนรู้ใน Codelab นี้
- ✅ การตั้งค่าการใช้งาน Fallback Intent ใน Dialogflow
- ✅ การสร้าง Workflow ใน Make.com
- ✅ การใช้งาน Module "Google Cloud Dialogflow ES (Watch for Fullfillment)"
- ✅ การใช้งาน Module "Google Gemini AI (Create a completion)"
- ✅ การใช้งาน Module "LINE (Send a Reply Message)"