Tworzenie akcji konwersacyjnej (Dialogflow)

Definiujesz rozmowę dotyczącą akcji za pomocą elementu fulfillment, czyli kod wdrożony jako webhook zawierający kod agenta Dialogflow to logika konwersacyjna. Realizacja informuje Akcję, co ma zrobić, gdy użytkownicy żądań.

W przypadku Interactive Canvas w ramach realizacji zamówienia przesyłane są również informacje o Twoim aplikacji internetowej do Asystenta. Możesz użyć HtmlResponse, by poprosić Asystenta o: wyrenderuj swoją aplikację internetową. HtmlResponse może również dostarczać aktualizacje w obiekcie data, które niestandardowe funkcje logiczne aplikacji internetowej do wprowadzania w niej zmian.

Z tego artykułu dowiesz się, jak korzystać z usługi HtmlResponse w ramach realizacji i ogólnych działań wytycznych na temat korzystania z tego typu odpowiedzi.

Odpowiedzi HTML

Aby przekazać Asystentowi informacje o aplikacji internetowej, musisz dodać do HtmlResponse w realizacji celów. Element HtmlResponse może zawierać adres URL aplikacji internetowej i danych, które aktualizują aplikację internetową. Gdy wysyłasz HtmlResponse, wykonywane są te kroki:

  1. Realizacja dopasowanej intencji wysyła do urządzenia żądanie HtmlResponse.
  2. Urządzenie używa adresu URL w HtmlResponse do wczytania aplikacji internetowej.
  3. Ładunek JSON data jest przekazywany do aplikacji internetowej w wywołaniu zwrotnym.

  4. Akcja rozmowy wysyła nowy element HtmlResponse do wysyłania aktualizacji lub wczytywać nowe stany.

Przykładowa realizacja

Ten fragment fragmentu kod realizacji pokazuje, jak wdrożyć 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);

Intencja welcome

We fragmencie kodu powyżej realizacja intencji welcome wysyła HtmlResponse z adresem URL aplikacji internetowej. Asystent otrzyma to i wczytuje pod tym adresem kod HTML oraz 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',
  }));
});
...

Inne intencje

Element HtmlResponse w realizacji w przypadku innych intencji przekazuje wartości zmiennych (tint lub spin w przykładzie) do aplikacji internetowej. Własna logika internetu aplikacja używa tych wartości do aktualizowania elementów (animacji, koloru itp.):

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

Wytyczne i ograniczenia

Pamiętaj o tych wytycznych i ograniczeniach dotyczących: HtmlResponse podczas tworzenia realizacji:

  • Każda intencja w ramach realizacji musi zawierać atrybut HtmlResponse. Jeśli intencja nie zawiera HtmlResponse, aplikacja internetowa zostanie zamknięta.
  • Wystarczy, że w pierwszej intencji, którą wyślesz do użytkownika (zwykle jest to intencja Welcome).
  • Plik HtmlResponse nie może być większy niż 50 KB.