Integrazione vocale di Salesforce con Twilio Flex

Architettura per l'integrazione di Agent Assist e Twilio Flex con
Salesforce

Questa integrazione vocale utilizza l'integrazione Twilio Open CTI per portare un call center Twilio Flex nella tua istanza Salesforce.

Agent Assist utilizza lo stream multimediale della chiamata Twilio Flex per fornire suggerimenti agli agenti nella console di servizio Salesforce Lightning.

Prima di iniziare

Per integrare i moduli dell'interfaccia utente di Assistente agente con Salesforce, devi accedere alle seguenti risorse:

Node.js

Segui le istruzioni di installazione consigliate per il tuo sistema operativo.
Salesforce CLI

Segui le istruzioni di installazione consigliate per il tuo sistema operativo.
Google Cloud CLI

Installa il comando gcloud come indicato e autenticati utilizzando gcloud auth login.
Salesforce

Accedi all'URL dell'istanza o alla pagina di accesso a Salesforce e prendi nota di quanto segue:
- L'URL Il mio dominio di Salesforce. Per trovare l'URL del mio dominio, segui questi passaggi:
  1. Vai alla barra dei menu > menu Configurazione.
  2. Fai clic su Configurazione.
  3. Nella casella Ricerca rapida, inserisci Il mio dominio. Il nome di dominio è nel seguente formato: MY-DOMAIN-NAME.develop.my.salesforce.com.
- L'ID organizzazione Salesforce. Segui questi passaggi per trovare l'ID dell'organizzazione:
  1. Vai alla barra dei menu > menu Configurazione.
  2. Fai clic su Configurazione.
  3. Nella casella Ricerca rapida, inserisci Informazioni azienda. Nota: Questi passaggi di integrazione sono stati testati solo con Salesforce Developer Edition. Se utilizzi un'altra edizione, potrebbero verificarsi differenze nelle licenze delle funzionalità e nell'interfaccia di Salesforce.
Backend di integrazione di Agent Assist
1. Segui le istruzioni per configurare l'integrazione.
2. Prima di eseguire lo script di deployment, configura le seguenti variabili di ambiente con deploy.sh o in un file .env nella radice del progetto:
  - AUTH_OPTION: imposta questo valore su SalesforceLWC.
  - SALESFORCE_DOMAIN: un nome di dominio simile a YOUR_SUBDOMAIN.develop.lightning.force.com. Hai annotato questo valore nel prerequisito di Salesforce. Tieni presente che non devi includere https://.
  - SALESFORCE_ORGANIZATION_ID: hai annotato questo valore nel prerequisito di Salesforce.
  - APP_AUTH_OPTION: imposta questo valore su Twilio.
  - TWILIO_ACCOUNT_SID: impostalo sul tuo SID account Twilio.

Passaggio 1: configura Twilio Flex

Twilio Flex funge da softphone in questa integrazione. Puoi accedere alla console Twilio per configurare un account Flex. Visita la pagina di configurazione di Twilio per istruzioni dettagliate su come creare un account Flex.

Installare il componente aggiuntivo del connettore SIPREC

Il componente aggiuntivo connettore SIPREC consente al tuo account Twilio Flex di creare fork SIPREC dei flussi multimediali delle chiamate vocali per Agent Assist. Segui questi passaggi per installare il componente aggiuntivo del connettore SIPREC.

Vai a Twilio Home > Marketplace > Catalogo > Twilio > Siprec Connector.
Fai clic su Installa > la casella di controllo Accettazione di termini e condizioni > Installa.
Nella scheda Configura, configura il plug-in con i seguenti dettagli:
- Nome univoco: SipRec1
- Session Recording Server:
```
sip:+<GTP-provisioned-phone-number>@216.239.36.145:5672;transport=tls;secure=true;edge=umatilla
```
- Per ulteriori dettagli sul provisioning di un numero GTP, consulta la documentazione sull'integrazione della telefonia. Puoi ignorare i passaggi di configurazione e convalida dell'SBC perché sono completi per il connettore Twilio Siprec.
Vai a Home di Twilio > Funzioni e asset.
- Se Funzioni e asset non è visibile nella barra laterale, bloccalo da Esplora prodotti.
Fai clic su Crea servizio.
Assegna al nuovo servizio il nome ui-connector-auth.
Nell'editor visualizzato, fai clic su Aggiungi + > Aggiungi funzione.
Assegna alla funzione il nome conversation-name.
Fai clic su e imposta la visibilità della funzione su Pubblico.
Copia e incolla l'intero contenuto di ui-connector-auth.js dal repository GitHub nell'editor.
Fai clic su Salva.
Fai clic su Esegui il deployment di tutto.

