ทำความเข้าใจการดำเนินการตามคำสั่งซื้อโดยการผสานรวม Dialogflow กับปฏิทิน

1. ก่อนเริ่มต้น

ใน Codelab นี้ คุณจะได้เรียนรู้วิธีการที่ Dialogflow เชื่อมต่อกับระบบแบ็กเอนด์เพื่อการตอบสนองที่สมบูรณ์และแบบไดนามิกแก่ผู้ใช้ คำถาม

ข้อกำหนดเบื้องต้น

ก่อนดำเนินการต่อ คุณต้องทำ Codelab ต่อไปนี้ให้เสร็จ

1. สร้างเครื่องจัดตารางเวลาการนัดหมายด้วย Dialogflow
2. ผสานรวม Dialogflow กับ Actions on Google
3. ทำความเข้าใจเอนทิตีใน Dialogflow

นอกจากนี้ คุณยังต้องเข้าใจแนวคิดและโครงสร้างของ Dialogflow จากวิดีโอต่อไปนี้ซึ่งอยู่ในเส้นทางสร้างแชทบ็อตด้วย Dialogflow

สิ่งที่คุณจะได้เรียนรู้

• Fulfillment คืออะไร
• วิธีตั้งค่าบัญชีบริการสำหรับปฏิทิน
• วิธีตั้งค่าปฏิทิน
• วิธีเปิดใช้การดำเนินการตามคำสั่งซื้อใน Dialogflow
• วิธีทดสอบ Fulfillment

สิ่งที่คุณจะสร้าง

• การดำเนินการตามคำสั่งซื้อโดยใช้ Cloud Functions
• การผสานรวมระหว่าง Dialogflow กับปฏิทิน

สิ่งที่ต้องมี

• เว็บเบราว์เซอร์และอีเมลสำหรับเข้าสู่ระบบคอนโซล Dialogflow
• บัญชี Google สำหรับเข้าถึงปฏิทิน

2. Fulfillment คืออะไร

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

ตัวอย่างกรณีที่สามารถใช้การจำหน่ายเพื่อขยายตัวแทนได้มีดังนี้

• เพื่อสร้างคำตอบแบบไดนามิกโดยอิงตามข้อมูลที่ค้นหาจากฐานข้อมูล
• เพื่อสั่งซื้อตามผลิตภัณฑ์ที่ลูกค้าขอ
• ใช้กฎและเงื่อนไขที่ชนะในเกม

3. เปิดใช้ API ปฏิทิน

1. ในคอนโซล Dialogflow ให้คลิก
2. ในแท็บทั่วไป ให้เลื่อนไปที่รหัสโปรเจ็กต์ แล้วคลิก Google Cloud

3. ใน Google Cloud Console ให้คลิกเมนูการนำทาง ☰ > API และ บริการ > คลัง
4. ค้นหา "Google Calendar API" แล้วคลิกเปิดใช้เพื่อใช้ API ในโปรเจ็กต์ Google Cloud

4. ตั้งค่าบัญชีบริการ

1. คลิกเมนูนำทาง ☰ > API และ บริการ > ข้อมูลเข้าสู่ระบบ
2. คลิกสร้างข้อมูลเข้าสู่ระบบ > บัญชีบริการ

3. ป้อน "appointment-scheduler" ในรายละเอียดบัญชีบริการ เป็นชื่อบัญชีบริการ แล้วคลิกสร้าง

4. ตรงข้อความให้สิทธิ์บัญชีบริการนี้ในการเข้าถึงโปรเจ็กต์ ให้คลิกต่อไปเพื่อข้าม
5. ในตำแหน่งของข้อความให้สิทธิ์ผู้ใช้เข้าถึงบัญชีบริการนี้ (ไม่บังคับ) ให้คลิกสร้างคีย์ จากนั้นเลือก JSON และคลิกสร้าง

ระบบจะดาวน์โหลดไฟล์ JSON ลงในคอมพิวเตอร์ ซึ่งคุณจะต้องใช้ในส่วนการตั้งค่าต่อไปนี้

5. การตั้งค่าปฏิทิน

