Integrar o Twilio Flex com as informações de conversação do Dynamics 365 (pré-visualização)

[Este artigo é uma documentação de pré-lançamento e está sujeito a alterações.]

Esta integração permite que os vendedores façam e recebam chamadas do Twilio Flex a partir do Dynamics 365 e obter transcrições em tempo real durante a chamada e informações de chamadas geradas por IA após a chamada.

Pré-requisitos

• Uma conta Twilio

• Uma conta Twilio Flex — consulte esta ligação para obter mais informações sobre como configurar uma conta Flex

• Um ambiente do Microsoft Dynamics 365 Sales com a licença Sales Premium ou Sales Enterprise, juntamente com privilégios de administrador de sistema

• Informações de Conversação instalado e configurado — Mais informações

• Estrutura de Integração de Canais do Dynamics 365 1.0 instalado. Mais informações

• Um ambiente Node JS local configurado

• A aplicação create-flex-plugin

Passo 1: Configurar Twilio Flex como um fornecedor de canais

Na Estrutura de Integração de Canais do Dynamics 365, crie um fornecedor de canais para Twilio Flex. Consulte a captura de ecrã abaixo como exemplo:

Introduza os seguintes valores::

• URL do Canal:https://flex.twilio.com/agent-desktop

• Ativar Comunicação de Saída: Sim

• Versão da API: 1.0

• Ordem do canal: 1

• Domínio Fidedigno:https://flex.twilio.com/

• Selecionar Aplicações da Interface Unificada para o Canal: Hub de Vendas (ou qualquer outra aplicação para a quais gostaria que a integração fosse ativada)

• Selecionar os direitos de acesso para o canal: adicione as funções que utilizariam o Twilio Flex. Por exemplo, Representante de Vendas, Gestor de Vendas, entre outros. Para incorporar o Twilio Flex como um iFrame no Dynamics 365, adicione o URL da organização do Dynamics 365 à lista de URLs Permitidos. Para mais informações, consulte este artigo.

Passo 2: Instalar o conector SIPREC e encaminhe as chamadas para o Dynamics 365

1. Instale o suplemento do conector SIPREC.

2. Abra as definições do centro de administração do Twilio e configure-as para que a multimédia seja bifurcada para o gravador do Dynamics 365, como ilustrado na captura de ecrã seguinte:

   

   Os campos seguintes são importantes:

   • Nome exclusivo: especifique um nome e anote-o. Terá de o utilizar nos próximos passos

   • Servidor de Gravação de Sessão: especifique o URL do servidor de gravação de multimédia do Dynamics 365. Para uma lista de gravadores e regiões suportados, consulte Pontos finais e regiões de gravador suportados.

     • Se pretender bifurcar a multimédia para o gravador mais próximo, utilize o seguinte URL: sip:SRS@media.recording.dynamics.com:5061;secure=true

     • Os campos de credenciais podem permanecer vazios. A autenticação é feita com certificado na configuração TLS entre o Twilio e o Dynamics.

Passo 3: Configurar o fluxo de chamadas para bifurcar a multimédia para o Dynamics 365

1. Navegue para a secção Fluxos do Estúdio na Consola e selecione Fluxo IVR de Voz.

2. No lado direito, na secção Voz na biblioteca de widgets, adicione o widget Bifurcar Fluxo:

   

3. Agora, configure o widget para bifurcar o fluxo utilizando o conector SIPREC que definiu anteriormente:

   

4. Introduza os seguintes valores:

   - Ação de Fluxo: Iniciar

   • Tipo de Fluxo: Siprec
   • Nome do Conector: o nome que deu ao conector SIPREC. No nosso exemplo, é SipRec1.
   • Faixas: Ambas as Faixas
   • Parâmetros de fluxo:

     • Função: de entrada (No nosso exemplo, vamos gravar chamadas de entrada)

     • CallerDisplayName: {{trigger.call.From}}

     • CalleeDisplayName: {{trigger.call.To}}

5. No separador Transições, configure a Bifurcação de Fluxo para que ocorra antes de a chamada ser enviada ao agente:

   

6. Guarde o fluxo e publique.

Passo 4: Configurar um número de telefone do Twilio

Tem de apontar um número de telefone do Twilio para o recém-criado Fluxo do Estúdio.

1. Selecione um número que detenha — ou compre um novo número — a partir da consola Números de Telefone do Twilio.

2. Abra o número de telefone selecionando-o e, em seguida, desloque-se para baixo até à secção Voz na página.

3. Selecione o fluxo que tinha definido anteriormente nos campos A Chamada Entra, conforme ilustrado na seguinte captura de ecrã:

   

Passo 5: Configurar o Dynamics 365 para a integração

Vamos configurar o Twilio como um fornecedor de chamadas e configurar uma política de gravação para definir quem pode gravar chamadas e outras informações utilizadas para informações de conversação.

1. Na aplicação Hub de Vendas, aceda a Alterar área e selecione Definições do Sales Insights.

2. Selecione Informações de Conversação.

   

3. Selecione Twilio na secção Fornecedores de chamadas e especifique o SID da conta Twilio.

4. Guarde as alterações.