Configura l'IVR con Flex Studio

La IVR consiste nel configurare un flusso di chiamate programmatico con Twilio Studio per eseguire il fork SIPREC dello stream multimediale in Agent Assist. Invia anche un post HTTP per condividere il numero di telefono e l'ID conversazione con Agent Assist. Segui questi passaggi per configurare la IVR con Flex Studio.

Vai alla console Twilio.
Fai clic su Sviluppa > Numeri di telefono > Gestisci > Numeri attivi. Nella tabella deve essere presente una riga con il numero Twilio predefinito di cui è stato eseguito il provisioning per il tuo account Flex.
Nella sezione Voice - Studio Workflow, fai clic su Voice IVR.
Trascina un widget Esegui richiesta HTTP nel flusso.
Scollega Incoming Call dall'input del widget SendCallToAgent.
Collega Chiamata in arrivo all'input del widget Fai richiesta HTTP.
Configura il widget Invia richiesta HTTP con i seguenti dettagli:
- Nome widget: register_twilio
- Metodo di richiesta: POST
- URL richiesta: <your-ui-connector-cloud-run-url>.run.app/register-app
- Tipo di contenuti: application/json
- Corpo della richiesta:
```
{
"accountSid": "<yourTwilioAccountSid>",
"authToken": "<yourTwilioAccountAuthToken>"
}
```
Trascina un widget Esegui funzione nel flusso.
Collega gli output Success e Fail del widget register_twilio all'input del widget Run Function.
Crea un widget con i seguenti dettagli:
- Nome widget: conversation_name
- Servizio: ui-connector-auth
- Ambiente: ui
- Funzione: conversation-name
- Parametri della funzione:
  - token:
```
{{ widgets.register_twilio.parsed.token }}
```
  - endpoint: <your-ui-connector-cloud-run-url>.run.app/conversation-name
  - phone:
```
{{ trigger.call.From | replace_first:'+','' }}
```
  - conversationName:
```
projects/<project>/locations/<location>/conversations/TW-{{ trigger.call.From | replace_first:'+','' }}-{{ trigger.call.CallSid }}
```
Trascina un widget Fork Stream dalla barra laterale nel flusso.
Collega gli output Success and Fail del widget Make HTTP Request all'input del widget Fork Stream.
Collega il nodo Avanti del widget Biforca flusso al widget SendCallToAgent.
Configura il widget Biforca flusso nel modo seguente:
- Azione di streaming: avvia
- Stream Type (Tipo di stream): Siprec
- Nome connettore: Siprec1
- Tracce: sia le tracce
- Parametri dello stream:
  - Chiave: conversation
  - Valore:
```
projects/<gcp-project-id>/conversations/TW-{{trigger.call.From | replace_first:'+','' }}-{{trigger.call.CallSid}}
```
Fai clic su Salva > Pubblica.

Dettagli account

Segui questo passaggio per raccogliere i dettagli del tuo account Twilio Flex. Queste informazioni ti serviranno in un secondo momento per configurare Flex CTI in Salesforce.

Vai a Twilio Home > Dashboard account e annota le seguenti informazioni:
- SID account
- Il mio numero di telefono Twilio

Passaggio 2: configura il progetto di sviluppo Salesforce

Per iniziare a integrare i moduli dell'interfaccia utente di Agent Assist, segui questi passaggi.

Esegui il seguente codice per clonare il repository di integrazione di Agent Assist e aprire il tuo progetto:
```
git clone https://github.com/GoogleCloudPlatform/agent-assist-integrations
cd salesforce/aa-lwc
```
Esegui questi comandi per scaricare i file JavaScript dei moduli UI che deployerai in un secondo momento come risorse statiche. Salesforce richiede risorse statiche per caricare JavaScript di terze parti.
```
npm run generate-static-resources
npm install
```

Passaggio 3: configura l'ambiente Salesforce

