क्लाइंट या सर्वर साइड फ़ुलफ़िलिंग की मदद से बनाना जारी रखें

अब जबकि आपने बुनियादी बातें जान ली हैं, तो कैनवस के खास तरीकों से अपनी सेट की गई कार्रवाई को बेहतर और कस्टमाइज़ किया जा सकता है. अपना ऐक्शन प्रोजेक्ट बनाते समय, अपने ऐक्शन को क्लाइंट फ़ुलफ़िलमेंट मॉडल या सर्वर साइड फ़ुलफ़िलमेंट मॉडल की मदद से डेवलप किया जा सकता है. इन विकल्पों के बारे में ज़्यादा जानने के लिए, इंटरैक्टिव कैनवस चालू करना लेख पढ़ें.

अगर क्लाइंट फ़ुलफ़िलमेंट मॉडल का विकल्प चुना जाता है, तो अपनी सेट की गई कार्रवाई में इनका इस्तेमाल किया जा सकता है:

• क्लाइंट-साइड फ़ुलफ़िलमेंट के साथ बनाएं में मौजूद सभी एपीआई

• सर्वर-साइड फ़ुलफ़िलमेंट के साथ बनाएं में मौजूद सभी एपीआई

• onTtsMark() कॉलबैक

अगर आपने सर्वर फ़ुलफ़िलमेंट मॉडल का विकल्प चुना है, तो अपनी सेट की गई कार्रवाई में इनका इस्तेमाल किया जा सकता है:

• सर्वर-साइड फ़ुलफ़िलमेंट के साथ बनाएं में मौजूद सभी एपीआई
• कॉलबैक

कुछ इंटरैक्टिव कैनवस एपीआई को किसी खास फ़ुलफ़िलमेंट मॉडल के साथ इस्तेमाल करने का सुझाव नहीं दिया जाता है. नीचे दी गई टेबल में वे एपीआई दिखाए गए हैं जिन्हें क्लाइंट फ़ुलफ़िलमेंट विकल्प चुनने पर चालू किया जाता है. साथ ही, यह भी बताया गया है कि हर मॉडल के लिए, इन एपीआई को सुझाया गया है या नहीं किया गया है:

नीचे दिए गए सेक्शन में, आपके इंटरैक्टिव कैनवस ऐक्शन में क्लाइंट और सर्वर-साइड फ़ुलफ़िलमेंट मॉडल के लिए, एपीआई लागू करने का तरीका बताया गया है.

क्लाइंट-साइड फ़ुलफ़िलमेंट के साथ काम करना

अपने वेब ऐप्लिकेशन लॉजिक में, ये इंटरैक्टिव कैनवस एपीआई लागू किए जा सकते हैं:

outputTts()

इस एपीआई की मदद से, किसी डिवाइस से लिखाई को बोली में बदलने की सुविधा (टीटीएस) को, Actions Builder से स्टैटिक प्रॉम्प्ट भेजे बिना या वेबहुक लागू किए बिना आउटपुट किया जा सकता है. अगर टीटीएस से जुड़े किसी सर्वर साइड लॉजिक की ज़रूरत नहीं है, तो क्लाइंट-साइड से outputTts() का इस्तेमाल किया जा सकता है. इससे अपने सर्वर पर जाने और उपयोगकर्ताओं को जल्दी जवाब दिया जा सकता है.

क्लाइंट-साइड से outputTts()सर्वर-साइड टीटीएस में रुकावट आ सकती है या उसे रद्द किया जा सकता है. आप ये सावधानियां बरतकर सर्वर-साइड टीटीएस को बाधित होने से रोक सकते हैं:

• सेशन की शुरुआत में outputTts() को कॉल करने से बचें. इसके बजाय, अपनी सेट की गई कार्रवाई के पहले बातचीत वाले मोड़ में सर्वर साइड टीटीएस का इस्तेमाल करें.
• उपयोगकर्ता की कार्रवाई के बीच में, outputTts() को लगातार कॉल करने से बचें.

नीचे दिए गए स्निपेट में क्लाइंट-साइड से टीटीएस आउटपुट करने के लिए, outputTts() इस्तेमाल करने का तरीका बताया गया है:

interactiveCanvas.outputTts(
      '<speak>This is an example response.</speak>', true);

टेक्स्ट क्रम में एसएसएमएल मार्कर लगाने के लिए, outputTts() के साथ onTtsMark() का भी इस्तेमाल किया जा सकता है. onTtsMark() का इस्तेमाल करने से, आपके वेब ऐप्लिकेशन ऐनिमेशन या गेम की स्थिति को SSML TTS स्ट्रिंग के खास पॉइंट पर सिंक किया जाता है, जैसा कि इस स्निपेट में दिखाया गया है:

interactiveCanvas.outputTts(
      '<speak>Speak as <mark name="number" /> number <break time="700ms"/>' +
      '<say-as interpret-as="cardinal">12345</say-as> <break time="300ms"/> ' +
      'Speak as <mark name="digits" /> digits <break time="700ms"/>' +
      '<say-as interpret-as="characters">12345</say-as></speak>', true);

