SDK de extensões de chamada

Os SDK de extensões de chamada permitem que os aplicativos forneçam uma opção de chamadas personalizadas para os usuários do HubSpot diretamente de um registro no CRM. 

Uma extensão de chamadas consiste em três componentes principais:

  1. O SDK de extensões de chamada, um SDK JavaScript que permite a comunicação entre seu aplicativo e o HubSpot.
  2. Os endpoints de configurações de chamada são usados para definir as configurações de chamadas para o seu aplicativo. Cada conta da HubSpot que conecta seu aplicativo usará essas configurações.
  3. O iframe de chamadas, que é onde seu aplicativo aparece para usuários do HubSpot e é configurado usando as configurações de chamada.

Para obter mais informações sobre a experiência de chamadas no aplicativo, examine este artigo da base de conhecimento. Depois que o aplicativo ativado de extensão de chamada estiver conectado ao HubSpot, ele aparecerá como uma opção no alternador de chamadas sempre que um usuário fizer uma chamada do HubSpot.

Please note: only outgoing calls are currently supported.

O SDK de extensões de chamada

O SDK de extensões de chamada é uma biblioteca JavaScript usada para comunicação entre o HubSpot e o aplicativo de chamadas, que aparecerão dentro de um iframe. Essa comunicação inclui:

  • O HubSpot informando ao seu aplicativo para qual número ligar.
  • Seu aplicativo informando ao HubSpot quando a chamada está conectada e quando ela termina.
  • O HubSpot informando ao seu aplicativo o ID de engajamento temporário que precisa ser atualizado com os detalhes da chamada.

Você pode encontrar o SDK neste repositório do GitHub com os requisitos técnicos e detalhes de uso para o SDK no seu aplicativo web.

Configuração

As extensões de chamada são configuradas como parte de um app da HubSpot. Se não tiver um aplicativo, você pode criar um da sua conta do desenvolvedor da HubSpot. Se você ainda não tiver uma conta de desenvolvedor da HubSpot, faça login aqui.

Depois de definir as configurações de chamadas para o seu aplicativo, o que é uma tarefa única, essas configurações serão aplicadas a todos os usuários que conectarem o aplicativo à sua conta da HubSpot. Analise a guia Endpoints para obter detalhes sobre como criar essas configurações.

Depois que suas configurações de chamada estiverem prontas, os usuários precisarão passar pelo processo de conexão do aplicativo para disponibilizar o serviço de chamada na conta deles no HubSpot. 

O processo de chamada

As chamadas feitas com extensões de chamada passam pelas seguintes etapas:

  1. O usuário clica no ícone Chamada em um registro de CRM.
  2. O usuário seleciona seu aplicativo como provedor de chamada e clica no botão Chamada do navegador.
  3. Uma iframe abre para o URL especificado nas configurações de chamada no seu aplicativo.
  4. A chamada é concluída pelo seu aplicativo (exibido no iframe).
  5. O HubSpot cria um engajamento temporário e envia o ID desse engajamento para o seu aplicativo pelo SDK de extensões de chamada.
  6. Seu aplicativo atualiza o engajamento temporário com os detalhes completos da chamada.

Depois que um usuário conecta seu aplicativo ao HubSpot, ele aparecerá como uma opção adicional ao fazer chamada de um registro. Quando os usuários clicarem no ícone Chamada, a opção de fazer a chamada com seu aplicativo em vez do sistema de chamada padrão do HubSpot aparecerá. 

Saiba mais sobre fazer chamadas do HubSpot

calling_provider

Quando o usuário escolher fazer a chamada pelo navegador, um iframe abre para o URL especificado nas configurações de chamada no seu aplicativo. Este URL deve apontar para um aplicativo web personalizado que fará a chamada por meio do seu serviço de chamadas. Usando o SDK de extensões de chamada, seu aplicativo se comunicará com o app da HubSpot. As mensagens do app da HubSpot permitem que seu aplicativo saiba para qual número a ligar, e ele poderá enviar mensagens para eventos, como a término da chamada ou desconexão do usuário do seu serviço.

calling_iframe

Ao criar seu aplicativo, há algumas considerações:

  • Você precisará ter um aplicativo web que pode ser exibido dentro de um iframe, porque o HubSpot não processará nenhum conteúdo do iframe. Assim, você não pode definir o URL de iframe para um serviço de SIP de backend.
  • Os parâmetros de altura e largura definidos pelas configurações da API determinarão o tamanho do iframe. Janelas com altura de 600px e largura de 400px funcionam melhor para a faixa maior de tamanhos de janela de navegador, incluindo telas menores.
  • Você deve garantir que as condições de erro apareçam dentro do iframe. Assim, seu aplicativo poderá alertar os usuários sobre problemas de áudio, de rede e outros.

Testes

Durante o processo de criação do seu aplicativo, você pode definir manualmente o URL do iframe para seu navegador ao definir o valor localStorage. Isso permitirá definir um URL de localhost para testes locais.

Para definir o valor, abra as ferramentas de desenvolvedor do seu navegador e execute o seguinte comando JavaScript no console:

localStorage.setItem('LocalSettings:Sales:CallingExtensions', '{"name": "Example Calling app Title", "url": "https://myWidgetUrl/path/"}')

O valor name aparecerá no cabeçalho do widget de chamada, e o url será o URL usado no iframe. Quando esse item é definido, o nome definido aparecerá como uma opção para o provedor de chamadas ao clicar no ícone Chamada, e o widget de chamada usará o iframe url definido.

Registrar a chamada no HubSpot

No HubSpot, as chamadas são registradas como objetos de engajamento. Esses engajamentos são usados para exibir os detalhes da chamada na linha do tempo do objeto de CRM associado. Eles também são usados para relatórios de vendas integrados do HubSpot.

Quando uma chamada é feita pelo seu aplicativo, o HubSpot criará automaticamente o objeto de engajamento básico e enviará o ID desse engajamento ao seu aplicativo pelo SDK de extensões de chamada. O ID será passado para o seu aplicativo usando a função onEngagementCreated. O HubSpot definirá os detalhes básicos do engajamento, inclusive o proprietário, o tipo e as associações. Você precisará atualizar os detalhes na metadada do registro de engajamento para definir a duração da chamada, bem como qualquer observação para a chamada no campo body  Se houver uma gravação da chamada, você também pode definir recordingUrl, que permitirá que os usuários do HubSpot reproduzam a gravação ao visualizar o registro do contato no HubSpot.

Confira mais detalhes sobre como atualizar engajamentos na documentação de engajamentos do CRM.

Por exemplo:

// { "engagement": { "timestamp": 1561953600000 // A millisecond timestamp of the time of the call. This will default to the time that the call was initiated, but can be updated if needed. }, "metadata": { // Details for the call "toNumber": "+1 (888) 482-7768", // The number that was called. Displayed as a string, with no further formatting. "durationMilliseconds": 38000, // The length of the call in milliseconds. "recordingUrl": "https://app.example.com/Recordings/callrecordpath", // A path to a recording of the call "body": "Call notes" // Details about the call, displayed as the description } }

Os detalhes acima resultam em um engajamento que se parece com a imagem abaixo quando visualizado no HubSpot:

calling-sdk-engagement

Analise os engajamentos do CRM para obter mais detalhes sobre como trabalhar com engajamentos.


Was this article helpful? *
This form is used for documentation feedback only. Learn how to get help with HubSpot...