Puoi integrare i moduli dell'interfaccia utente di Agent Assist in un ambiente specifico, ad esempio produzione o sviluppo. Salesforce chiama questi ambienti organizzazioni (org).

Configurare l'organizzazione con la CLI di Salesforce

Segui questi passaggi per utilizzare la CLI di Salesforce per configurare l'organizzazione per l'integrazione di Agent Assist.

Esegui il seguente codice e autentica la CLI utilizzando le credenziali di accesso a Salesforce che utilizzi normalmente.
```
npm run login
```
Esegui il seguente codice per eseguire il deployment del componente LWC nell'organizzazione.
```
npm run deploy
```

Passaggio 4: crea un'app client esterna

LWC di Salesforce utilizza il flusso delle credenziali client OAuth 2.0 per autenticarti. Un'app client esterna abilita il flusso delle credenziali client. Utilizza la chiave consumer e il secret consumer dell'app per configurare il componente web Lightning di Salesforce per autenticare gli utenti con Salesforce.

Vai alla barra dei menu > menu Configurazione, poi fai clic su Configurazione. Nella casella Ricerca rapida, inserisci Gestione app client esterna.
1. Fai clic su External Client App Manager > New External Client App > Create, poi inserisci le seguenti informazioni.
  - Nome dell'app client esterna: lwc auth
  - Nome API: lwc_auth
  - Email di contatto: your_email@example.com
  - API (Enable OAuth Settings) (API (Abilita impostazioni OAuth)) > Enable OAuth (Abilita OAuth): selezionato
  - API (Enable OAuth Settings) > Callback URL: https://login.salesforce.com/services/oauth2/callback
  - API (Enable OAuth Settings) (API (Abilita impostazioni OAuth)) > Selected OAuth Scopes (Ambiti OAuth selezionati): accedi al servizio URL identità
  - API (Enable OAuth Settings) > Enable Client Credentials Flow (API (Abilita impostazioni OAuth) > Abilita flusso credenziali client): Selezionato