पिछले उदाहरण में, आपके जवाब को पसंद के मुताबिक बनाने वाले दो मार्क, टीटीएस की मदद से वेब ऐप्लिकेशन को भेजे जाते हैं.

क्लाइंट पर इंटेंट फ़ुलफ़िलमेंट मैनेज करना

इंटरैक्टिव कैनवस के सर्वर फ़ुलफ़िलमेंट मॉडल में, सभी इंटेंट को वेबहुक से मैनेज किया जाना चाहिए. इससे आपकी सेट की गई कार्रवाई में इंतज़ार का समय बढ़ जाता है. वेबहुक को कॉल करने के बजाय, आपके पास अपने वेब ऐप्लिकेशन में इंटेंट को पूरा करने को मैनेज करने का विकल्प होता है.

इंटेंट क्लाइंट-साइड को हैंडल करने के लिए, इन एपीआई का इस्तेमाल किया जा सकता है:

• createIntentHandler(): यह तरीका आपको Actions Builder में तय किए गए कस्टम इंटेंट के लिए, अपने वेब ऐप्लिकेशन कोड में इंटेंट हैंडलर तय करने की सुविधा देता है.
• expect(): यह तरीका इंटेंट हैंडलर को चालू/रजिस्टर करता है, ताकि उपयोगकर्ता इंटेंट से मैच कर सके.
• clearExpectations(): यह ऐसा तरीका है जो फ़िलहाल चालू किए गए सभी इंटेंट के लिए उम्मीदों पर खरा उतरता है, ताकि इंटेंट मैच नहीं हो सके. भले ही, उपयोगकर्ता, इंटेंट से मेल खाने वाला कोई उच्चारण बोलता हो.
• deleteHandler(): यह तरीका अलग-अलग इंटेंट हैंडलर को बंद कर देता है, ताकि उन इंटेंट का मिलान नहीं किया जा सके.

इन एपीआई की मदद से, आपके पास इंटरैक्टिव कैनवस ऐक्शन के अलग-अलग स्टेटस के लिए, अपनी पसंद के हिसाब से इंटेंट चालू या बंद करने का विकल्प होता है. उन इंटेंट को चालू करने के लिए, आपको इंटेंट हैंडलर पर expect() का इस्तेमाल करना चाहिए.

इंटेंट हैंडलर चालू करें

इंटेंट हैंडलर चालू करना दो चरणों वाली प्रक्रिया है. सबसे पहले, आपको Actions बिल्डर में इंटेंट तय करना होगा. इसके बाद, इंटेंट को मैच करने लायक बनाने के लिए, आपको इंटेंट हैंडलर पर expect() को कॉल करना होगा.

क्लाइंट-साइड पर इंटेंट हैंडलर को कॉन्फ़िगर और चालू करने के लिए, यह तरीका अपनाएं:

1. Actions कंसोल में अपना प्रोजेक्ट खोलें और कोई कस्टम इंटेंट जोड़ें.

2. क्या यह ग्लोबल इंटेंट है? के लिए हां चुनें

3. अपना इंटेंट कॉन्फ़िगर करें और सेव करें पर क्लिक करें.

4. अपने वेब ऐप्लिकेशन लॉजिक में इंटेंट के लिए, हैंडलर तय करें, जैसा कि इस स्निपेट में दिखाया गया है:

   /**
   * Define handler for intent.
   */
   const bookTableIntent = interactiveCanvas.createIntentHandler('reserveTable',
     matchedIntent => {
       console.log("Intent match handler to reserve a table was triggered!");
     });
   
   /**
   * Define handler for intent with an argument.
   */
   const bookTableIntent = interactiveCanvas.createIntentHandler('reserveTable',
     matchedIntent => {
       const numberOfPeople = matchedIntent.getIntentArg('numberOfPeople');
       console.log(`Intent match handler to reserve a table for ${number of people} was triggered!`);
     });
   

5. इंटेंट हैंडलर को रजिस्टर करने के लिए, expect() तरीके को कॉल करें, जैसा कि इस स्निपेट में दिखाया गया है:

   /**
   * Define handler for intent and expect() it.
   */
   const bookTableIntent = interactiveCanvas.createIntentHandler('reserveTable',
     matchedIntent => {
       console.log("Intent match handler to reserve a table was triggered!");
     });
   var handler = interactiveCanvas.expect(bookTableIntent);
   

इंटेंट हैंडलर बंद करें

इंटेंट हैंडलर तय करने के बाद, अपनी सेट की गई कार्रवाई के लिए ज़रूरत के हिसाब से इंटेंट को चालू या बंद किया जा सकता है. जब किसी इंटेंट को चालू करने के लिए expect() को कॉल किया जाता है, तो यह deleteHandler() तरीके वाला एक ऑब्जेक्ट दिखाता है. इसका इस्तेमाल करके, नए बनाए गए हैंडलर को बंद किया जा सकता है. इंटेंट हैंडलर की परिभाषा तब भी बनी रहती है, जब इंटेंट चालू न हो. इसलिए, ज़रूरत पड़ने पर इंटेंट को फिर से चालू किया जा सकता है.