1. ไปที่ปฏิทิน แล้วคลิกเมนูหลัก ⋮ > เพิ่มปฏิทินอื่น > สร้างปฏิทินใหม่

2. ป้อน "ปฏิทินการนัดหมาย" เป็นชื่อปฏิทินและคลิกสร้างปฏิทิน
3. โหลดหน้านี้ซ้ำ จากนั้นคลิกปฏิทินการนัดหมาย เลื่อนไปที่ใช้ร่วมกับบุคคลที่ระบุ แล้วคลิกเพิ่มบุคคล
4. คัดลอก client_email จากไฟล์ JSON ที่คุณดาวน์โหลดเป็นส่วนหนึ่งของการสร้างบัญชีบริการ แล้ววางลงในกล่องโต้ตอบ

5. คลิกรายการสิทธิ์แบบเลื่อนลง แล้วคลิกเปลี่ยนแปลงกิจกรรม > ส่ง

6. ขณะที่ยังอยู่ในการตั้งค่า ให้เลื่อนไปที่ใช้งานร่วมกับปฏิทิน แล้วคัดลอกรหัสปฏิทิน

หมายเหตุ: หากพบปัญหาเกี่ยวกับสิทธิ์หรือทำการเปลี่ยนแปลงกิจกรรมเป็นสีเทา โปรดเปลี่ยนสิทธิ์ของปฏิทินรองในคอนโซลผู้ดูแลระบบ

6. ตั้งค่าการดำเนินการตามคำสั่งซื้อใน Dialogflow

เพิ่มบัญชีบริการและรหัสปฏิทินในการดำเนินการตามคำสั่งซื้อ

1. ไปที่ Agent AppointmentScheduler Dialogflow แล้วคลิก Fulfillment
2. เปิดใช้เครื่องมือแก้ไขในบรรทัด

3. อัปเดตไฟล์ index.js ด้วยโค้ดต่อไปนี้

'use strict';

// Import the Dialogflow module from Google client libraries.
const functions = require('firebase-functions');
const {google} = require('googleapis');
const {WebhookClient} = require('dialogflow-fulfillment');

// Enter your calendar ID below and service account JSON below
const calendarId = "<INSERT YOUR CALENDAR ID>";
const serviceAccount = {<INSERT CONTENTS OF YOUr JSON FILE HERE>}; // Starts with {"type": "service_account",...

// Set up Google Calendar Service account credentials
const serviceAccountAuth = new google.auth.JWT({
 email: serviceAccount.client_email,
 key: serviceAccount.private_key,
 scopes: 'https://www.googleapis.com/auth/calendar'
});

const calendar = google.calendar('v3');
process.env.DEBUG = 'dialogflow:*'; // enables lib debugging statements

const timeZone = 'America/Los_Angeles';
const timeZoneOffset = '-07:00';

// Set the DialogflowApp object to handle the HTTPS POST request.
exports.dialogflowFirebaseFulfillment = functions.https.onRequest((request, response) => {
 const agent = new WebhookClient({ request, response });
 console.log("Parameters", agent.parameters);
 const appointment_type = agent.parameters.appointment_type;
 function makeAppointment (agent) {
   // Calculate appointment start and end datetimes (end = +1hr from start)
   const dateTimeStart = new Date(Date.parse(agent.parameters.date.split('T')[0] + 'T' + agent.parameters.time.split('T')[1].split('-')[0] + timeZoneOffset));
   const dateTimeEnd = new Date(new Date(dateTimeStart).setHours(dateTimeStart.getHours() + 1));
   const appointmentTimeString = dateTimeStart.toLocaleString(
     'en-US',
     { month: 'long', day: 'numeric', hour: 'numeric', timeZone: timeZone }
   );
    // Check the availability of the time, and make an appointment if there is time on the calendar
   return createCalendarEvent(dateTimeStart, dateTimeEnd, appointment_type).then(() => {
     agent.add(`Ok, let me see if we can fit you in. ${appointmentTimeString} is fine!.`);
   }).catch(() => {
     agent.add(`I'm sorry, there are no slots available for ${appointmentTimeString}.`);
   });
 }

// Handle the Dialogflow intent named 'Schedule Appointment'.
 let intentMap = new Map();
 intentMap.set('Schedule Appointment', makeAppointment);
 agent.handleRequest(intentMap);
});