2. Fai clic su Crea.
Vai alla barra dei menu > menu Configurazione, poi fai clic su Configurazione. Nella casella Ricerca rapida, inserisci Gestione app client esterna.
1. Fai clic sul nome dell'app client esterna > Modifica.
2. Vai a OAuth Policies (Norme OAuth) > OAuth Flows and External Client App Enhancements (Miglioramenti dei flussi OAuth e dell'app client esterno).
3. Assicurati che l'opzione Abilita flusso credenziali client sia selezionata.
4. In Esegui come, inserisci il tuo nome utente di accesso.
5. Fai clic su Salva.
Vai alla barra dei menu > menu Configurazione, poi fai clic su Configurazione. Nella casella Ricerca rapida, inserisci Gestione app client esterna.
1. Fai clic sul nome dell'app client esterna > Modifica.
2. Vai a OAuth Settings (Impostazioni OAuth) > App Settings (Impostazioni app) > Consumer Key and Secret (Chiave e segreto del consumatore).
3. Inserisci il codice di verifica inviato al tuo indirizzo email.
4. Copia la chiave utente e il secret consumer in un luogo sicuro. Ti serviranno per un passaggio successivo.

Stabilisci policy di condivisione delle risorse tra origini (CORS) e di sicurezza dei contenuti

Vai alla barra dei menu > menu Configurazione, poi fai clic su Configurazione.
Nella casella Ricerca rapida, inserisci CORS, quindi fai clic su Modifica.
1. Seleziona Attiva CORS per gli endpoint OAuth.
2. Fai clic su Salva.
Vai alla barra dei menu > menu Configurazione, poi fai clic su Configurazione.
Nella casella Ricerca rapida, inserisci URL attendibili, quindi fai clic su Nuovo URL attendibile.
Inserisci le seguenti informazioni:
- Nome API: ui_connector
- URL: inserisci l'URL dell'endpoint del servizio Cloud Run del connettore UI che hai deployment con il backend dell'integrazione di Agent Assist. Puoi trovare questo URL nella console Cloud Run. Ad esempio: https://UI_CONNECTOR_SUBDOMAIN.GCP_REGION.run.app.
- Direttive CSP: seleziona tutte le caselle di controllo.
- Fai clic su Salva e nuovo.
Inserisci le seguenti informazioni:
- Nome API: ui_connector_wss
- URL: inserisci l'URL dell'endpoint del servizio Cloud Run del connettore UI che hai implementato con il backend dell'integrazione di Agent Assist. Puoi trovare questo URL nella console Cloud Run. Modifica il protocollo in wss per il traffico WebSocket. Ad esempio: wss://UI_CONNECTOR_SUBDOMAIN.GCP_REGION.run.app.
- Direttive CSP: seleziona tutte le caselle di controllo.
- Fai clic su Salva e nuovo.
Inserisci le seguenti informazioni:
- Nome API: salesforce_domain
- URL: inserisci l'URL del tuo dominio Salesforce nel seguente formato: https://YOUR_SUBDOMAIN.my.salesforce.com.
- Direttive CSP: seleziona tutte le caselle di controllo.
- Fai clic su Salva e nuovo.
Inserisci le seguenti informazioni:
- Nome API: twilio_flex
- URL: https://flex.twilio.com
- Direttive CSP: seleziona tutte le caselle di controllo.
- Fai clic su Salva.

Passaggio 5: installa il plug-in CTI di Twilio Flex

Salesforce fornisce Salesforce Open CTI per consentire l'integrazione di softphone di terze parti con la tua istanza Salesforce.

Twilio Flex CTI utilizza Salesforce Open CTI per consentirti di utilizzare Flex direttamente all'interno della tua istanza Salesforce. Segui le istruzioni di Twilio per configurare Twilio Flex CTI nella tua istanza Salesforce.

Passaggio 6: installa il componente web Lightning di Salesforce

Segui questi passaggi per utilizzare l'editor Lightning Experience per aggiungere il componente web Lightning di Salesforce alla pagina dei contatti in cui si apre Twilio Flex CTI quando arriva una nuova chiamata.

Vai alla console del servizio e seleziona Contatti.
Seleziona un record di contatto.
Fai clic sul menu Configurazione > Modifica pagina.
Fai clic su Modello > Modifica.
1. Seleziona Intestazione e Due regioni uguali.
2. Fai clic su Avanti.
3. Mappa ogni regione su una nuova regione.
4. Fai clic su Fine.
Dalla barra laterale Componenti, sposta agentAssistContainerModule nella barra laterale. Nota: questo componente è stato fornito dal comando npm deploy.
Fai clic sul componente inserito nel passaggio precedente e compila i campi del modulo come segue per aggiungere i dettagli di configurazione.
- Endpoint: l'URL del connettore UI del backend di integrazione dell'agente, ad esempio un URL della console Cloud Run, come: https://UI_CONNECTOR_ENDPOINT.GCP_REGION.run.app
- funzionalità: Funzionalità di Agent Assist attivate nel tuo profilo di conversazione, ad esempio CONVERSATION_SUMMARIZATION,KNOWLEDGE_ASSIST_V2 e AGENT_COACHING. Tieni presente che alcune funzionalità, come SMART_REPLY, non sono disponibili per voice.
- channel: indica che l'integrazione è per voice.
- platform: indica che la piattaforma è twilio.
- conversationProfile: il nome della risorsa del tuo profilo di conversazione di Agent Assist (esempio: projects/GCP_PROJECT_ID/locations/GCP_REGION/conversationProfiles/CONVERSATION_PROFILE_ID)
- consumerKey: la chiave utente dell'app client esterna di un passaggio precedente.
- consumerSecret: il secret utente dell'app client esterna di un passaggio precedente.

Passaggio 7: testa l'integrazione

Puoi testare l'integrazione vocale con una chiamata di prova al call center di Salesforce.

Accedi a Twilio Flex dalla Service Console.
Chiama il tuo numero Twilio Flex. Ne hai preso nota nel passaggio 1.
Nella Service Console, accetta la chiamata. Si dovrebbe aprire una pagina di contatto nuova o esistente per il numero che ha chiamato.
Se si tratta di una nuova pagina di contatto, salva il contatto. Quando viene caricata la pagina dei contatti, il componente web Lightning di Salesforce dovrebbe essere caricato nella barra laterale.
Testa entrambi i lati della conversazione, assicurandoti che le funzionalità di Assistente agente funzionino come le hai configurate.

Integrazione vocale di Salesforce con Twilio Flex Mantieni tutto organizzato con le raccolte Salva e classifica i contenuti in base alle tue preferenze.