इंटेंट हैंडलर को बंद करने के लिए, इंटेंट हैंडलर पर deleteHandler() को कॉल करें, जैसा कि इस स्निपेट में दिखाया गया है:

    /**
    * Define handler for intent and expect() it.
    */
    const bookTableIntent = interactiveCanvas.createIntentHandler('reserveTable',
      matchedIntent => {
        console.log("Intent match handler to reserve a table was triggered!");
      });
    var handler = interactiveCanvas.expect(bookTableIntent);
    
    // Delete the handler for `bookTableIntent`.
    handler.deleteHandler();
    

बंद किए गए इंटेंट हैंडलर को फिर से जोड़ने के लिए, expect() को कॉल किया जा सकता है, जैसा कि इस स्निपेट में दिखाया गया है:

    // Re-add the `bookTableIntent` handler.
    handler = interactiveCanvas.expect(bookTableIntent);

एक साथ कई इंटेंट बंद करने के लिए, clearExpectations() तरीके का इस्तेमाल किया जा सकता है. इससे हाल ही में चालू किए गए सभी इंटेंट बंद हो जाते हैं. नीचे दिए गए स्निपेट में सभी इंटेंट हैंडलर की ज़रूरतों को साफ़ करने का तरीका बताया गया है:

interactiveCanvas.clearExpectations();

क्लाइंट पर स्लॉट भरने को मैनेज करना

Actions Builder में किसी सीन में स्लॉट भरने के बजाय, सीधे अपने वेब ऐप्लिकेशन में स्लॉट भरने की सुविधा को मैनेज करें.

क्लाइंट-साइड पर स्लॉट भरने को मैनेज करने के लिए, आपको सबसे पहले इनमें से किसी एक एपीआई का इस्तेमाल करके, स्लॉट बनाना होगा:

• createNumberSlot(callback, hints): इस तरीके का इस्तेमाल करके, वेब ऐप्लिकेशन के कोड में नंबर स्लॉट तय किया जा सकता है. इसका इस्तेमाल, उपयोगकर्ता को किसी नंबर का संकेत देने के लिए किया जाता है.
• createTextSlot(callback, hints): इस तरीके का इस्तेमाल करके, अपने वेब ऐप्लिकेशन कोड में टेक्स्ट स्लॉट को तय किया जा सकता है. इसका इस्तेमाल उपयोगकर्ता को किसी शब्द के लिए संकेत देने के लिए किया जाता है.
• createConfirmationSlot(callback, hints): इस तरीके का इस्तेमाल करके, वेब ऐप्लिकेशन के कोड में पुष्टि करने वाला स्लॉट तय किया जा सकता है. इसका इस्तेमाल, उपयोगकर्ता को पुष्टि करने के लिए का अनुरोध करने के लिए किया जाता है (हां/नहीं).
• createOptionsSlot(options, callback, hints): इस तरीके से, आपको अपने वेब ऐप्लिकेशन कोड में विकल्प स्लॉट तय करने की सुविधा मिलती है. इसका इस्तेमाल, उपयोगकर्ता को पहले से तय विकल्पों की सूची में से विकल्प चुनने का संकेत देने के लिए किया जाता है.

स्लॉट बनाते समय, वैकल्पिक रूप से triggerHints तय किया जा सकता है. ये ऐसे कीवर्ड होते हैं जो आपकी सेट की गई कार्रवाई के लिए नैचुरल लैंग्वेज समझ (एनएलयू) सिस्टम को बेहतर बनाते हैं. ये कीवर्ड छोटे शब्द होने चाहिए जिन्हें उपयोगकर्ता किसी स्लॉट को भरते समय बोल सकता है. उदाहरण के लिए, किसी नंबर स्लॉट के लिए triggerHints कीवर्ड, years हो सकता है. जब कोई उपयोगकर्ता बातचीत में अपनी उम्र से जुड़े सवालों के जवाब में जवाब के तौर पर "मैं तीस साल का हूं" लिखा होता है, तो आपकी सेट की गई कार्रवाई से इस बात की संभावना बढ़ जाती है कि उपयोगकर्ता स्लॉट को सही तरीके से भर रहा है.

स्लॉट बनाने के बाद, prompt API का इस्तेमाल करके उपयोगकर्ता को स्लॉट के लिए सूचना दी जा सकती है:

• prompt(tts, slot): वह तरीका जो उपयोगकर्ता को टीटीएस का आउटपुट देगा, जिससे उन्हें किसी सही स्लॉट को भरने के लिए कहा जाएगा.

prompt() को कॉल करने से, भरे गए स्लॉट की स्थिति और वैल्यू के बारे में प्रॉमिस मिलता है.

नंबर स्लॉट बनाएं

नंबर स्लॉट की मदद से, बातचीत के दौरान उपयोगकर्ता से किसी नंबर के लिए अनुरोध किया जा सकता है. स्लॉट भरने के बारे में ज़्यादा जानकारी के लिए, Actions Builder दस्तावेज़ का स्लॉट भरना सेक्शन देखें.

उपयोगकर्ता को क्लाइंट-साइड पर नंबर स्लॉट भरने का प्रॉम्प्ट भेजने के लिए, यह तरीका अपनाएं:

1. अपने वेब ऐप्लिकेशन लॉजिक में नंबर स्लॉट बनाने के लिए, createNumberSlot() तरीके को कॉल करें:

   /**
    * Create number slot.
    */
   const triggerHints = { associatedWords: ['guess number', 'number'] };
   const slot = interactiveCanvas.createNumberSlot(
     number => {
       console.log(`Number guessed: ${number}.`);
     }, triggerHints);
   
   

2. उपयोगकर्ता को स्लॉट के लिए निर्देश देने के लिए, prompt() तरीके को कॉल करें और वापस किए गए प्रॉमिस से स्लॉट वैल्यू को मैनेज करें, जैसा कि इस स्निपेट में दिखाया गया है:

   const promptPromise = interactiveCanvas.prompt(
     { text: 'What number am I thinking of between 1 and 10?' }, slot);
   
   promptPromise.then(
     answer => {
       if (answer.status == interactiveCanvas.AnswerStatus.ANSWERED) {
         // answer === {value: 5, status: ANSWERED}
         // Do something with answer.value
       } else {
         console.error('Promise returned unsuccessful status ' + answer.status);
       }
     });
   

टेक्स्ट स्लॉट बनाएं

टेक्स्ट स्लॉट की मदद से उपयोगकर्ता से बातचीत के दौरान किसी शब्द के लिए सूचना दी जा सकती है. स्लॉट भरने के बारे में ज़्यादा जानकारी के लिए, Actions Builder दस्तावेज़ का स्लॉट भरना सेक्शन देखें.

उपयोगकर्ता को क्लाइंट-साइड पर टेक्स्ट स्लॉट भरने का प्रॉम्प्ट भेजने के लिए, यह तरीका अपनाएं:

1. अपने वेब ऐप्लिकेशन लॉजिक में टेक्स्ट स्लॉट बनाने के लिए, createTextSlot() तरीके को कॉल करें:

   /**
    * Create text slot.
    */
   const triggerHints = { associatedWords: ['favorite color', 'color'] };
   const slot = interactiveCanvas.createTextSlot(
     text => {
       console.log(`Favorite color: ${text}.`);
     }, triggerHints);
   
   

2. उपयोगकर्ता को स्लॉट के लिए निर्देश देने के लिए, prompt() तरीके को कॉल करें और वापस किए गए प्रॉमिस से स्लॉट वैल्यू को मैनेज करें, जैसा कि इस स्निपेट में दिखाया गया है:

   const promptPromise = interactiveCanvas.prompt(
     { text: 'What is your favorite color?' }, slot);
   
   promptPromise.then(
     answer => {
       if (answer.status == interactiveCanvas.AnswerStatus.ANSWERED) {
         // answer === {value: "red", status: ANSWERED}
         // Do something with answer.value
       } else {
         console.error('Promise returned unsuccessful status ' + answer.status);
       }
     });
   

पुष्टि करने का स्लॉट बनाएं

पुष्टि करने वाले स्लॉट की मदद से, किसी उपयोगकर्ता से पुष्टि करने के लिए कहा जा सकता है. स्लॉट भरने के लिए, उपयोगकर्ता "हां" या "नहीं" में जवाब दे सकता है. स्लॉट भरने के बारे में ज़्यादा जानकारी के लिए, Actions Builder दस्तावेज़ का स्लॉट भरना सेक्शन देखें.

उपयोगकर्ता को क्लाइंट-साइड पर पुष्टि करने वाला स्लॉट भरने का प्रॉम्प्ट भेजने के लिए, यह तरीका अपनाएं:

1. अपने वेब ऐप्लिकेशन लॉजिक में पुष्टि करने का स्लॉट बनाने के लिए, createConfirmationSlot() तरीके को कॉल करें:

   /**
    * Create confirmation slot (boolean).
    */
   const triggerHints = { associatedWords: ['user confirmation', 'confirmation'] };
   const slot = interactiveCanvas.createConfirmationSlot(
     yesOrNo => {
       console.log(`Confirmation: ${yesOrNo}`);
     }, triggerHints);
   
   

2. उपयोगकर्ता को स्लॉट के लिए निर्देश देने के लिए, prompt() तरीके को कॉल करें और वापस किए गए प्रॉमिस से स्लॉट वैल्यू को मैनेज करें, जैसा कि इस स्निपेट में दिखाया गया है:

   const promptPromise = interactiveCanvas.prompt(
     { text: 'Do you agree to the Terms of Service?' }, slot);
   
   promptPromise.then(
     answer => {
       if (answer.status == interactiveCanvas.AnswerStatus.ANSWERED) {
         // answer === {value: true, status: ANSWERED}
         // Do something with answer.value
       } else {
         console.error('Promise returned unsuccessful status ' + answer.status);
       }
     });
   

विकल्पों का स्लॉट बनाएं

विकल्प स्लॉट की मदद से, उपयोगकर्ता को पहले से तय किए गए विकल्पों की सूची में से कोई विकल्प चुनने का प्रॉम्प्ट दिया जा सकता है. स्लॉट भरने के बारे में ज़्यादा जानकारी के लिए, Actions Builder दस्तावेज़ का स्लॉट भरना सेक्शन देखें.

उपयोगकर्ता को क्लाइंट-साइड पर विकल्पों का स्लॉट भरने का संकेत देने के लिए, यह तरीका अपनाएं:

