สร้างการกระทำที่เป็นการสนทนา (Dialogflow)

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

สำหรับ Canvas แบบอินเทอร์แอกทีฟ การดำเนินการตามคำสั่งซื้อจะยังสื่อสารข้อมูลเกี่ยวกับ ไปยัง Assistant คุณใช้ HtmlResponse เพื่อบอก Assistant ให้ทำสิ่งต่อไปนี้ได้ แสดงผลเว็บแอปของคุณ HtmlResponse ยังอัปเดต data ได้ด้วย ซึ่ง ตรรกะที่กำหนดเองของเว็บแอปใช้เพื่อทำการเปลี่ยนแปลงเว็บแอป

หน้านี้อธิบายวิธีใช้ HtmlResponse ในการจำหน่ายและแบบทั่วไป หลักเกณฑ์ในการใช้คำตอบประเภทนี้

การตอบสนอง HTML

หากต้องการส่งต่อข้อมูลเกี่ยวกับเว็บแอปของคุณไปยัง Assistant คุณต้องใส่ HtmlResponse ในการตอบสนองที่เฉพาะเจาะจงตาม Intent HtmlResponse สามารถมี URL ดังกล่าว ของเว็บแอปและข้อมูลที่อัปเดตเว็บแอป เมื่อคุณส่ง HtmlResponse จะมีขั้นตอนต่อไปนี้

การดำเนินการตามวัตถุประสงค์ที่ตรงกันจะส่ง HtmlResponse ไปยังอุปกรณ์
อุปกรณ์ใช้ URL ใน HtmlResponse เพื่อโหลดเว็บแอป
ระบบจะส่งเพย์โหลด JSON ของ data ไปยังเว็บแอปใน Callback
การดำเนินการแบบสนทนาจะส่ง HtmlResponse ใหม่เพื่อส่งการอัปเดต หรือ โหลดสถานะใหม่

หมายเหตุ: หากค่าสำหรับช่อง url มีการเปลี่ยนแปลงในการจำหน่ายครั้งต่อๆ ไป เว็บแอปก็จะโหลดซ้ำ หากมีการระบุค่าเดียวกันสำหรับ url หรือหาก url จะไม่รวมอยู่ในการตอบกลับครั้งต่อๆ ไป ส่วนเว็บแอปที่มีอยู่จะ เก็บไว้ในอุปกรณ์

ตัวอย่างการดำเนินการตามคำสั่งซื้อ

ข้อความต่อไปนี้ที่ตัดตอนมาจากตัวอย่าง รหัสการดำเนินการตามคำสั่งซื้อแสดงวิธีใช้งาน HtmlResponse

const functions = require('firebase-functions');
const {dialogflow, HtmlResponse} = require('actions-on-google');

const app = dialogflow({debug: true});
app.intent('welcome', (conv) => {
  conv.ask('Welcome! Do you want me to change color or pause spinning?');
  conv.ask(new HtmlResponse({
    url: 'https://your-web-app.com',
  }));
});

// map of human speakable colors to color values
const tints = {
  red: 0xFF0000,
  green: 0x00FF00,
  blue: 0x0000FF,
};
app.intent('color', (conv, {color}) => {
  if (color in tints) {
    conv.ask(`Ok, I changed my color to ${color}. What else?`);
    conv.ask(new HtmlResponse({
      data: {
        tint: tints[color],
      },
    }));
    return;
  }
  conv.ask(`Sorry, I don't know that color. What else?`);
  conv.ask(new HtmlResponse({
    data: {
      query: conv.query,
    },
  }));
});
app.intent('start', (conv) => {
  conv.ask(`Ok, I'm spinning. What else?`);
  conv.ask(new HtmlResponse({
    data: {
      spin: true,
    },
  }));
});

app.intent('pause', (conv) => {
  conv.ask(`Ok, I paused spinning. What else?`);
  conv.ask(new HtmlResponse({
    data: {
      spin: false,
    },
  }));
});

app.intent('restart game', (conv) => {
  conv.ask(new HtmlResponse({
    data: {
      command: 'RESTART_GAME',
    },
  }));
});

exports.conversation = functions.https.onRequest(app);

Intent `welcome` รายการ

ในตัวอย่างข้างต้น Fulfillment สำหรับ Intent welcome จะส่ง HtmlResponse ที่มี URL สำหรับเว็บแอป Assistant จะได้รับ และโหลด HTML และ JavaScript ในที่อยู่นั้น

...
app.intent('welcome', (conv) => {
  conv.ask('Welcome! Do you want me to change color or pause spinning?');
  conv.ask(new HtmlResponse({
    url: 'https://your-web-app.com',
  }));
});
...

Intent อื่นๆ

HtmlResponse ใน Fulfillment สำหรับ Intent อื่นๆ จะส่งค่าตัวแปร (tint หรือ spin ในตัวอย่าง) ไปยังเว็บแอป ตรรกะที่กำหนดเองสำหรับเว็บ แอปใช้ค่าเหล่านี้ในการอัปเดตองค์ประกอบ (ภาพเคลื่อนไหว สี ฯลฯ)

...
app.intent('start', (conv) => {
  conv.ask(`Ok, I'm spinning. What else?`);
  conv.ask(new HtmlResponse({
    data: {
      spin: true,
    },
  }));
});
...

หลักเกณฑ์และข้อจำกัด

โปรดคำนึงถึงหลักเกณฑ์และข้อจำกัดต่อไปนี้สำหรับ HtmlResponse เมื่อคุณสร้างการดำเนินการตามคำสั่งซื้อ:

Intent แต่ละรายการในการดําเนินการตามคําสั่งซื้อต้องมี HtmlResponse หากเป็น Intent ไม่มี HtmlResponse เว็บแอปของคุณจะปิดลง
คุณต้องใส่ URL ของเว็บแอปไว้ใน Intent แรกที่ส่งไปให้เท่านั้น ผู้ใช้ (โดยปกติคือ Intent Welcome)
HtmlResponse ต้องมีขนาดไม่เกิน 50 KB