Continue criando com o fulfillment do lado do cliente ou do servidor

Agora que você aprendeu o básico, pode melhorar e personalizar sua ação com métodos específicos da tela. É possível desenvolver a ação com o modelo de fulfillment do cliente ou do lado do servidor ao criar o projeto do Actions. Para mais informações sobre essas opções, consulte Ativar tela interativa.

Se você selecionar a opção de modelo de fulfillment do cliente, poderá usar o seguinte na Ação:

Se você selecionar a opção de modelo de fulfillment do servidor, será possível usar o seguinte na Ação:

Algumas APIs de tela interativa não são recomendadas para uso com um modelo de fulfillment específico. A tabela a seguir mostra as APIs ativadas quando você seleciona a opção de fulfillment do cliente e se essas APIs são recomendadas ou não recomendadas para cada modelo:

Nome da API Compatível com o modelo de fulfillment do servidor? Compatível com o modelo de fulfillment do cliente?
sendTextQuery() Sim Compatível, mas não recomendado. Consulte sendtextQuery() para mais informações
outputTts() Sim Sim
triggerScene() Não Sim
createIntentHandler(), expect(), clearExpectations(), prompt() Não Sim
createNumberSlot(),createTextSlot, createConfirmationSlot, createOptionsSlot() Não Sim
setHomeParam(), getHomeParam(), setUserParam(), getUserParam() Não Sim

As seções a seguir explicam como implementar APIs para os modelos de fulfillment do lado do cliente e do servidor na ação de tela interativa.

Criar com o fulfillment do lado do cliente

É possível implementar as seguintes APIs de tela interativa na lógica do seu app da Web:

outputTts()

Essa API permite gerar conversão de texto em voz (TTS, na sigla em inglês) de um dispositivo sem enviar uma solicitação estática do Actions Builder ou invocar um webhook. Se nenhuma lógica do lado do servidor associada à TTS for necessária, use outputTts() no lado do cliente para pular uma viagem ao servidor e fornecer uma resposta mais rápida aos usuários.

O outputTts()do lado do cliente pode interromper ou cancelar a TTS do lado do servidor. Evite a interrupção do TTS do lado do servidor tomando estas precauções:

  • Evite chamar outputTts() no início da sessão. Em vez disso, use a TTS do lado do servidor na primeira conversa da Ação.
  • Evite chamar outputTts() consecutivamente sem ação do usuário.

O snippet a seguir mostra como usar outputTts() para gerar TTS do lado do cliente:

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

Também é possível usar outputTts() com onTtsMark() para colocar marcadores SSML na sequência de texto. O uso de onTtsMark() sincroniza a animação do app da Web ou o estado do jogo em pontos específicos de uma string SSML TTS, conforme mostrado no snippet a seguir:

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);

No exemplo anterior, as duas marcas que personalizam sua resposta são enviadas ao app da Web com o TTS.

Processar o fulfillment de intents no cliente

No modelo de fulfillment do servidor para tela interativa, todas as intents precisam ser processadas por um webhook, o que aumenta a latência na ação. Em vez de chamar um webhook, é possível processar o fulfillment de intents no seu app da Web.

Para processar intents do lado do cliente, você pode usar as seguintes APIs:

  • createIntentHandler(): um método que permite definir gerenciadores de intents no código do app da Web para intents personalizadas definidas no Actions Builder.
  • expect(): um método que ativa/registra o gerenciador de intents para que um usuário possa fazer a correspondência com a intent.
  • clearExpectations(): um método que limpa as expectativas de todas as intents ativadas no momento para que elas não possam ser correspondidas, mesmo que um usuário diga uma expressão que corresponda à intent.
  • deleteHandler(): um método que desativa os gerenciadores de intent individuais para que não seja possível corresponder essas intents.

Com essas APIs, é possível ativar ou desativar intents para diferentes estados da ação de tela interativa. Você precisa usar expect() nos gerenciadores de intents para ativá-las.

Ativar gerenciadores de intents

