[อัพเดท 8/1/63] ทำให้ Line BOT ดึงข้อมูลจาก Google Sheet ด้วย Dialogflow

ทำให้ Line BOT ดึงข้อมูลจาก Google Sheet ด้วย Dialogflow

อัพเดทเนื้อหา 8/1/63 มีการเปลี่ยนแปลงข้อมูลบางส่วน

เพิ่ม Function Line BOT ให้เชื่อมต่อกับฐานข้อมูล ด้วย Google Sheet
โดยฟังก์ชั่นนี้ มีประโยชน์มากๆ สำหรับใครที่ทำ Line BOT และอยากใช้ sheet เป็น Database ซึ่ง sheet ก็มีหน้าตา และฟังก์ชั่นคล้ายกับ Excel อย่างที่เราคุ้ยเคย ข้อดีคือฟรี สามารถแก้ไข และอัพเดทข้อมูลแบบ Online และ real-time อีกด้วย

เกริ่นนำมาเยอะ เรามาเข้าเนื้อหากันเลย

การทำ Line BOT บน Dialogflow นั้นง่ายมาก ไม่ต้องเขียนโค้ด ก็สามารถมี Line BOT ของตัวเองได้ ดูวิธีทำ Line BOT ได้ที่

ปฐมบทการสร้าง LINE Bot

เรียนรู้การ Integrate LINE Bot เข้ากับ Dialogflow และ Firebase ผ่าน BMI Bot

อัพเดท

การเชื่อมโยง Dialogflow กับ LineOA ขณะนี้ทาง DF มีการเปลี่ยน URL Webhook

วิธีแก้ไข

จากเดิม url webhook จะเป็น

https://dialogflow.cloud.google.com/v1/integrations/line/webhook/xxx

ให้เราเปลี่ยนมาใช้แบบนี้แทน

>> https://bots.dialogflow.com/line/xxx/webhook

หมายเหตุ : ค่า xxx ของแต่ละคนไม่เหมือนกันนะครับ

เมื่อเรามี Line BOT ที่ทำบน Dialogflow อยากจะดึงข้อมูลต่างๆจากฐานข้อมูล โดยข้อมูลนั้น อาจจะแยกของแต่ละส่วนที่ต้องการ เช่น การค้นหาคะแนนของนักเรียนบางคน เราก็สามารถระบุชื่อนักเรียนที่ต้องการค้นหา ให้บอทไปค้นหามาให้เราได้

สิ่งที่ต้องมี
- Line BOT ในที่นี้จะทำบน Dialogflow
- Google Sheet ใช้เป็นฐานข้อมูล
- Google App Script ใช้เขียนเป็น function ในการจัดการกับ Google Sheet

มาเริ่มกันเลย
1. ไปที่ Google Drive และสร้าง Sheet ใหม่

สร้าง Google Sheet ขึ้นมาใหม่ ใช้เป็นฐานข้อมูล

2. เตรียมข้อมูลที่จะให้ Line BOT มาดึงค่า

ตัวอย่างข้อมูลสินค้า และจำนวนสต๊อกคงเหลือ

3. เมื่อเตรียมข้อมูลแล้ว ต่อไปเราจะสร้าง Script กับ ไปที่ เครื่องมือ > โปรแกรมแก้ไขสคริปต์

มาเริ่มเขียน Code กัน

var ss = SpreadsheetApp.openByUrl("URL Google Sheet");
var sheet = ss.getSheetByName("ชื่อแผ่นงานsheet");
function doPost(e) {
   
  var data = JSON.parse(e.postData.contents)
  var userMsg = data.originalDetectIntentRequest.payload.data.message.text;
  var values = sheet.getRange(2, 1, sheet.getLastRow(),sheet.getLastColumn()).getValues();
for(var i = 0;i<values.length; i++){
    
    if(values[i][0] == userMsg ){
      i=i+2;
var Data = sheet.getRange(i,2).getValue();
   
      var result = {
    "fulfillmentMessages": [
  {
    "platform": "line",
    "type": 4,
    "payload" : {
    "line":  {
  "type": "text",
  "text": Data
    }
        
   }
  }
 ]
}
      
    var replyJSON = ContentService.createTextOutput(JSON.stringify(result)).setMimeType(ContentService.MimeType.JSON);
    return replyJSON;
}
  }
}

4. Copy Code จากด้านบนไปวางไว้ใน Script

วางโค้ดใน Script

อธิบาย Code

