โค้ดเรียกกลับ

คุณสามารถใช้โค้ดเรียกกลับต่อไปนี้ใน Canvas แบบอินเทอร์แอกทีฟ

`onUpdate()`

โค้ดเรียกกลับ onUpdate() จะส่งข้อมูลจากเว็บฮุคไปยังเว็บแอปเพื่ออัปเดตเว็บแอปอย่างเหมาะสม คุณควรใช้โค้ดเรียกกลับนี้กับโมเดล Fulfillment ฝั่งเซิร์ฟเวอร์ของการพัฒนา Interactive Canvas เท่านั้น

ดูข้อมูลเพิ่มเติมเกี่ยวกับ onUpdate() ได้ที่ส่งข้อมูลเพื่ออัปเดตเว็บแอป

`onTtsMark()`

ระบบจะเรียกใช้โค้ดเรียกกลับ onTtsMark() เมื่อมีการอ่านแท็ก <mark> ที่กำหนดเองซึ่งรวมอยู่ในภาษามาร์กอัปการสังเคราะห์เสียงพูด (SSML) ของการตอบกลับของคุณระหว่างการอ่านออกเสียงข้อความ (TTS) คุณใช้ onTtsMark() ได้ทั้งในโมเดลการพัฒนา Fulfillment ฝั่งเซิร์ฟเวอร์และฝั่งไคลเอ็นต์

ในข้อมูลโค้ดต่อไปนี้ onTtsMark() จะซิงค์ภาพเคลื่อนไหวของเว็บแอปกับเอาต์พุต TTS ที่เกี่ยวข้อง เมื่อการดำเนินการกล่าวกับผู้ใช้ว่า "ขออภัย คุณทำหาย" เว็บแอปจะสะกดคำที่ถูกต้องและแสดงตัวอักษรแก่ผู้ใช้

ในตัวอย่างต่อไปนี้ เครื่องจัดการเว็บฮุค revealWord จะมีเครื่องหมายที่กำหนดเองเพื่อตอบสนองผู้ใช้เมื่อผู้ใช้แพ้เกม

JavaScript

…
app.handle('revealWord', conv => {
  conv.add(new Simple(`<speak>Sorry, you lost.<mark name="REVEAL_WORD"/> The word is ${conv.session.params.word}.</speak>`));
  conv.add(new Canvas());
});
…

จากนั้นข้อมูลโค้ดต่อไปนี้จะลงทะเบียนโค้ดเรียกกลับ onTtsMark() ตรวจสอบชื่อของเครื่องหมาย และเรียกใช้ฟังก์ชัน revealCorrectWord() ซึ่งจะอัปเดตเว็บแอป

JavaScript

…
setCallbacks() {
    // declare Assistant Canvas Action callbacks
    const callbacks = {
        onTtsMark(markName) {
            if (markName === 'REVEAL_WORD') {
                // display the correct word to the user
                that.revealCorrectWord();
            }
        },
    }
    callbacks.onUpdate.bind(this);
}
…

`onInputStatusChanged()`

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

โค้ดเรียกกลับของ onInputStatusChanged() จะแจ้งให้คุณทราบเมื่อสถานะอินพุตมีการเปลี่ยนแปลงใน Canvas แบบอินเทอร์แอกทีฟ การเปลี่ยนแปลงสถานะการป้อนข้อมูลจะระบุเวลาที่ไมโครโฟนเปิดและปิดหรือเมื่อ Assistant กำลังประมวลผลคำค้นหา เหตุการณ์ต่อไปนี้อาจทำให้สถานะการป้อนข้อมูลเปลี่ยนไปได้

ผู้ใช้ที่พูดกับการดำเนินการของคุณ
ผู้ใช้ป้อนข้อความในแอป Google Search สำหรับ Android (AGSA)
เว็บแอปที่ใช้ sendTextQuery() API เพื่อส่งการค้นหาข้อความไปยังการดำเนินการ
การดำเนินการเขียนไปยังพื้นที่เก็บข้อมูลในบ้านและเหตุการณ์อื่นๆ ของ Assistant

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

API นี้จะรายงานสถานะต่อไปนี้

LISTENING - บ่งบอกว่าไมโครโฟนเปิดอยู่
IDLE - บ่งบอกว่าไมโครโฟนปิดอยู่
PROCESSING - บ่งบอกว่า Assistant กำลังดำเนินการตามคำขอและไมโครโฟนปิดอยู่

API จะรายงานสถานะอินพุตไปยังการดำเนินการของคุณทุกครั้งที่สถานะเปลี่ยนแปลง

แม้ว่าจะมีการเปลี่ยนผ่านสถานะต่างๆ ได้ แต่ก็มีขั้นตอนทั่วไปดังนี้

IDLE>LISTENING>PROCESSING>IDLE - ผู้ใช้พูดว่าคำค้นหา ระบบจะประมวลผลคำค้นหา จากนั้นไมโครโฟนจะปิด
IDLE>PROCESSING>IDLE - เว็บแอปใช้ API ของ sendTextQuery() เพื่อส่งข้อความค้นหาไปยังการดำเนินการ
IDLE>LISTENING>IDLE - ผู้ใช้เปิดไมโครโฟนแต่ไม่พูดคำค้นหา

หากต้องการใช้ฟีเจอร์นี้ในการดำเนินการ ให้เพิ่ม onInputStatusChanged() ลงในโค้ดเว็บแอปดังที่แสดงในข้อมูลโค้ดต่อไปนี้

onInputStatusChanged(inputStatus) {
   console.log("The new input status is: ", inputStatus);
}

โค้ดเรียกกลับ onInputStatusChanged() จะส่งพารามิเตอร์ enum เดี่ยว inputStatus คุณสามารถตรวจสอบค่านี้เพื่อดูสถานะการป้อนข้อมูลปัจจุบัน inputStatus อาจเป็น LISTENING, PROCESSING หรือ IDLE

จากนั้นให้เพิ่ม onInputStatusChanged() ลงในออบเจ็กต์ callbacks เพื่อลงทะเบียนตามที่แสดงในตัวอย่างต่อไปนี้

 /**
  * Register all callbacks used by the Interactive Canvas Action
  * executed during game creation time.
  */
 setCallbacks() {
   const that = this;
   // Declare the Interactive Canvas action callbacks.
   const callbacks = {
     onUpdate(data) {
       console.log('Received data', data);
     },
     onInputStatusChanged(inputStatus) {
       console.log("The new input status is: ", inputStatus);
     },
   };
   // Called by the Interactive Canvas web app once web app has loaded to
   // register callbacks.
   this.canvas.ready(callbacks);
 }
}