5. Configurar uma política de gravação utilizando o fornecedor de chamadas Twilio.

   1. Selecione Criar um política de gravação e configure a política. Mais informações.

   2. Selecione Criar e, em seguida, publique as definições.

Passo 6: Preparar o plug-in Flex para integrar a experiência em tempo real

O Flex é projeto do React e as personalizações que efetuar à IU são criadas como componentes de plug-in.

A preparação de um ambiente Node e a configuração de um plug-in Flex vazio estão fora do âmbito desta documentação. Consulte a documentação do Twilio para um tutorial passo a passo sobre a criação do seu primeiro plug-in Flex.

Crie um plug-in novo que esteja pronto para adicionar o código de personalização para o Dynamics.

Neste momento, o ficheiro plugin JS deverá ter este aspeto:

Adicione a biblioteca de Cliente Microsoft CIF ao seu plug-in. A biblioteca de cliente tem de ser carregada de forma assíncrona quando o Flex é iniciado, por isso, adicione o seguinte código à função init do Flex.

import React from 'react';
import \* as Flex from '@twilio/flex-ui';
import { FlexPlugin } from '@twilio/flex-plugin';
import reducers, { namespace } from './states';
const PLUGIN\_NAME = 'SamplePlugin';
export interface CallStartedEvent {
  callId: string;
  startTime: Date;
  isIncomingCall: boolean;
  contactNumber: string;
  contactName: string;
}

export interface CallEndedEvent {
  callId: string;
  callDurationInSeconds: number;
  callTerminationReason: string; // \['success', 'error'\]
  callEndTime: Date;
  isCallStarted: boolean;
}

export default class SamplePlugin extends FlexPlugin {
  constructor() {
    super(PLUGIN\_NAME);
  }
  /\*\*
   \* This code is run when your plugin is being started
   \* Use this to modify any UI components or attach to the actions framework
   \*
   \* @param flex { typeof Flex }
   \* @param manager { Flex.Manager }
   \*/
  async init(flex: typeof Flex, manager: Flex.Manager): Promise<void> {
    this.registerReducers(manager);
    this.loadCIF();
    flex.Actions.addListener('afterAcceptTask', (payload) => {
      const callStartedEvent : CallStartedEvent = {
        callId: payload.task.\_task.attributes.call\_sid,
        startTime: new Date(),
        isIncomingCall: true,
        contactName: payload.task.\_task.attributes.caller,
        contactNumber: payload.task.\_task.attributes.caller
      };
      // @ts-ignore
      Microsoft.CIFramework.raiseEvent('WIDGET\_CALL\_STARTED', callStartedEvent);
    });

    flex.Actions.addListener('afterCompleteTask', (payload) => {
      // @ts-ignore
      Microsoft.CIFramework.raiseEvent('WIDGET\_CALL\_ENDED', {
        callId: payload.task.\_task.attributes.call\_sid,
        callTerminationReason: 'success',
        callEndTime: new Date(),
        isCallStarted: true
      });
      const callEndedEvent : CallEndedEvent = {
        callId: payload.task.\_task.attributes.call\_sid,
        callEndTime: new Date(),
        callTerminationReason: 'success',
        isCallStarted: true
      };
 

      // @ts-ignore
      Microsoft.CIFramework.raiseEvent('WIDGET\_CALL\_ENDED', callEndedEvent);
    });

    const options: Flex.ContentFragmentProps = { sortOrder: -1 };
    flex.AgentDesktopView.Panel1.Content.add(<div key="SamplePlugin-component" >Hello Partner!</div>, options);
  }

  loadCIF = () => {
    const script = document.createElement("script");
    script.src = \`${window.location.ancestorOrigins\[0\]}/webresources/Widget/msdyn\_ciLibrary.js\`;
    script.setAttribute('data-crmurl', window.location.ancestorOrigins\[0\]);
    script.setAttribute('data-cifid', 'CIFMainLibrary');
    document.body.appendChild(script);
  }

  /\*\*

   \* Registers the plugin reducers
   \*
   \* @param manager { Flex.Manager }
   \*/
  private registerReducers(manager: Flex.Manager) {
    if (!manager.store.addReducer) {
      // eslint-disable-next-line
      console.error(\`You need FlexUI > 1.9.0 to use built-in redux; you are currently on ${Flex.VERSION}\`);
      return;
    }
    manager.store.addReducer(namespace, reducers);
  }
}

Publicar o plug-in.
Temos agora um plug-in Flex que está pronto para ser testado!

Passo 7: Testar a integração das informações de conversação do Dynamics 365 e do Flex

Inicie sessão na aplicação Hub de Vendas, selecione o ícone de Chamada. Verá o Twilio Flex incorporado no painel direito.

Certifique-se de que define o seu estado como Disponível no Twilio e que efetua uma chamada para o Número de Telefone do Twilio que configurou no Passo 4: Configurar um número de telefone do Twilio.

Depois de atender a chamada e iniciar a gravação, navegue para o separador Transcrição para ver a transcrição em tempo real e, em seguida, veja as informações de chamadas na página Resumo da Chamada após o fim da chamada.

Informações relacionadas

Ver e compreender a página de resumo da chamada