var ss = SpreadsheetApp.openByUrl("URL Google Sheet");
var sheet = ss.getSheetByName("ชื่อแผ่นงานsheet');

• ประกาศตัวแปรการเข้าถึง sheet ของเรา

อย่าลืมแก้เป็นข้อมูลของเรา

URL Google Sheet ให้ Copy มาจนถึง /edit

ชื่อแผ่นงานsheet

var data = JSON.parse(e.postData.contents)
  var userMsg = data.originalDetectIntentRequest.payload.data.message.text;
  var values = sheet.getRange(2, 1, sheet.getLastRow(),sheet.getLastColumn()).getValues();

userMsg : รับ Response Message จาก Dialogflow
values : การหาช่วงตำแหน่ง รูปแบบ
→ getRange(row, column, numRows, numColumns)

Parameters .getRange

• For Loop

for(var i = 0;i<values.length; i++){
    
    if(values[i][0] == userMsg ){
      i=i+2;

วนลูปเพื่อค้นหาตำแหน่งของคำที่ต้องการค้นหา
values[i][0] ← เลข 0 คือตำแหน่งของคอลัมน์ที่ใช้ค้นหาให้ตรงกับ userMsg ที่ต้องการ

var Data = sheet.getRange(i,2).getValue();

• เมื่อได้ตำแหน่งแล้ว เราจะใช้ getValue() เพื่อดึงข้อมูลจากคอลัมน์ที่ต้องการ
  (i,2) ← i คือ row // 2 คือ column

• Response format

var result = {
    "fulfillmentMessages": [
  {
    "platform": "line",
    "type": 4,
    "payload" : {
    "line":  {
  "type": "text",
  "text": Data
    }
        
   }
  }
 ]
}

เมื่อได้รับข้อมูลที่ค้นหาแล้ว [Data] เราจะใช้รูปแบบในการ Response ค่ากลับไปยัง Webhook ของ Dialogflow

รูปแบบอื่นๆ ศึกษาได้จาก

[Dialogflow x LINE] สร้าง Chatbot LINE แบบง่ายๆ ด้วย Dialogflow และ LINE Bot Designer กันเถอะ

ฉีกกฎการแสดงผลข้อความแบบเดิมๆใน LINE Messaging API ด้วย Flex Message

• replyJSON

var replyJSON = ContentService.createTextOutput(JSON.stringify(result)).setMimeType(ContentService.MimeType.JSON);
    return replyJSON;

ใช้รูปแบบ JSON ในการ Response กลับไป Dialogflow

TypeError: postData

ใครเผลอไปกดปุ่ม play หรือการเรียกใช้งาน จะขึ้น error แบบในรูป แต่ไม่ต้องตกใจ!!ในการใช้งาน เราจะไม่เรียกใช้ function ผ่านตัว script แต่เราจะใช้งานผ่านแอปพลิเคชั่นเว็บแทน

อธิบายส่วนของโค้ดเสร็จแล้ว เรามาทำขั้นตอนถัดไปกันต่อเลย

5. เมื่อวางโค้ด และแก้ไขข้อมูลเสร็จ ก็กดปุ่ม save เลยครับ

save project

ตั้งชื่อ โครงการ App script ของเรา

6. ต่อไป เราต้องเผยแพร่โค้ดของเรา เป็นการใช้งานผ่านแอปพลิเคชั่นเว็บ

เผยแพร่ > ใช้งานผ่านแอปพลิเคชั่นเว็บ

ในการเข้าถึง sheet จะมีการตรวจสอบสิทธิ์ด้วยนะครับ กดตามภาพโลด..

**สร้างเวอร์ชั้นโครงการใหม่

การขอเข้าถึงบัญชี

มาถึงขั้นตอนนี้ ให้เรา copy URL แอปพลิเคชั่น ของเราไว้ เพื่อเอาไปใส่ใน Webhook ของ Dialogflow ในขั้นตอนต่อไป

กลับมาใส่ส่วนของ Dialogflow ไปที่เมนู Fulfillment จะมีอยู่ 2 ส่วนด้วยกัน
Webhook กับ Inline Editor เราจะใช้ส่วนของ Webhook แล้วกด ENABLED
ใส่ URL แอปพลิเคชั่น ของ Script ในขั้นตอนก่อนหน้าลงไป แล้วกด Save

ENABLED Webhook And Paste URL App Script

สร้าง Training ข้อความความที่เราต้องการค้นหา

เปิดฟังชั่น Fulfillment > Enadle webhook call for this intene เพื่อส่งต่อไปยัง webhook

มาลองทดสอบกันดู

เราจากพิมพ์ใส่ BOT ด้วยข้อความที่เราสร้างขึ้นใน Training
BOT ก็จะทำการค้นหาคำนั้น ใน Sheet ของเรา และตอบกลับใน column ที่เราต้องการ

ตัวอย่างการทำ Line BOT เชื่อมโยงกับ Google sheet

Line BOT จองห้องพักให้ลูกค้าสามารถจองห้อง ผ่านทางแชท BOT Line ได้เลย พร้อมกับ Generate QR Code ใช้ในการชำระเงินได้อีกด้วย

Line BOT Databases with Google sheet เก็บข้อมูลผู้ใช้ Line ด้วย Google sheet

Line BOT ใช้ google sheet มาทำเป็น database เอาไว้เก็บข้อมูลต่างๆ ให้ user มาดึงไปใช้

เป็นยังไงกันบ้างครับ บทความแรกอาจเขียนไม่ค่อยดี ก็ต้องขออภัยด้วยนะครับ
หวังว่าเนื้อหาทั้งหมด อาจจะเป็นประโยชน์ เอาไปพัฒนาต่อ ให้ Line BOT มีความน่าสนใจมากขึ้น และทำงานได้หลากหลายมากยิ่งขึ้นนะครับ

สนใจเพิ่มเติม ติดต่อได้ที่ fb : Thiravut Meesen

ต่อไปจะเป็นเรื่องอะไร รอติดตามนะครับ ไม่ผิดหวังแน่นอน……….