Crea un'azione di conversazione (Dialogflow)

Puoi definire la conversazione per l'Azione con fulfillment, ovvero il codice sottoposto a deployment come webhook che contiene la logica di conversazione dell'agente Dialogflow. Il fulfillment indica all'Azione cosa fare quando gli utenti effettuano le richieste.

Per Interactive Canvas, il fulfillment comunica anche all'assistente informazioni sulla tua app web. Puoi utilizzare un HtmlResponse per chiedere all'assistente di visualizzare la tua app web. Un HtmlResponse può anche fornire aggiornamenti a data, che la logica personalizzata della tua app web utilizza per apportare modifiche alla tua app web.

Questa pagina illustra come utilizzare HtmlResponse nel fulfillment e le linee guida generali per l'utilizzo di questo tipo di risposta.

Risposte HTML

Per trasmettere informazioni sulla tua app web all'assistente, devi includere un elemento HtmlResponse nel fulfillment specifico per intent. Un HtmlResponse può contenere l'URL dell'app web e i dati che aggiornano l'app web. Quando invii un HtmlResponse, si verificano i seguenti passaggi:

  1. Il completamento dell'intent corrispondente invia un HtmlResponse al dispositivo.
  2. Il dispositivo utilizza l'URL in HtmlResponse per caricare l'app web.
  3. Il payload JSON data viene passato all'app web in un callback.

  4. L'azione conversazionale invia un nuovo HtmlResponse per inviare aggiornamenti o caricare nuovi stati.

Fulfillment di esempio

Il seguente estratto del codice di evasione esempio mostra come implementare 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);

welcome intenzione

Nello snippet riportato sopra, il fulfillment per l'intent welcome invia HtmlResponse con l'URL dell'app web. L'assistente riceve questo messaggio e carica i contenuti HTML e JavaScript a quell'indirizzo.

...
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',
  }));
});
...

Altri intent

L'elemento HtmlResponse nel fulfillment per altri intent passa i valori delle variabili (tint o spin nel campione) all'app web. La logica personalizzata per l'app web utilizza questi valori per aggiornare gli elementi (animazioni, colore e così via):

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

Linee guida e limitazioni

Quando crei il tuo fulfillment, tieni presente le seguenti linee guida e limitazioni per HtmlResponse:

  • Ogni intent nel fulfillment deve includere un HtmlResponse. Se un intent non include un HtmlResponse, l'app web viene chiusa.
  • Devi includere l'URL dell'app web solo nel primo intent che invii all'utente (di solito si tratta dell'intent Welcome).
  • HtmlResponse deve avere una dimensione massima di 50 kB.