Integrazione di Salesforce Voice con Twilio Flex

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 Google ha testato e consiglia Node.js 18.20.4 con questa integrazione. Esistono problemi di compatibilità noti con Node.js 20.18.0. Per istruzioni su come installare versioni specifiche di Node.js, consulta nvm.
  • Salesforce CLI. Installa utilizzando il seguente comando del terminale: (sudo) npm install -g @salesforce/cli
  • gcloud CLI Installa il comando gcloud come indicato e autenticati utilizzando il seguente codice: gcloud auth login
  • UI Salesforce
    1. Accedi all'URL dell'istanza o a login.salesforce.com e prendi nota di quanto segue:
      • L'URL "Il mio dominio" di Salesforce. Per trovarlo, vai alla barra dei menu > menu Configurazione, quindi fai clic su Configurazione. Inserisci una ricerca Ricerca rapida per "Il mio dominio". Il nome di dominio è nel seguente formato: MY-DOMAIN-NAME.develop.my.salesforce.com.
      • Il tuo ID organizzazione Salesforce. Per trovarlo, vai alla barra dei menu > Menu di configurazione, poi fai clic su Configurazione. Inserisci una ricerca Quick Find per "Informazioni sull'azienda".
  • 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 come: YOUR_SUBDOMAIN.develop.lightning.force.com. Hai annotato questo valore nel prerequisito della UI di Salesforce. Tieni presente che non devi includere https://.
      • SALESFORCE_ORGANIZATION_ID: hai annotato questo valore nel prerequisito dell'interfaccia utente di Salesforce.

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.

  1. Vai a Home di Twilio > Marketplace > Catalogo > Twilio > Siprec Connector.
  2. Fai clic su Installa > la casella di controllo Accettazione dei termini e delle condizioni > Installa.
  3. Nella scheda Configura, configura il plug-in nel seguente modo:
    • Nome univoco: SipRec1
    • Server di registrazione delle sessioni: 
      sip:+<GTP-provisioned-phone-number>@216.239.36.145:5672;transport=tls;secure=true;edge=umatilla
    • Collabora con il tuo rappresentante di Google per eseguire il provisioning del numero GTP utilizzando la documentazione di panoramica dell'integrazione della telefonia, che fornisce maggiori dettagli sulla procedura. Puoi ignorare i passaggi di configurazione e convalida dell'SBC perché sono già stati completati per Twilio Siprec Connector.
  4. Vai a Home di Twilio > Funzioni e asset.
    • Se Funzioni e asset non è visibile nella barra laterale, bloccalo da Esplora prodotti.
  5. Fai clic su Crea servizio.
  6. Assegna al nuovo servizio il nome ui-connector-auth.
  7. Nell'editor visualizzato, fai clic su Aggiungi + > Aggiungi funzione.
  8. Assegna alla funzione il nome conversation-name.
  9. Fai clic su e imposta la visibilità della funzione su Pubblico.
  10. Copia e incolla l'intero contenuto di ui-connector-auth.js dal repository GitHub nell'editor.
  11. Fai clic su Salva.
  12. Fai clic su Esegui il deployment di tutto.

Configurare l'IVR con Flex Studio

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

  1. Vai alla console Twilio.
  2. 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.
  3. Nella sezione Voice - Studio Workflow, fai clic su Voice IVR.
  4. Trascina un widget Esegui richiesta HTTP nel flusso.
  5. Scollega Incoming Call dall'input del widget SendCallToAgent.
  6. Collega Chiamata in arrivo all'input del widget Fai richiesta HTTP.
  7. Configura il widget Make HTTP Request (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 contenuto: Application/JSON
    • Corpo della richiesta: 
      {
"accountSid": "<yourTwilioAccountSid>",
"authToken": "<yourTwilioAccountAuthToken>"
}
  8. Trascina un widget Esegui funzione nel flusso.
  9. Collega gli output Success e Fail del widget register_twilio all'input del widget Run Function.
  10. 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 }}
  11. Trascina un widget Fork Stream dalla barra laterale nel flusso.
  12. Collega gli output Successo e Errore del widget Invia richiesta HTTP all'input del widget Biforca flusso.
  13. Collega il nodo Avanti del widget Biforca flusso al widget SendCallToAgent.

  14. Configura il widget Biforca flusso nel modo seguente:

    • Azione stream: avvia
    • Stream Type (Tipo di stream): Siprec
    • Nome connettore: Siprec1
    • Tracce: entrambe le tracce

    • Parametri dello stream:

      • Chiave: conversation

      • Valore:

        projects/<gcp-project-id>/conversations/TW-{{trigger.call.From | replace_first:'+','' }}-{{trigger.call.CallSid}}

  15. Fai clic su Salva > Pubblica.

Dettagli account

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

  1. 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

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

  1. Esegui il seguente codice per clonare il repository di integrazione di Agent Assist e aprire il progetto: 
    git clone https://github.com/GoogleCloudPlatform/agent-assist-integrations
cd salesforce/aa-lwc
  2. Esegui questi comandi per scaricare i file JavaScript dei moduli UI che distribuisci in un secondo momento come risorse statiche. Salesforce richiede il caricamento di JS di terze parti per le risorse statiche. 
    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 la tua organizzazione per l'integrazione di Agent Assist.

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

Passaggio 4: crea un'app connessa