Ativar um gerenciador de intents é um processo de duas etapas. Primeiro, é preciso definir a intent no Actions Builder. Em seguida, para que a intent seja correspondente, é necessário chamar expect() no gerenciador de intents.

Para configurar e ativar um gerenciador de intent no lado do cliente, siga estas etapas:

  1. Abra seu projeto no Console do Actions e adicione uma intent personalizada.
  2. Selecione Sim em Esta é uma intenção global?

  3. Configure a intent e clique em Save.

  4. Defina o gerenciador da intent na lógica do app da Web, conforme mostrado no snippet a seguir:

    /**
    * 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. Chame o método expect() para registrar o gerenciador de intent, conforme mostrado no snippet a seguir:

    /**
    * 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);
    

Desativar gerenciadores de intent

Depois de definir um gerenciador de intents, você pode ativar ou desativar a intent conforme necessário para a ação. Quando você chama expect() para ativar uma intent, ele retorna um objeto com um método deleteHandler(), que pode ser usado para desativar o gerenciador recém-criado. A definição do gerenciador de intents persiste mesmo que a intent não esteja ativa no momento. Assim, você pode reativá-la quando necessário.

Para desativar um gerenciador de intents, chame deleteHandler() no gerenciador de intents, conforme mostrado no snippet a seguir:

    /**
    * 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();
    

Você pode chamar expect() para adicionar novamente um gerenciador de intent desativado, conforme mostrado no snippet a seguir:

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

Para desativar intents em massa, use o método clearExpectations(), que desativa todas as intents ativadas no momento. O snippet a seguir mostra como limpar as expectativas de todos os gerenciadores de intent:

interactiveCanvas.clearExpectations();

Processar o preenchimento de slots no cliente

Em vez de adicionar o preenchimento de slot a uma cena no Actions Builder, você pode processar o preenchimento de slots diretamente no app da Web.

Para processar o preenchimento de slots no lado do cliente, é necessário primeiro criar um slot usando uma das seguintes APIs:

  • createNumberSlot(callback, hints): um método que permite definir um slot de número no código do app da Web. Usado para solicitar um número ao usuário.
  • createTextSlot(callback, hints): um método que permite definir um slot de texto no código do app da Web. Usado para solicitar uma palavra ao usuário.
  • createConfirmationSlot(callback, hints): um método que permite definir um slot de confirmação no código do app da Web. Usado para solicitar a confirmação do usuário (sim/não).
  • createOptionsSlot(options, callback, hints): um método que permite definir um slot de opções no código do app da Web. Usado para solicitar que o usuário selecione em uma lista de opções predefinidas.

Ao criar um slot, você tem a opção de definir triggerHints, que são palavras-chave que melhoram o sistema de processamento de linguagem natural (PLN) da ação. Essas palavras-chave precisam ser curtas que o usuário pode dizer ao preencher um slot. Por exemplo, a palavra-chave triggerHints para um slot numérico pode ser years. Quando um usuário responde a uma pergunta sobre a idade dele na conversa com a resposta "I am 30 anos", sua Ação tem mais probabilidade de reconhecer que o usuário está preenchendo o slot corretamente.

Depois de criar um slot, é possível solicitá-lo ao usuário usando a API prompt:

  • prompt(tts, slot): um método que envia o TTS para o usuário, solicitando que um slot esperado seja preenchido.

Chamar prompt() retorna uma promessa com o status e o valor do slot preenchido.

Criar slot numérico

Um slot numérico permite que você solicite um número ao usuário durante a conversa. Para mais informações sobre o preenchimento de slots, consulte a seção Preenchimento de slots da documentação do Actions Builder.

Para solicitar que o usuário preencha um slot numérico no lado do cliente, siga estas etapas:

  1. Chame o método createNumberSlot() para criar um slot numérico na lógica do app da Web:

    /**
     * Create number slot.
     */
    const triggerHints = { associatedWords: ['guess number', 'number'] };
    const slot = interactiveCanvas.createNumberSlot(
      number => {
        console.log(`Number guessed: ${number}.`);
      }, triggerHints);
    
    
  2. Chame o método prompt() para solicitar o slot e processe o valor do slot da promessa retornada, conforme mostrado no snippet a seguir:

    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);
        }
      });
    