1. अपने वेब ऐप्लिकेशन लॉजिक में विकल्प स्लॉट बनाने के लिए, createOptionsSlot() तरीके को कॉल करें:

   /**
    * Create options slot (list selection).
    */
   const triggerHints = { associatedWords: ['select fruit', 'choose fruit'] };
   // Define selectable options
   const options = [{
     key: 'apple',
     synonyms: ['apple', 'large apple', 'gala apple'],
   }, {
     key: 'banana',
     synonyms: ['banana', 'green banana', 'plantain'],
   }];
   const slot = interactiveCanvas.createOptionsSlot(
     options,
     selectedOption => {
       console.log(`You have selected ${selectedOption} as your fruit.`);
     }, triggerHints);
   
   

2. उपयोगकर्ता को स्लॉट के लिए निर्देश देने के लिए, prompt() तरीके को कॉल करें और वापस किए गए प्रॉमिस से स्लॉट वैल्यू को मैनेज करें, जैसा कि इस स्निपेट में दिखाया गया है:

   const promptPromise = interactiveCanvas.prompt(
     { text: 'Would you like a banana or an apple?' }, slot);
   
   promptPromise.then(
     answer => {
       if (answer.status == interactiveCanvas.AnswerStatus.ANSWERED) {
         // answer === {value: 'apple', status: ANSWERED}
         // Do something with answer.value
       } else {
         console.error('Promise returned unsuccessful status ' + answer.status);
       }
     });
   

triggerScene()

triggerScene() एपीआई आपको क्लाइंट-साइड फ़ुलफ़िलमेंट से, इंटरैक्टिव कैनवस ऐक्शन में किसी दूसरे सीन पर जाने की सुविधा देता है. triggerScene() के साथ, जब उपयोगकर्ता को Actions Builder में सिस्टम सीन को ऐक्सेस करना होता है, तब क्लाइंट-साइड फ़ुलफ़िलमेंट से सर्वर-साइड फ़ुलफ़िलमेंट पर स्विच भी किया जा सकता है. उदाहरण के लिए, जब किसी उपयोगकर्ता को अपना खाता लिंक करना हो या उसे सूचनाएं पानी हों, तब triggerScene() को कॉल किया जा सकता है. Canvas प्रॉम्प्ट के साथ, उस सीन से क्लाइंट-साइड फ़ुलफ़िलमेंट में वापस भेजा जा सकता है.

नीचे दिए गए स्निपेट में, आपकी सेट की गई कार्रवाई में triggerScene() को लागू करने का तरीका बताया गया है:

interactiveCanvas.triggerScene('SceneName').then((status) => {
  console.log("sent the request to trigger scene.");
}).catch(e => {
  console.log("Failed to trigger a scene.");
})

क्लाइंट पर होम और उपयोगकर्ता स्टोरेज

होम और उपयोगकर्ता के स्टोरेज की वैल्यू पाने और सेट करने के लिए वेबहुक का इस्तेमाल करने के बजाय, क्लाइंट-साइड एपीआई को कॉल किया जा सकता है. इससे वेब ऐप्लिकेशन में होम और उपयोगकर्ता स्टोरेज को हैंडल किया जा सकता है. ऐसा करने पर, आपका वेब ऐप्लिकेशन इन सेव की गई वैल्यू को कई सेशन (उदाहरण के लिए, संकेत और शर्तों में) में इस्तेमाल कर सकता है. साथ ही, ज़रूरत पड़ने पर किसी खास हाउस या उपयोगकर्ता के लिए वैल्यू ऐक्सेस कर सकता है. इन एपीआई का इस्तेमाल करने से, आपके इंटरैक्टिव कैनवस ऐक्शन में इंतज़ार का समय कम हो सकता है क्योंकि स्टोरेज की वैल्यू पाने और उन्हें सेट करने के लिए, अब आपको वेबहुक को कॉल करने की ज़रूरत नहीं होती.

वेब ऐप्लिकेशन में होम और उपयोगकर्ता के स्टोरेज, वेबहुक में स्टोरेज के समान सामान्य सिद्धांत होते हैं. होम और उपयोगकर्ता के स्टोरेज के बारे में ज़्यादा जानकारी के लिए, होम स्टोरेज और उपयोगकर्ता स्टोरेज से जुड़े दस्तावेज़ देखें.

क्लाइंट-साइड होम स्टोरेज

होम स्टोरेज की मदद से, होम ग्राफ़ के आधार पर पारिवारिक उपयोगकर्ताओं के लिए वैल्यू सेव की जा सकती हैं. इसे होम के सभी सेशन के दौरान शेयर किया जाता है. उदाहरण के लिए, अगर कोई उपयोगकर्ता घर में इंटरैक्टिव कैनवस गेम खेलता है, तो गेम के स्कोर को होम स्टोरेज में सेव किया जा सकता है. साथ ही, परिवार के दूसरे सदस्य सेव किए गए स्कोर के साथ गेम खेलना जारी रख सकते हैं.

सेट की गई कार्रवाई को होम स्टोरेज के साथ इस्तेमाल करने की अनुमति देने के लिए, यह तरीका अपनाएं:

1. Actions कंसोल में, डिप्लॉय करें > डायरेक्ट्री की जानकारी > ज़्यादा जानकारी पर जाएं.

2. क्या आपकी कार्रवाइयां, होम स्टोरेज का इस्तेमाल करती हैं? के लिए हां बॉक्स चुनें

   

अपने वेब ऐप्लिकेशन में होम स्टोरेज में वैल्यू लिखने के लिए, setHomeParam() तरीके को कॉल करें, जैसा कि इस स्निपेट में दिखाया गया है:

interactiveCanvas.setHomeParam('familySize',  10).then(
      result => {
        console.log('Set home param success');
      },
      fail => {
        console.error(err);
      });

अपने वेब ऐप्लिकेशन में होम स्टोरेज से वैल्यू पढ़ने के लिए, getHomeParam() तरीके को कॉल करें, जैसा कि इस स्निपेट में दिखाया गया है:

interactiveCanvas.getHomeParam('familySize').then(
      value => {
        console.log(JSON.stringify(result));
      },
      err => {
        console.error(err);
      }
  );

होम के सभी मौजूदा स्टोरेज को खाली करने के लिए, resetHomeParam() वाले तरीके का इस्तेमाल करें, जैसा कि इस स्निपेट में दिखाया गया है:

interactiveCanvas.resetHomeParam();

क्लाइंट-साइड यूज़र स्टोरेज

उपयोगकर्ता स्टोरेज की मदद से, किसी खास, पुष्टि किए गए उपयोगकर्ता के लिए कई सेशन में पैरामीटर वैल्यू स्टोर की जा सकती है. उदाहरण के लिए, अगर कोई उपयोगकर्ता गेम खेल रहा है, तो उस उपयोगकर्ता के लिए गेम का स्कोर सेव किया जा सकता है. बाद के गेमप्ले सेशन में, उपयोगकर्ता उसी स्कोर के साथ गेम खेलना जारी रख सकता है.

अपने वेब ऐप्लिकेशन में उपयोगकर्ता के स्टोरेज में वैल्यू लिखने के लिए, setUserParam() तरीके को कॉल करें, जैसा कि इस स्निपेट में दिखाया गया है:

interactiveCanvas.setUserParam('color',  'blue').then(
      result => {
        console.log('Set user param success');
      },
      err => {
        console.error(err);
      });

अपने वेब ऐप्लिकेशन के उपयोगकर्ता के स्टोरेज से वैल्यू पढ़ने के लिए, getUserParam() तरीके को कॉल करें, जैसा कि इस स्निपेट में दिखाया गया है:

interactiveCanvas.getUserParam('color').then(
      value => {
        console.log(JSON.stringify(result));
      },
      err => {
        console.error(err);
      }
  );

उपयोगकर्ता के सभी मौजूदा स्टोरेज को खाली करने के लिए, resetUserParam() तरीके का इस्तेमाल करें, जैसा कि इस स्निपेट में दिखाया गया है:

interactiveCanvas.resetUserParam();

setCanvasState()

setCanvasState() तरीके का इस्तेमाल करके, इंटरैक्टिव कैनवस वेब ऐप्लिकेशन से ऑर्डर पूरा करने के लिए जगह का डेटा भेजा जा सकता है. साथ ही, Assistant को सूचना दी जाती है कि वेब ऐप्लिकेशन ने अपना स्टेटस बदल दिया है. वेब ऐप्लिकेशन, अपडेट की गई स्थिति को JSON ऑब्जेक्ट के तौर पर भेजता है.

setCanvasState() को कॉल करने से किसी इंटेंट का इस्तेमाल नहीं होता. setCanvasState() को शुरू करने के बाद, अगर sendTextQuery() को शुरू किया जाता है या उपयोगकर्ता की क्वेरी का मिलान बातचीत के किसी इंटेंट से होता है, तो पिछली बातचीत के मोड़ में setCanvasState() के साथ सेट किया गया डेटा, बातचीत के अगले मोड़ में उपलब्ध होता है.

नीचे दिए गए स्निपेट में, वेब ऐप्लिकेशन कैनवस स्टेट डेटा सेट करने के लिए setCanvasState() का इस्तेमाल करता है:

this.action.canvas.setCanvasState({ score: 150 })
    

वेबहुक से रेफ़रंस कैनवस की स्थिति

फ़ुलफ़िलमेंट कोड में, स्टोर की गई कैनवस स्थिति की वैल्यू का रेफ़रंस दिया जा सकता है. वैल्यू का रेफ़रंस देने के लिए, conv.context.canvas.state.KEY सिंटैक्स का इस्तेमाल करें. इसमें KEY, कैनवस स्टेट वैल्यू को सेट करते समय दी गई कुंजी है.

उदाहरण के लिए, अगर आपने पहले कैनवस स्टेट में किसी गेम के लिए सबसे ज़्यादा स्कोर वाली वैल्यू को पैरामीटर score के तौर पर सेव किया था, तो उस वैल्यू को पूरा करने के लिए ऐक्सेस करने के लिए, conv.context.canvas.state.score का इस्तेमाल करके उस वैल्यू का रेफ़रंस दें:

app.handle('webhook-name', conv => {
    console.log(conv.context.canvas.state.score);
})
    

