Crie um app do Google Chat com o Dialogflow ES

Esta página explica como criar um app do Google Chat que usa o Dialogflow ES para entender e responder à linguagem natural. Você também pode usar o Dialogflow CX, que tem uma integração direta com o Google Chat, para criar um app do Google Chat com o Dialogflow CX seguindo o guia Google Chat do Dialogflow CX.

Objetivos

  • Prepare o ambiente.
  • Crie e implante um agente do Dialogflow ES.
  • Crie e implante um app de chat com tecnologia do agente do Dialogflow ES.
  • Teste o app Chat.

Pré-requisitos

Arquitetura

O diagrama a seguir mostra a arquitetura de um app de chat criado com o Dialogflow:

Arquitetura de um app de chat implementado com o Dialogflow.

No diagrama anterior, um usuário interagindo com um app de chat do Dialogflow tem o seguinte fluxo de informações:

  1. Um usuário envia uma mensagem no Chat para um app do Chat, em uma mensagem direta ou em um espaço do Chat.
  2. Um agente virtual do Dialogflow, que reside em , recebe e processa a mensagem para produzir uma resposta.
  3. De maneira opcional, usando um webhook do Dialogflow, o agente do Dialogflow pode interagir com serviços externos de terceiros, como um sistema de gerenciamento de projetos ou uma ferramenta de emissão de tíquetes.
  4. O agente do Dialogflow envia uma resposta de volta para o serviço do app Chat no Chat.
  5. A resposta é enviada para o espaço do Chat.

Configure o ambiente

Antes de usar as APIs do Google, é necessário ativá-las em um projeto do Google Cloud. É possível ativar uma ou mais APIs em um único projeto do Google Cloud.

  1. No console de APIs do Google, ative as APIs Google Chat e Dialogflow.

    Ativar as APIs

  2. Confirme se você está ativando as APIs no projeto correto na nuvem e clique em Próxima.

  3. Confirme se você está ativando as APIs corretas e clique em Ativar.

Criar um agente do Dialogflow ES

Se você não tiver um agente do Dialogflow ES:

  1. Acesse o Console do Dialogflow ES.
  2. Clique em Create Agent.
  3. Dê um nome a ele, selecione um idioma padrão e um fuso horário.
  4. Associe-o ao seu projeto na nuvem.
  5. Clique em Criar.
  6. Crie intents e entidades conforme necessário para o fluxo de conversa do seu app de chat. Você pode começar com uma intenção de saudação.
  7. Anote o ID do projeto.

Para um guia detalhado, consulte Criar um agente.

Criar um app de chat e conectá-lo ao agente do Dialogflow

Depois de criar um agente do Dialogflow ES, siga estas etapas para transformá-lo em um app de chat:

  1. No console de APIs do Google, acesse a API Google Chat. Pesquise "API Google Chat" e clique em API Google Chat e em Gerenciar.

    Acessar a API Chat

  2. Clique em Configuração e configure o app Chat:

    1. Em Nome do app, insira Dialogflow App.
    2. Em URL do avatar, insira https://developers.google.com/workspace/chat/images/quickstart-app-avatar.png.
    3. Em Descrição, insira Responds to real human conversation.
    4. Em Funcionalidade, selecione Participar de espaços e conversas em grupo.
    5. Em Configurações de conexão, selecione Dialogflow.
    6. Em Configurações do Dialogflow, selecione Dialogflow ES.
    7. Disponibilize o app de chat para pessoas e grupos específicos no seu domínio e digite seu endereço de e-mail.
    8. Em Registros, selecione Registrar erros no Logging.

  3. Clique em Salvar.

O app Chat está pronto para receber e responder a mensagens.

Teste o app do Chat

Teste o app de chat do Dialogflow ES enviando uma mensagem para ele no Google Chat.

  1. Abra o Google Chat usando a conta do Google Workspace que você informou ao se adicionar como trusted tester.

    Acessar o Google Chat

  2. Clique em Novo chat.
  3. No campo Adicionar uma ou mais pessoas, digite o nome do seu app de chat.

  4. Selecione seu app de chat nos resultados. Uma mensagem direta é aberta.

  5. Na nova mensagem direta com o app, digite Hello e pressione enter.

    O app Dialogflow Chat responde com uma mensagem de saudação.

Respostas de texto