Criar slot de texto

Um slot de texto permite que você solicite uma palavra ao usuário durante a conversa. Para mais informações sobre o preenchimento de slots, consulte a seção Preenchimento de slots da documentação do Actions Builder.

Para solicitar que o usuário preencha um slot de texto no lado do cliente, siga estas etapas:

  1. Chame o método createTextSlot() para criar um slot de texto na lógica do app da Web:

    /**
     * Create text slot.
     */
    const triggerHints = { associatedWords: ['favorite color', 'color'] };
    const slot = interactiveCanvas.createTextSlot(
      text => {
        console.log(`Favorite color: ${text}.`);
      }, triggerHints);
    
    
  2. Chame o método prompt() para solicitar o slot e processe o valor do slot da promessa retornada, conforme mostrado no snippet a seguir:

    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);
        }
      });
    

Criar slot de confirmação

Um slot de confirmação permite que você solicite a confirmação de um usuário. O usuário pode responder "Sim" ou "Não" para preencher o espaço. Para mais informações sobre o preenchimento de slots, consulte a seção Preenchimento de slots da documentação do Actions Builder.

Para solicitar que o usuário preencha um slot de confirmação no lado do cliente, siga estas etapas:

  1. Chame o método createConfirmationSlot() para criar um slot de confirmação na lógica do seu app da Web:

    /**
     * Create confirmation slot (boolean).
     */
    const triggerHints = { associatedWords: ['user confirmation', 'confirmation'] };
    const slot = interactiveCanvas.createConfirmationSlot(
      yesOrNo => {
        console.log(`Confirmation: ${yesOrNo}`);
      }, triggerHints);
    
    
  2. Chame o método prompt() para solicitar o slot e processe o valor do slot da promessa retornada, conforme mostrado no snippet a seguir:

    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);
        }
      });
    

Criar slot de opções

Um slot de opções permite que você solicite que o usuário selecione de uma lista de opções predefinidas. Para mais informações sobre o preenchimento de slots, consulte a seção Preenchimento de slots da documentação do Actions Builder.