प्रॉम्प्ट में रेफ़रंस कैनवस का स्टेटस

प्रॉम्प्ट में, सेव की गई कैनवस स्थिति की वैल्यू का रेफ़रंस दिया जा सकता है. वैल्यू का रेफ़रंस देने के लिए, $canvas.state.KEY सिंटैक्स का इस्तेमाल करें. इसमें KEY, कैनवस स्टेट वैल्यू को सेट करते समय दी गई कुंजी है.

उदाहरण के लिए, अगर आपने पहले कैनवस स्टेट में किसी गेम के लिए सबसे ज़्यादा स्कोर वाली वैल्यू को पैरामीटर score के तौर पर सेव किया था, तो उस वैल्यू को प्रॉम्प्ट में ऐक्सेस करने के लिए, $canvas.state.score का इस्तेमाल करके उस वैल्यू का रेफ़रंस दें:

{
  "candidates": [{
    "first_simple": {
      "variants": [{
        "speech": "Your high score is $canvas.state.score."
      }]
    }
  }]
}
    

शर्तों में रेफ़रंस कैनवस की स्थिति

स्थितियों में, सेव किए गए कैनवस की स्थिति की वैल्यू का रेफ़रंस भी दिया जा सकता है. वैल्यू का रेफ़रंस देने के लिए, canvas.state.KEY सिंटैक्स का इस्तेमाल करें. यहां कैनवस स्टेट वैल्यू को सेट करते समय दी गई कुंजी KEY है.

उदाहरण के लिए, अगर आपने पहले कैनवस स्टेट में किसी गेम के लिए सबसे ज़्यादा स्कोर वाली वैल्यू को score पैरामीटर के तौर पर सेव किया था और आपको उसकी तुलना, शर्त में मौजूद वैल्यू 999 से करनी है, तो अपनी स्थिति में सेव की गई वैल्यू की पहचान करने के लिए canvas.state.score का इस्तेमाल करें. आपका शर्त एक्सप्रेशन कुछ ऐसा दिखता है:

canvas.state.score >= 999
    

sendTextQuery()

sendTextQuery() तरीका, बातचीत की सुविधा वाली कार्रवाई को टेक्स्ट क्वेरी भेजता है, ताकि किसी इंटेंट को प्रोग्राम के हिसाब से मैच किया जा सके. यह सैंपल, sendTextQuery() का इस्तेमाल करके, उपयोगकर्ता के किसी बटन पर क्लिक करने पर, तीन बार घुमाने वाले गेम को रीस्टार्ट करता है. जब उपयोगकर्ता "गेम रीस्टार्ट करें" बटन पर क्लिक करता है, तो sendTextQuery() एक टेक्स्ट क्वेरी भेजता है. यह क्वेरी, Restart game इंटेंट से मेल खाती है और मैसेज दिखाता है. अगर इंटेंट ट्रिगर हुआ है, तो इस प्रॉमिस को SUCCESS और इंटेंट ट्रिगर न होने पर BLOCKED मिलता है. नीचे दिया गया स्निपेट, इंटेंट से मेल खाता है और किए गए वादे के सफल होने और न होने के मामलों को हैंडल करता है:

…
/**
* Handle game restarts
*/
async handleRestartGame() {
    console.log(`Request in flight`);
    this.button.texture = this.button.textureButtonDisabled;
    this.sprite.spin = false;
    const res = await this.action.canvas.sendTextQuery('Restart game');
    if (res.toUpperCase() !== 'SUCCESS') {
        console.log(`Request in flight: ${res}`);
        return;
    }
    console.log(`Request in flight: ${res}`);
    this.button.texture = this.button.textureButtonDisabled;
    this.sprite.spin = false;
}
…
    

अगर प्रॉमिस SUCCESS में नतीजा देता है, तो Restart game वेबहुक हैंडलर आपके वेब ऐप्लिकेशन को Canvas जवाब भेजता है:

…
app.handle('restart', conv => {
  conv.add(new Canvas({
    data: {
      command: 'RESTART_GAME'
    }
  }));
});
…
    

यह Canvas रिस्पॉन्स, onUpdate() कॉलबैक को ट्रिगर करता है, जो नीचे दिए गए RESTART_GAME कोड स्निपेट में कोड को एक्ज़ीक्यूट करता है:

…
RESTART_GAME: (data) => {
    this.scene.button.texture = this.scene.button.textureButton;
    this.scene.sprite.spin = true;
    this.scene.sprite.tint = 0x00FF00; // green
    this.scene.sprite.rotation = 0;
},
…
    

सर्वर-साइड फ़ुलफ़िलमेंट के साथ बनाएं

अपने वेबहुक में, नीचे दिए गए इंटरैक्टिव कैनवस एपीआई लागू किए जा सकते हैं:

फ़ुल-स्क्रीन मोड चालू करें

