Integrazione con telefono e Twilio Flex

È possibile utilizzare l'integrazione telefonica per aiutare i clienti al telefono e trasferirli ad agenti in carne e ossa all'interno di Twilio Flex. Se, nel corso di una conversazione con il vostro assistente, un cliente chiede di parlare con una persona, potete trasferire la conversazione direttamente a un agente Twilio Flex.

Prima di iniziare

Per utilizzare questo modello di integrazione, è necessario

  • Costruttore di assistente AI (necessario per l'integrazione del telefono)
  • Un account Twilio con i seguenti prodotti:
    • Twilio Flex
    • Twilio Voice con API vocale programmabile
    • Studio Twilio

Aggiunta dell'integrazione telefonica dell'assistente AI

Questa sezione può essere saltata se si è già aggiunta l'integrazione del telefono all'assistente.

Se è necessario aggiungere l'integrazione del telefono, procedere come segue.

  1. Nella sezione Integrazioni della pagina principale dell'assistente, sotto Canali essenziali, è presente un riquadro per Telefono.

  2. Nel riquadro Telefono, fare clic su Aggiungi.

  3. Nella finestra a comparsa, fare nuovamente clic su Aggiungi.

  4. Selezionate Utilizza un numero di telefono esistente con un provider esterno.

  5. Completare il processo di configurazione dell'integrazione telefonica. Per ulteriori informazioni, vedere Integrazione con il telefono.

Per il momento, questo è tutto ciò che dovete fare. Per ulteriori informazioni sulla configurazione dell'integrazione del telefono, vedere Integrazione con il telefono.

Aggiungere il progetto Twilio Flex

È necessario un progetto Twilio Flex nuovo o esistente.

Se avete bisogno di un progetto Twilio Flex, potete crearne uno seguendo questi passaggi.

  1. Dal menu a discesa del progetto, fare clic su Crea nuovo progetto. Specificate un nome per il progetto e verificate le informazioni del vostro account.

  2. Nella pagina di benvenuto, selezionare Flex come prodotto Twilio per il nuovo progetto. Completate il questionario, quindi fate clic su Iniziare con Twilio.

    Dopo il provisioning del progetto Flex, tornate alla console Twilio. Assicurarsi di aver selezionato il progetto corretto dall'elenco a discesa.

  3. Nel menu di navigazione, fare clic sull'icona Tutti i prodotti e servizi.

  4. Fare clic su Twilio Programmable Voice > Impostazioni > Generale.

  5. In Funzioni SIP programmabili avanzate, spostare l'interruttore su Abilitato.

Creazione del flusso di chiamate

Dopo aver configurato l'integrazione telefonica e il progetto Twilio Flex, è necessario creare un flusso di chiamate con Twilio Studio e fornire (o portare) il numero di telefono con cui si desidera che l'assistente lavori.

Per creare il flusso di chiamate:

  1. Nel menu di navigazione, fare clic sull'icona Tutti i prodotti e servizi.

  2. Fare clic su Studio.

  3. Fare clic su + per creare un nuovo flusso.

  4. Assegnare un nome al nuovo flusso, quindi fare clic su Avanti.

  5. Selezionare Inizia da zero, quindi fare clic su Avanti. Un widget Trigger appare nell'area di disegno del flusso.

  6. Fare clic sul widget Trigger.

  7. Prendere nota del valore del campo URL WEBHOOK. Questo valore è necessario in una fase successiva.

Configurazione del numero di telefono

  1. Nel menu di navigazione, fare clic sull'icona Tutti i prodotti e servizi.

  2. Cliccate su Numeri di telefono.

  3. In Gestione numeri, configurare il numero di telefono che si desidera far utilizzare all'assistente. Selezionare Acquista un numero per acquistare un nuovo numero o Porta & Host per trasferire un numero di telefono esistente.

  4. Nell'elenco Numeri attivi, fare clic sul nuovo numero di telefono.

  5. In Voce e fax, configurare queste impostazioni.

    • Per il campo CONFIGURA CON, selezionare Webhook, TwiML Bins, Funzioni, Studio o Proxy.

    • Per C'È UNA CHIAMATA IN, selezionare Flusso di studio. Selezionare il flusso dall'elenco a discesa.

    • Per PRIMARY HANDLER FAILS, selezionare Studio Flow. Selezionare il flusso dall'elenco a discesa.

  6. Accedere all'interfaccia utente dell'assistente AI e aprire le impostazioni di integrazione del telefono per l'assistente.

  7. Nel campo Numero di telefono, digitare il numero di telefono configurato in Flex Studio.

  8. Fare clic su Salva ed esci.

Prova il tuo numero di telefono

È ora possibile verificare che il numero di telefono sia connesso al flusso attivando un widget Say/Play nell'editor di Twilio Flex Flow.

  1. Trascinare un widget Say/Play sulla tela del flusso.

  2. Configurare il widget Say/Play con una frase semplice come I'm alive..

  3. Collegare il nodo Chiamata in arrivo del widget Trigger al widget Say/Play.

  4. Chiamate il vostro numero di telefono. Il flusso Twilio dovrebbe rispondere con la frase di prova.

  5. Eliminare il widget Say/Play e continuare con il passaggio successivo.

  6. Se questo test non funziona come previsto, ricontrollare la configurazione del numero di telefono per verificare che sia collegato al flusso.

Creare una funzione Twilio per gestire le chiamate in entrata

Ora è necessario configurare il flusso di chiamate per indirizzare le chiamate in entrata all'assistente utilizzando una funzione Twilio. Eseguire queste operazioni:

  1. Nel menu di navigazione, fare clic sull'icona Tutti i prodotti e servizi.

  2. Fare clic su Servizi.

  3. Fare clic su Crea servizio. Specificare il nome del servizio e fare clic su Avanti.

  4. Fare clic su Aggiungi > Aggiungi funzione per aggiungere una nuova funzione al servizio. Dare un nome alla nuova funzione /receive-call.

  5. Sostituire il modello nella funzione /receive-call con questo codice:

    exports.handler = function(context, event, callback) {
  const VoiceResponse = require('twilio').twiml.VoiceResponse;  
  const response = new VoiceResponse();
  const dial = response.dial({
    answerOnBridge: "true",
    referUrl: "/refer-handler"
  });
  const calledPhoneNumber = event.Called;
  dial.sip(`sip:${calledPhoneNumber}@{sip_uri_hostname};secure=true`);  
  return callback(null, response);
}
    • Sostituire {sip_uri_hostname} con la parte del nome host dell'URI SIP dell'integrazione telefonica dell'assistente (tutto ciò che viene dopo sips:). Nota: Twilio non supporta gli URI SIPS, ma supporta il trunking SIP sicuro aggiungendo ;secure=true all'URI SIP.

  6. Fare clic su Salva.

  7. Fate clic su Dispiega tutto.

Reindirizzamento al gestore delle chiamate in entrata

Utilizzare un widget TwiML Redirect nell'editor di Studio Flow per richiamare la funzione /receive-call creata nella sezione precedente.

  1. Aggiungere un widget TwiML Redirect al canvas di Studio Flow.

  2. Collegare il trigger Chiamata in arrivo al widget TwiML Redirect.

  3. Configurare il widget TwiML Redirect con l' URL della funzione /receive-call creata nella sezione precedente.

  4. Il flusso dovrebbe ora reindirizzare all'assistente AI quando si riceve una chiamata in entrata.

  5. Se il reindirizzamento fallisce, assicurarsi di aver distribuito la funzione /receive-call.

Creare una funzione Twilio per gestire i trasferimenti dall'assistente

È inoltre necessario configurare il flusso di chiamate per gestire le chiamate trasferite dall'assistente a Twilio Flex, nei casi in cui i clienti chiedano di parlare con un agente. Utilizzare un Say/Play dopo il widget TwiML Redirect per mostrare che la chiamata è stata ritrasferita al flusso dall'assistente AI. A questo punto sono possibili diverse opzioni, come l'accodamento della chiamata a un agente in carne e ossa, che vengono discusse in questa sezione.

  1. Aggiungete un widget Dice/Play alla tela e configuratelo con una frase come Transfer from Watsom complete.

  2. Collegare il nodo Return del widget TwiML Redirect al widget Say/Play.

  3. Fare clic sul widget Trigger.

  4. Copiare il valore dal campo URL WEBHOOK. Questo valore è necessario in una fase successiva.

  5. Nella pagina Twilio Functions, fate clic su Aggiungi > Aggiungi funzione per aggiungere una nuova funzione al vostro servizio. Nominare questa nuova funzione /refer-handler.

  6. Sostituite il modello nella funzione /refer-handler con il seguente codice:

    exports.handler = function(context, event, callback) {
  // This function handler will handle the SIP REFER back from the Phone Integration.
  // Before handing the call back to Twilio, it will extract the session history key from the
  // User-to-User header that's part of the SIP REFER Refer-To header. This session history key
  // is a string that is used to load the agent application in order to share the transcripts of the caller
  // with the agent.
  // See https://github.com/watson-developer-cloud/assistant-web-chat-service-desk-starter/blob/main/docs/AGENT_APP.md
  const VoiceResponse = require('twilio').twiml.VoiceResponse;
  
  const STUDIO_WEBHOOK_URL = '{webhook_url}';
  
  let studioWebhookReturnUrl = `${STUDIO_WEBHOOK_URL}?FlowEvent=return`;
  
  const response = new VoiceResponse();
  console.log("ReferTransferTarget: " + event.ReferTransferTarget);
  
  const referToSipUriHeaders = event.ReferTransferTarget.split("?")[1];
  console.log(referToSipUriHeaders);
  if (referToSipUriHeaders) {
    const sanitizedReferToSipUriHeaders = referToSipUriHeaders.replace(">", "");
    console.log("Custom Headers: " + sanitizedReferToSipUriHeaders);
    
    const sipHeadersList = sanitizedReferToSipUriHeaders.split("&");
    
    const sipHeaders = {};
    for (const sipHeaderSet of sipHeadersList) {
      const [name, value] = sipHeaderSet.split('=');
      sipHeaders[name] = value;
    }

    const USER_TO_USER_HEADER = 'User-to-User';
    
    // Extracts the User-to-User header value
    const uuiData = sipHeaders[USER_TO_USER_HEADER];
    
    if (uuiData) {
      const decodedUUIData = decodeURIComponent(uuiData);
      const sessionHistoryKey = decodedUUIData.split(';')[0];
      // Passes the session history key back to Twilio Studio through a query parameter.
      studioWebhookReturnUrl = `${studioWebhookReturnUrl}&SessionHistoryKey=${sessionHistoryKey}`;
    }    
  }

  response.redirect(
    { method: 'POST' },
    studioWebhookReturnUrl
  );

  // This callback is what is returned in response to this function being invoked.
  // It's really important! E.g. you might respond with TWiML here for a voice or SMS response.
  // Or you might return JSON data to a studio flow. Don't forget it!
  return callback(null, response);
}

    Sostituire {webhook_url} con il valore dell' URL WEBHOOK copiato dal widget Trigger in Studio Flow.

  7. Fare clic su Salva.

  8. Fate clic su Dispiega tutto.

  9. Dopo aver creato questo gestore di riferimenti, copiare l' URL della funzione nel campo referUrl del gestore /receive-call.

Configurazione dell'assistente per trasferire le chiamate a Twilio Flex

Ora dobbiamo configurare l'assistente per trasferire le chiamate a Twilio Flex quando un cliente chiede di parlare con un agente. Eseguire queste operazioni:

  1. Nell'interfaccia utente dell'assistente AI, aprire l'abilità di dialogo dell'assistente.

  2. Aggiungere un nodo con la condizione che attiva l'assistente per trasferire i clienti a un agente.

  3. Aggiungere una risposta testuale al nodo e specificare il testo che si desidera far pronunciare all'assistente prima di trasferire i clienti a un agente.

  4. Aprire l'editor JSON per la risposta.

  5. Nell'editor JSON, aggiungere un connect_to_agent risposta, specificando il proprio numero di telefono come sip.uri (sostituire {phone_number} con il numero di telefono del proprio trunk SIP):

{
  "generic": [
    {
        "response_type": "connect_to_agent",
        "transfer_info": {
          "target": {
            "service_desk": {
              "sip": {
                "uri": "sip:+{phone_number}@flex.twilio.com",
                "transfer_headers_send_method": "refer_to_header"
              }
            }
          }
        },
        "agent_available": {
          "message": "Ok, I'm transferring you to an agent"
        },
        "agent_unavailable": {
          "message": ""
        }
    }
  ]
}

Questo esempio non mostra come utilizzare il contesto che viene passato dall'assistente AI a Twilio Flex. È possibile fare riferimento alle informazioni User-to-User all'interno del flusso Twilio Flex:

{
  "context": {
    "widgets": {
      "redirect_1": {
        "User-to-User": "value",
      }
    }
  }
}

dove redirect_1 è il nome del widget di reindirizzamento. Ad esempio, se si impostano più code, si può utilizzare un widget Twilio Split per scegliere una coda in base al contesto restituito.

Mettete alla prova il vostro assistente

Il vostro assistente dovrebbe ora essere in grado di rispondere alle chiamate al vostro numero di telefono e di ritrasferire le chiamate al vostro flusso Twilio Flex. Per testare l'assistente:

  1. Chiamate il vostro numero di telefono. Quando l'assistente risponde, chiedete di un agente.

  2. Si dovrebbe sentire la frase configurata nel widget Say/Play (ad esempio, "Trasferimento da Watson completato").

  3. Se il trasferimento non riesce, utilizzare il log della console per seguire il flusso della chiamata che passa dal flusso al gestore '/receive-call, all'assistente AI, al gestore di riferimento e quindi al flusso Twilio Flex.

Condividere la cronologia delle conversazioni con gli agenti del service desk

Per consentire agli agenti del service desk di avere una rapida visione della cronologia delle conversazioni tra il visitatore e l'assistente, configurare l'applicazione Agent App dell'assistente AI per l'ambiente Twilio Flex. Per ulteriori informazioni, consultare la documentazione dell'applicazione Twilio Flex AI assistant Agent.