Para solicitar que o usuário preencha um slot de opções no lado do cliente, siga estas etapas:

  1. Chame o método createOptionsSlot() para criar um slot de opções na lógica do app da Web:

    /**
     * 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. Chame o método prompt() para solicitar o slot e processe o valor do slot da promessa retornada, conforme mostrado no snippet a seguir:

    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()

A API triggerScene() permite fazer a transição para outro cenário na ação de tela interativa pelo fulfillment do lado do cliente. Com triggerScene(), também é possível alternar do fulfillment do lado do cliente para o do lado do servidor quando o usuário precisa acessar uma cena do sistema no Actions Builder que exige um webhook. Por exemplo, é possível chamar triggerScene() quando um usuário precisar vincular a conta ou receber notificações. Em seguida, você pode retornar dessa cena para o fulfillment do lado do cliente com uma solicitação Canvas.

O snippet abaixo mostra como implementar o triggerScene() na sua ação.

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

Armazenamento doméstico e de usuário no cliente

Em vez de usar um webhook para receber e definir valores de armazenamento do usuário e da casa, é possível chamar APIs do lado do cliente para gerenciar o armazenamento do usuário e da casa no app da Web. Seu app da Web pode usar esses valores armazenados em várias sessões (por exemplo, em solicitações e condições) e acessar valores de uma família ou usuário específicos quando necessário. O uso dessas APIs pode reduzir a latência na ação de tela interativa, já que não é mais necessário chamar um webhook para receber e definir valores de armazenamento.

O armazenamento doméstico e do usuário no app da Web segue os mesmos princípios gerais que o armazenamento no webhook. Para mais informações sobre armazenamento doméstico e do usuário, consulte a documentação de Armazenamento do Google Home e Armazenamento do usuário.

Armazenamento doméstico do lado do cliente

Com esse recurso, você pode armazenar valores para usuários da família com base no gráfico da casa e ser compartilhado entre todas as sessões da família. Por exemplo, se um usuário joga um jogo de tela interativa em uma família, a pontuação do jogo pode ser armazenada no armazenamento doméstico, e outros membros da família podem continuar jogando com a pontuação armazenada.

Para ativar a Ação para oferecer suporte ao armazenamento doméstico, siga estas etapas:

  1. No Console do Actions, navegue até Implantar > Informações do diretório > Informações adicionais.
  2. Marque a caixa Sim para Suas ações usam armazenamento doméstico?.

Para gravar um valor no armazenamento do Google Home no seu app da Web, chame o método setHomeParam(), conforme mostrado no snippet a seguir:

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

Para ler um valor do armazenamento do Google Home no seu app da Web, chame o método getHomeParam(), conforme mostrado no snippet a seguir:

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

Para limpar todo o armazenamento da casa, chame o método resetHomeParam(), conforme mostrado no snippet a seguir:

interactiveCanvas.resetHomeParam();

Armazenamento de usuários do lado do cliente

Com o armazenamento do usuário, você armazena valores de parâmetro para um usuário específico e verificado em várias sessões. Por exemplo, se um usuário estiver jogando, a pontuação do jogo poderá ser armazenada para esse usuário. Em uma sessão de jogo subsequente, o usuário pode continuar com a mesma pontuação.

Para gravar um valor no armazenamento do usuário no seu app da Web, chame o método setUserParam(), conforme mostrado no snippet a seguir:

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

Para ler um valor do armazenamento do usuário no seu app da Web, chame o método getUserParam(), conforme mostrado no snippet a seguir:

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

Para limpar todo o armazenamento de usuário existente, chame o método resetUserParam(), conforme mostrado no snippet a seguir:

interactiveCanvas.resetUserParam();

setCanvasState()

O método setCanvasState() permite enviar dados de estado do app da Web de tela interativa para o fulfillment e notifica o Google Assistente de que o app da Web atualizou o estado. O app da Web envia o estado atualizado como um objeto JSON.

Chamar setCanvasState() não invoca uma intent. Após invocar setCanvasState(), se sendTextQuery() for invocado ou se a consulta do usuário corresponder a uma intent na conversa, os dados que foram definidos com setCanvasState() na rodada anterior da conversa ficarão disponíveis nas próximas rodadas da conversa.

No snippet abaixo, o app da Web usa setCanvasState() para definir os dados de estado da tela:

JavaScript

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

Referenciar o estado do Canvas no webhook

É possível referenciar os valores de estado da tela armazenados no código de fulfillment. Para referenciar o valor, use a sintaxe conv.context.canvas.state.KEY, em que KEY é a chave fornecida quando o valor do estado da tela foi definido.

Por exemplo, se você já tiver armazenado um valor de pontuação mais alta para um jogo no estado da tela como o parâmetro score, faça referência a esse valor usando conv.context.canvas.state.score para acessar esse valor no fulfillment:

Node.js

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

Referenciar o estado do Canvas nos comandos.

É possível fazer referência a valores de estado de Canvas armazenados em um comando. Para referenciar o valor, use a sintaxe $canvas.state.KEY, em que KEY é a chave fornecida quando o valor do estado da tela foi definido.

Por exemplo, se você já tiver armazenado um valor de pontuação mais alta para um jogo no estado da tela como o parâmetro score, faça referência a esse valor usando $canvas.state.score para acessar esse valor em uma solicitação:

JSON

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

Referenciar o estado da tela nas condições

Também é possível referenciar valores de estado de Canvas armazenados em condições. Para fazer referência ao valor, use a sintaxe canvas.state.KEY, em que KEY é a chave fornecida quando o valor do estado do Canvas foi definido.

Por exemplo, se você já armazenou um valor de pontuação mais alta para um jogo no estado da tela como o parâmetro score e quer compará-lo com o valor 999 em uma condição, é possível referenciar o valor armazenado na condição usando canvas.state.score. A expressão da condição vai ficar assim:

Sintaxe da condição

canvas.state.score >= 999
    

sendTextQuery()

O método sendTextQuery() envia consultas de texto para a ação de conversa para corresponder de maneira programática uma intent. Este exemplo usa sendTextQuery() para reiniciar o jogo de rotação triangular quando o usuário clica em um botão. Quando o usuário clica no botão "Reiniciar jogo", sendTextQuery() envia uma consulta de texto que corresponde à intent Restart game e retorna uma promessa. Essa promessa vai resultar em SUCCESS se a intent for acionada e BLOCKED se não for. O snippet a seguir corresponde à intent e processa os casos de sucesso e falha da promessa:

JavaScript

…
/**
* 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;
}
…
    

Se a promessa resultar em SUCCESS, o gerenciador de webhook Restart game enviará uma resposta Canvas para seu app da Web:

JavaScript

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

Essa resposta Canvas aciona o callback onUpdate(), que executa o código no snippet RESTART_GAME abaixo:

JavaScript

…
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;
},
…
    

Criar com o fulfillment do lado do servidor

É possível implementar as seguintes APIs de tela interativa no webhook:

Ativar o modo de tela cheia

Por padrão, os apps da Web de tela interativa incluem um cabeçalho na parte de cima da tela com o nome da ação. Você pode usar enableFullScreen para remover o cabeçalho e o substituir por um aviso temporário que aparece na tela de carregamento, permitindo que o usuário tenha uma experiência em tela cheia enquanto interage com a ação. A mensagem de aviso mostra o nome de exibição da ação, o nome do desenvolvedor e as instruções para sair dela. A cor do aviso muda de acordo com o que o usuário seleciona como tema no dispositivo.

Figura 1. Uma mensagem de aviso na tela de carregamento referente a uma ação.

Se um usuário interagir com a ação com frequência, a mensagem de aviso deixará de aparecer temporariamente na tela de carregamento. Se o usuário não interagir com sua ação por um tempo, a mensagem de aviso reaparecerá quando a ação for iniciada.

É possível ativar o modo de tela cheia no webhook ou em uma solicitação estática no Actions Builder.

Para ativar o modo de tela cheia no webhook, siga esta etapa:

  1. Defina o campo enableFullScreen como true na primeira resposta canvas retornada pelo webhook em uma sessão. O snippet a seguir é um exemplo de implementação que usa a biblioteca de cliente 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);
    

Para ativar o modo de tela cheia em uma solicitação estática no Actions Builder, siga estas etapas:

  1. Abra seu projeto no Console do Actions.
  2. Clique em Desenvolver na barra de navegação e abra o prompt que inclui a primeira resposta da canvas.
  3. Defina enable_full_screen como true, conforme mostrado no snippet abaixo:

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

continueTtsDuringTouch

Por padrão, quando um usuário toca na tela durante uma ação de tela interativa, a TTS para de tocar. Você pode ativar o TTS para continuar tocando quando os usuários tocam na tela com continueTtsDuringTouch. Esse comportamento não pode ser ativado e desativado na mesma sessão.

É possível implementar esse comportamento no webhook ou em uma solicitação estática no Actions Builder.

Para que o TTS continue depois que o usuário tocar na tela do webhook, siga esta etapa:

  • Defina o campo continueTtsDuringTouch como true na primeira resposta canvas retornada pelo webhook em uma sessão. O snippet a seguir é um exemplo de implementação que usa a biblioteca de cliente 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);
    

Para permitir que o TTS continue depois que o usuário toca na tela em uma solicitação estática no Actions Builder, siga estas etapas:

  1. Abra seu projeto no Console do Actions.
  2. Clique em Desenvolver na barra de navegação e abra o prompt que inclui a primeira resposta da canvas.
  3. Defina continue_tts_during_touch como true, conforme mostrado no snippet abaixo:

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