डिफ़ॉल्ट रूप से, इंटरैक्टिव कैनवस वेब ऐप्लिकेशन में स्क्रीन के सबसे ऊपर आपकी सेट की गई कार्रवाई का नाम एक हेडर होता है. हेडर को हटाने के लिए enableFullScreen का इस्तेमाल करें. इसकी जगह, लोड होने वाली स्क्रीन में अस्थायी टोस्ट दिखेगा. इससे आपकी सेट की गई कार्रवाई से इंटरैक्ट करते समय, उपयोगकर्ता को फ़ुल-स्क्रीन अनुभव मिलेगा. टोस्ट मैसेज, कार्रवाई का डिसप्ले नाम, डेवलपर का नाम, और कार्रवाई से बाहर निकलने के निर्देश दिखाता है. साथ ही, टोस्ट का रंग इस हिसाब से बदलता है कि उपयोगकर्ता अपने डिवाइस पर थीम के तौर पर क्या चुनता है.

अगर कोई उपयोगकर्ता आपकी सेट की गई कार्रवाई से बार-बार इंटरैक्ट करता है, तो लोडिंग स्क्रीन पर टोस्ट मैसेज कुछ समय के लिए दिखना बंद हो जाता है. अगर उपयोगकर्ता कुछ समय तक आपकी सेट की गई कार्रवाई से नहीं जुड़ता है, तो कार्रवाई लॉन्च करने पर टोस्ट मैसेज फिर से दिखने लगता है.

अपने वेबहुक में या Actions Builder में स्टैटिक प्रॉम्प्ट में फ़ुल-स्क्रीन मोड चालू किया जा सकता है.

अपने वेबहुक में फ़ुल-स्क्रीन मोड चालू करने के लिए, यह तरीका अपनाएं:

1. किसी सेशन में वेबहुक से मिले पहले canvas जवाब में, enableFullScreen फ़ील्ड को true पर सेट करें. नीचे दिए गए स्निपेट में Node.js क्लाइंट लाइब्रेरी को लागू करने का उदाहरण दिया गया है:

    const { conversation, Canvas } = require('@assistant/conversation');
    const functions = require('firebase-functions');
   
    const app = conversation();
   
    app.handle('invocation_fullscreen', conv => {
      conv.add(new Canvas(
        {
          url: 'https://example-url.com',
          enableFullScreen: true
        }));
    });
   
    exports.ActionsOnGoogleFulfillment = functions.https.onRequest(app);
   

Actions Builder में किसी स्टैटिक प्रॉम्प्ट में, फ़ुल-स्क्रीन मोड चालू करने के लिए, यह तरीका अपनाएं:

1. अपना प्रोजेक्ट Actions कंसोल में खोलें.
2. नेविगेशन बार में डेवलप करें पर क्लिक करें और वह प्रॉम्प्ट खोलें जिसमें पहला canvas जवाब शामिल है.

3. enable_full_screen को true पर सेट करें, जैसा कि इस स्निपेट में दिखाया गया है:

    {
     "candidates": [
       {
         "canvas": {
           "url": "https://example-url.com",
           "enable_full_screen": true
         }
       }
     ]
   }
   

continueTtsDuringTouch

डिफ़ॉल्ट रूप से, जब कोई उपयोगकर्ता किसी इंटरैक्टिव कैनवस ऐक्शन का इस्तेमाल करते समय स्क्रीन पर टैप करता है, तो टीटीएस चलाना बंद कर देता है. जब उपयोगकर्ता continueTtsDuringTouch से स्क्रीन को छूते हैं, तब आप टीटीएस को चालू रहने के लिए चालू कर सकते हैं. इस सेटिंग को एक ही सेशन में, चालू या बंद नहीं किया जा सकता.

यह तरीका अपने वेबहुक या ऐक्शन बिल्डर में स्टैटिक प्रॉम्प्ट के ज़रिए लागू किया जा सकता है.

जब उपयोगकर्ता आपके वेबहुक की स्क्रीन पर टैप करे, उसके बाद टीटीएस को चालू करने के लिए, यह तरीका अपनाएं:

• किसी सेशन में वेबहुक से मिले पहले canvas जवाब में, continueTtsDuringTouch फ़ील्ड को true पर सेट करें. नीचे दिए गए स्निपेट में Node.js क्लाइंट लाइब्रेरी को लागू करने का उदाहरण दिया गया है:

  const { conversation, Canvas } = require('@assisant/conversation');
  const functions = require('firebase-functions');
  
  const app = conversation();
  
  app.handle('intent-name', conv => {
    conv.add(new Canvas(
      {
        url: 'https://example-url.com',
        continueTtsDuringTouch: true
      }));
  });
  
  exports.ActionsOnGoogleFulfillment = functions.https.onRequest(app);
  

उपयोगकर्ता के ऐक्शन बिल्डर में स्टैटिक प्रॉम्प्ट की मदद से, स्क्रीन पर टैप करने के बाद टीटीएस की सुविधा चालू करने के लिए, यह तरीका अपनाएं:

1. अपना प्रोजेक्ट Actions कंसोल में खोलें.
2. नेविगेशन बार में डेवलप करें पर क्लिक करें और वह प्रॉम्प्ट खोलें जिसमें पहला canvas जवाब शामिल है.

3. continue_tts_during_touch को true पर सेट करें, जैसा कि इस स्निपेट में दिखाया गया है:

     {
      "candidates": [
        {
          "canvas": {
            "url": "https://example-url.com",
            "continue_tts_during_touch": true
          }
        }
      ]
    }