//Creates calendar event in Google Calendar
function createCalendarEvent (dateTimeStart, dateTimeEnd, appointment_type) {
 return new Promise((resolve, reject) => {
   calendar.events.list({
     auth: serviceAccountAuth, // List events for time period
     calendarId: calendarId,
     timeMin: dateTimeStart.toISOString(),
     timeMax: dateTimeEnd.toISOString()
   }, (err, calendarResponse) => {
     // Check if there is a event already on the Calendar
     if (err || calendarResponse.data.items.length > 0) {
       reject(err || new Error('Requested time conflicts with another appointment'));
     } else {
       // Create event for the requested time period
       calendar.events.insert({ auth: serviceAccountAuth,
         calendarId: calendarId,
         resource: {summary: appointment_type +' Appointment', description: appointment_type,
           start: {dateTime: dateTimeStart},
           end: {dateTime: dateTimeEnd}}
       }, (err, event) => {
         err ? reject(err) : resolve(event);
       }
       );
     }
   });
 });
}

4. แทนที่ <INSERT YOUR CALENDAR ID> ด้วยรหัสปฏิทินที่คัดลอกไว้ในส่วนก่อนหน้า
5. ให้แทนที่ <INSERT CONTENTS OF YOUR JSON FILE HERE> ด้วยเนื้อหาของไฟล์ JSON
6. (ไม่บังคับ) เปลี่ยน const timeZone และ const timeZoneOffset ตามเขตเวลาสำหรับปฏิทินการนัดหมาย
7. คลิกทำให้ใช้งานได้

หมายเหตุ: หากคุณปรับการจำหน่ายใน Dialogflow ให้กับเขตเวลา คุณจะต้องแก้ไขเป็นเวลาสากลเชิงพิกัดอีกครั้งเพื่อให้ทำงานกับฟรอนท์เอนด์ได้

เปิดใช้การตอบกลับการดำเนินการตามคำสั่งซื้อ

1. ไปที่คอนโซล Dialogflow แล้วคลิก Intent
2. คลิกกำหนดเวลาความตั้งใจในการนัดหมาย
3. เลื่อนลงไปที่การดำเนินการตามคำสั่งซื้อ แล้วเปิดเปิดใช้การเรียกเว็บฮุคสำหรับ Intent

4. คลิกบันทึก
5. คลิกทำให้ใช้งานได้

7. ทดสอบแชทบ็อต

คุณทดสอบแชทบ็อตได้ในเครื่องมือจำลอง Actions หรือใช้การผสานรวมเว็บหรือ Google Home ที่เคยรู้จักมาก่อนหน้านี้ได้

1. ผู้ใช้: "กำหนดนัดจดทะเบียนรถเวลา 14.00 น. ของพรุ่งนี้"
2. แชทบ็อต: "โอเค ขอดูว่าเราสะดวกให้คุณไหม วันที่ 24 เมษายน เวลา 14:00 น. ดีนะ"

3. ปฏิทินจะจองคำตอบ

8. ล้างข้อมูล

หากคุณกำลังวางแผนที่จะทำ Codelab อื่นๆ ของ Dialogflow ให้เสร็จสิ้น ให้ข้ามส่วนนี้ไปก่อนแล้วกลับมาทำต่อภายหลัง

ลบ Agent ของ Dialogflow

1. คลิก ถัดจากตัวแทนที่มีอยู่

2. ในแท็บทั่วไป ให้เลื่อนไปที่ด้านล่างแล้วคลิกลบตัวแทนนี้
3. พิมพ์ Delete ในกล่องโต้ตอบ และคลิก Delete

9. ขอแสดงความยินดี

คุณสร้างแชทบ็อตใน Dialogflow และผสานรวมกับปฏิทินแล้ว ตอนนี้คุณเป็นนักพัฒนาแชทบ็อตแล้ว

ดูข้อมูลเพิ่มเติม

หากต้องการเรียนรู้เพิ่มเติม โปรดดูตัวอย่างโค้ดในหน้า Dialogflow GitHub