Il componente web Salesforce Lightning utilizza il flusso delle credenziali client OAuth 2.0 per autenticarti. Un'applicazione (app) connessa abilita il flusso delle credenziali client. Utilizza la chiave consumer e il secret consumer dell'app per configurare il componente LWC in modo da autenticare gli utenti con Salesforce.

Configurare le impostazioni di base

  1. Vai alla barra dei menu > Menu di configurazione, poi fai clic su Configurazione. Inserisci una ricerca Ricerca rapida per "Gestione app".
  2. Fai clic su Nuova app connessa > Crea un'app connessa > Continua, poi inserisci le seguenti informazioni.
    • Nome dell'app connessa: lwc auth
    • Nome API: lwc_auth
    • Email di contatto: your_email@example.com
    • Attiva le impostazioni OAuth: checked
    • URL di callback: https://login.salesforce.com/services/oauth2/callback
    • Selected OAuth Scopes (Ambiti OAuth selezionati): accedi al servizio URL identità
    • Enable Client Credentials Flow (Abilita flusso delle credenziali client): checked
  3. Fai clic su Salva.

Per ulteriori informazioni sulle app connesse, consulta le seguenti risorse Salesforce.

Imposta l'autorizzazione e le credenziali di esecuzione

  1. Vai alla barra dei menu > Menu di configurazione, poi fai clic su Configurazione.
  2. Inserisci una ricerca Ricerca rapida per "Gestisci le app collegate".
  3. Fai clic sul nome dell'app collegata > Modifica.
    • Vai a Flusso delle credenziali client.
    • In Esegui come, fai clic sulla lente d'ingrandimento e seleziona il tuo nome utente.
    • Fai clic su Salva.
  4. Vai alla barra dei menu > Menu di configurazione, poi fai clic su Configurazione.
  5. Inserisci una ricerca Ricerca rapida per "Gestione app".
  6. Trova lwc auth e fai clic su .
    • Fai clic su Visualizza > Gestisci dettagli consumatore.
    • Inserisci il codice di verifica inviato al tuo indirizzo email.
    • Copia la chiave utente e il secret consumer in un luogo sicuro, in quanto ti serviranno per un passaggio successivo.

Stabilisci criteri CORS e di sicurezza dei contenuti

  1. Vai alla barra dei menu > Menu di configurazione, poi fai clic su Configurazione.
  2. Inserisci una ricerca Ricerca rapida per "CORS", poi fai clic su Modifica.
    • Seleziona Attiva CORS per gli endpoint OAuth.
    • Fai clic su Salva.
  3. Vai alla barra dei menu > Menu di configurazione, poi fai clic su Configurazione.
  4. Inserisci una ricerca Ricerca rapida per "URL attendibili", quindi fai clic su Nuovo URL attendibile.
  5. Inserisci il nome API: ui_connector
    • Inserisci l'URL dell'endpoint del servizio Cloud Run del connettore UI che hai implementato con il backend di integrazione di Agent Assist. Puoi trovare questo URL nella console Cloud Run. Ad esempio: https://UI_CONNECTOR_SUBDOMAIN.GCP-REGION.run.app.
    • Seleziona tutte le caselle in Direttive CSP.
    • Fai clic su Salva e nuovo.
  6. Inserisci il nome API: ui_connector_wss
    • Inserisci l'URL dell'endpoint del servizio Cloud Run del connettore UI che hai implementato con il backend di 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.
    • Seleziona tutte le caselle in Direttive CSP.
    • Fai clic su Salva e nuovo.
  7. Inserisci il nome API: salesforce_domain
    • Inserisci l'URL del tuo dominio Salesforce nel seguente formato: https://YOUR_SUBDOMAIN.my.salesforce.com.
    • Seleziona tutte le caselle in Direttive CSP.
    • Fai clic su Salva.

Passaggio 5: installa il plug-in CTI 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.

  1. Vai alla console del servizio e seleziona Contatti.
  2. Seleziona un record di contatto.
  3. Fai clic sul menu Configurazione > Modifica pagina.
  4. Fai clic su Modello > Modifica.
    • Seleziona Intestazione e Due regioni uguali.
    • Fai clic su Avanti.
    • Mappa ogni regione su una nuova regione.
    • Fai clic su Fine.
  5. Dalla barra laterale Componenti, sposta agentAssistContainerModule nella barra laterale. Nota: questo componente è stato fornito dal comando npm deploy.
  6. 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. Ad esempio, un URL della console Cloud Run, come: https://UI-CONNECTOR-ENDPOINT.GCP-REGION.run.app.
    • funzionalità: funzionalità di Agent Assist da includere. Queste opzioni devono essere attivate nel tuo profilo di conversazione. Alcune funzionalità disponibili includono CONVERSATION_SUMMARIZATION,KNOWLEDGE_ASSIST_V2 e AGENT_COACHING. Tieni presente che alcune funzionalità, come SMART_REPLY, non sono disponibili per voice-twilio.
    • canale: indica che l'integrazione è per la voce.
    • channelType: indica che il tipo di integrazione vocale è Twilio.
    • conversationProfile: il nome della risorsa del tuo profilo di conversazione di Agent Assist. Ad esempio, projects/GCP-PROJECT-ID/locations/GCP-REGION/conversationProfiles/CONVERSATION-PROFILE-ID
    • consumerKey: la chiave utente dell'app connessa del passaggio 3.
    • consumerSecret: il secret consumer dell'app connessa del passaggio 3.

Passaggio 7: testa l'integrazione

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

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