As respostas de texto são enviadas ao Google Chat como mensagens de texto. Com essa formatação, você pode colocar o texto em negrito ou itálico envolvendo-o em determinados símbolos (markdown light).

A resposta por mensagem de texto tem a mesma aparência visual da resposta de texto padrão no console do Dialogflow. No entanto, a resposta da API bruta será um pouco diferente. Ele também define a configuração da plataforma como GOOGLE_HANGOUTS, o que pode ser interessante ao criar agentes para várias integrações.

"fulfillmentMessages": [
{
   "text": {
   "text": [
        "This is a test."
   ]
},
  "platform": "GOOGLE_HANGOUTS"
},

Cartões

As respostas em card são enviadas ao Google Chat como mensagens em card.

Imagens

As respostas de imagem são enviadas ao Google Chat como widgets de imagem do Google Chat.

Payload personalizado

Para enviar outros tipos de mensagens do Google Chat, use um payload personalizado.

Com o payload personalizado do Google Chat, você pode criar cards mais avançados. Um card pode ter uma ou várias seções. Cada seção pode ter um cabeçalho. Confira o guia de mensagens em card para ver algumas das combinações que você pode criar com isso. No entanto, usar payloads personalizados significa que você terá que fornecer o formato JSON.

Confira um exemplo de payload personalizado para criar uma mensagem com um card:

{ "hangouts": { "hostAppDataAction": { "chatDataAction": {
  "createMessageAction": { "message": { "cardsV2": [{
    "cardId": "pizza",
    "card": {
      "header": {
        "title": "Pizza Delivery Customer Support",
        "subtitle": "pizzadelivery@example.com",
        "imageUrl": "https://goo.gl/aeDtrS"
      },
      "sections": [{ "widgets": [{ "textParagraph": {
        "text": " Your pizza is here!"
      }}]}]
    }
  }]}}
}}}}

Limitações e considerações

  • Ao usar apps do Google Chat com o Dialogflow, os objetos de evento de chat têm as seguintes limitações e considerações:
    • Eventos da página inicial do app:o suporte para eventos APP_HOME ainda não está disponível.
    • Entrada de consulta do Dialogflow:o texto enviado como entrada de consulta para o agente do Dialogflow depende do tipo de evento:
      • MESSAGE:o valor do campo argumentText da mensagem de chat.
      • APP_COMMAND:a string "APP_COMMAND_PAYLOAD".
      • ADDED_TO_SPACE:um evento de boas-vindas padrão é enviado.
      • REMOVED_FROM_SPACE:a string "REMOVED_FROM_SPACE_PAYLOAD".
      • CARD_CLICKED:a string "BUTTON_CLICKED_PAYLOAD".
      • WIDGET_UPDATED:a string "WIDGET_UPDATED_PAYLOAD" (usada para preenchimento automático).
    • Payload de evento completo:o payload JSON completo do evento de interação de chat é enviado ao Dialogflow no campo WebhookRequest.payload. Você pode acessar isso no seu webhook do Dialogflow. Para mais informações, consulte a documentação de solicitação de webhook do Dialogflow ES.
  • Considerações para responder a comandos e receber dados de cards ou caixas de diálogo:
  • Não há suporte para prévia de links.
  • Se o agente do Dialogflow responder com apenas uma mensagem, ela será enviada ao Google Chat de forma síncrona. Se o agente do Dialogflow responder com várias mensagens, todas elas serão enviadas ao Chat de forma assíncrona chamando o método create no recurso spaces.messages da API Chat uma vez para cada mensagem.
  • Ao usar a integração do Dialogflow ES com o Chat, o agente do Dialogflow e o app Chat precisam ser configurados no mesmo projeto do Google Cloud.

Resolver problemas

Para depurar seu app do Chat, comece revisando os registros de erros. Como esse app usa o Dialogflow, você tem vários recursos de geração de registros e solução de problemas disponíveis:

Limpar

Para evitar cobranças na sua conta do pelos recursos usados neste tutorial, recomendamos que você exclua o projeto na nuvem.

  1. No console de APIs do Google, acesse a página Gerenciar recursos. Clique em Menu > IAM e admin > Gerenciar recursos.

    Acessar o Resource Manager

  2. Na lista de projetos, selecione o que você quer excluir e clique em Excluir .
  3. Na caixa de diálogo, digite o ID do projeto e clique em Encerrar para excluí-lo.
  • O Dialogflow CX é outra maneira de usar o Dialogflow com um app de chat.