JavaScript do Dialogflow Messenger

O Dialogflow Messenger oferece funções que podem ser chamadas para afetar o comportamento dele.

renderCustomText

Essa função renderiza uma mensagem de texto simples, como se ela viesse do agente como uma resposta de texto simples ou se tivesse sido inserida pelo usuário final.

Argumentos:

  • string: mensagem de texto
  • boolean: verdadeiro para uma mensagem do agente, falso para um usuário final

Retorno:

  • void

Exemplo:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.renderCustomText('Custom text', true);

renderCustomCard

Essa função renderiza um cartão personalizado, como se ele viesse do fulfillment do Dialogflow.

Argumentos:

  • payload: uma lista de respostas de payload personalizadas, definidas na seção Fulfillment.

Retorno:

  • void

Exemplo:

const dfMessenger = document.querySelector('df-messenger');
const payload = [
  {
    "type": "info",
    "title": "Info item title",
    "subtitle": "Info item subtitle",
    "image": {
      "rawUrl": "https://example.com/images/logo.png"
    },
    "anchor": {
      "href": "https://example.com",
      "target": "_blank"
    }
  }
];
dfMessenger.renderCustomCard(payload);

sendQuery

Ela envia uma consulta para a API Dialogflow e aguarda a resposta. Isso simula efetivamente uma entrada do usuário final que normalmente é fornecida à caixa de diálogo do agente. A resposta será tratada como qualquer consulta de usuário final.

Argumentos:

  • string: consulta de texto

Retorno:

  • Promise<void>: o valor de retorno da operação assíncrona.

Exemplo:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.sendQuery('Describe shipping costs.');

sendRequest

Ela envia uma solicitação para a API Dialogflow e aguarda a resposta.

Argumentos:

  • string: tipo de solicitação, compatível com query (consulte também sendQuery acima) e event (consulte evento personalizado)
  • any: payload que corresponde ao tipo de solicitação, que atualmente é uma string para os dois tipos de solicitação compatíveis

Retorno:

  • Promise<void>: o valor de retorno da operação assíncrona.

Exemplo:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.sendRequest('query', 'Describe shipping costs.');

setQueryParameters

Esta função define valores padrão para o campo queryParams da solicitação detectIntent da API Dialogflow. Outros métodos do Dialogflow Messenger podem substituir os respectivos valores padrão nos parâmetros de consulta.

Argumentos:

  • object: dados JSON. Para o esquema de parâmetros de consulta, consulte QueryParameters

Retorno:

  • void

Exemplo:

const dfMessenger = document.querySelector('df-messenger');
const queryParameters = {
  parameters: {
  timeZone: "America/New_York"
  }
};
dfMessenger.setQueryParameters(queryParameters);

setContext

Ela envia informações de personalização generativa para o usuário final para o Dialogflow. Essas informações são mantidas pelo restante da sessão.

Argumentos:

  • object: dados JSON (consulte a documentação da personalização generativa).

Retorno:

  • void

Exemplo:

const dfMessenger = document.querySelector('df-messenger');
const metadata = {
  "subscription plan": "Business Premium Plus",
  "devices owned": [
    {
      model: "Google Pixel 7",
    },
    {
      model: "Google Pixel Tablet",
    },
  ],
};
dfMessenger.setContext(metadata);

clearStorage

Essa função limpa o armazenamento permanente da caixa de diálogo do agente. Isso também limpa o estado atual da caixa de diálogo do agente.

Argumentos:

  • nenhum

Retorno:

  • void

Exemplo:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.clearStorage();

clearAuthentication

Essa função limpa a autenticação da caixa de diálogo do agente.

Argumentos:

  • nenhum

Retorno:

  • void

Exemplo:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.clearAuthentication();

startNewSession

Essa função inicia uma nova sessão na caixa de diálogo do agente. Ele pode manter ou redefinir o histórico de mensagens atual. Ela não limpa a autenticação dos usuários.

Argumentos:

Nome Tipo Descrição
args object? Argumento opcional para configurar a criação da nova sessão.
args.retainHistory boolean? Sinalização opcional para reter o histórico. Se for definido como verdadeiro, o histórico será mantido. Caso contrário, ele será apagado.

Retorno:

  • void

Exemplo:

const dfMessenger = document.querySelector('df-messenger');
dfMessenger.startNewSession({ retainHistory: true });

openChat

Essa função abre o chat. Chame-o no elemento df-messenger-chat-bubble para abrir o chat. Não faz nada se o chat já estiver aberto.

Argumentos:

  • nenhum

Retorno:

  • void

Por exemplo:

const dfMessengerBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerBubble.openChat();

closeChat

Essa função fecha o chat. Chame-o no elemento df-messenger-chat-bubble para fechar o chat. Não faz nada se o chat já estiver fechado.

Argumentos:

  • nenhum

Retorno:

  • void

Por exemplo:

const dfMessengerBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerBubble.closeChat();

openMinChat

Chat minimizado do Dialogflow Messenger

Essa função abre a janela de chat em uma versão minimizada. Chame-o no elemento df-messenger-chat-bubble para abrir o chat minimizado. Não faz nada se o chat já estiver minimizado.

Argumentos:

Nome Tipo Descrição
args objeto? Argumento opcional para configurar o chat minimizado
args.anchor string? anchor opcional para configurar onde o chat minimizado está sendo aberto. Mesma lógica que o atributo anchor no elemento de balão do chat. O padrão é left-top.
args.showActorImages boolean? Sinalização opcional para mostrar imagens do ator (se especificada no elemento df-messenger-chat-bubble). O padrão é "false".

Exemplo:

const dfMessengerChatBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerChatBubble.openMinChat({
  anchor: 'top-left'
});

closeMinChat

Fecha a conversa minimizada. Chame-o no elemento df-messenger-chat-bubble para fechar o chat minimizado. Não faz nada se o chat já estiver fechado.

Exemplo:

const dfMessengerChatBubble = document.querySelector('df-messenger-chat-bubble');
dfMessengerChatBubble.closeMinChat();