Carregando um tópico de conversa existente

Editar online

Este tutorial explica como retomar uma conversa anterior no chat incorporado usando um ID de tópico. Isso permite que os usuários continuem suas conversas de onde pararam, em vez de terem que iniciar um novo chat a cada vez.

Por padrão, o chat incorporado cria um novo tópico de conversa sempre que é aberto ou atualizado. Esse loadThreadById() método permite restaurar o histórico de bate-papo e manter a continuidade da conversa.

Como funciona o carregamento de threads

O processo de carregamento do thread segue estas etapas:

  1. O chat é iniciado.
  2. O loadThreadById() método é chamado com um ID de thread.
  3. O chat incorporado carrega o histórico de conversas correspondente.
  4. O usuário pode continuar interagindo na mesma conversa.

Se nenhum ID de tópico for fornecido, o chat abre um novo tópico de conversa quando o usuário enviar sua primeira mensagem.

Passo 1: Obter o ID do tópico

Os IDs dos tópicos estão disponíveis através do sistema de eventos do chat. Você pode capturá-los a partir dos send eventos pre:send ou e armazená-los para uso posterior.

O trecho de código a seguir captura o ID da thread quando uma mensagem é enviada e o armazena no armazenamento local:

// Capture thread ID from send event
instance.on('send', (event) => {
    const threadId = event.message.thread_id;
    console.log('Current thread:', threadId);
    
    // Store thread ID for later use (e.g., in localStorage)
    localStorage.setItem('chatThreadId', threadId);
});

Passo 2: Carregar um tópico existente

Use o loadThreadById() método para carregar uma conversa salva anteriormente. O trecho de código a seguir recupera um ID de thread armazenado e carrega a conversa associada:



  // Retrieve stored thread ID
  const savedThreadId = localStorage.getItem('chatThreadId');

  if (savedThreadId) {
    chatInstance.loadThreadById(savedThreadId);
  }

Roteiro completo

Use o script a seguir para aplicar o código deste tutorial ao seu widget de bate-papo:


      window.wxOConfiguration = {
        orchestrationID: "your-orgID_orchestrationID",
        hostURL: "https://dl.watson-orchestrate.ibm.com",
        rootElementID: "root",
        showLauncher: false,
        deploymentPlatform: "ibmcloud", // Required for IBM Cloud
        crn: "your-org-crn", // Required for IBM Cloud. Learn how to get the CRN in https://cloud.ibm.com/docs/key-protect?topic=key-protect-retrieve-instance-ID&interface=ui
        chatOptions: {
          agentId: "your-agent-id",
          agentEnvironmentId: "your-agent-env-id"
      onLoad: onChatLoad
        }
      };
      setTimeout(function () {
          const script = document.createElement('script');
          script.src = `${window.wxOConfiguration.hostURL}/wxochat/wxoLoader.js?embed=true`;
          script.addEventListener('load', function () {
              wxoLoader.init();
          });
          document.head.appendChild(script);
      }, 0);
    
      function onChatLoad(instance) {
    
        const chatInstance = instance;
    
        // Retrieve stored thread ID
        const savedThreadId = localStorage.getItem('chatThreadId');
    
        if (savedThreadId) {
          chatInstance.loadThreadById(savedThreadId);
        }
    
        // Capture and store thread ID when messages are sent
        chatInstance.on("send", (event) => {
          const threadId = event.message.thread_id;
          console.log("Current thread:", threadId);
        });
      };