Ti trovi qui:
Utilizzo dell'API pre-chat per passare le informazioni sui clienti all'agente dell'assistenza in un sito Experience
Per fornire agli agenti dell'assistenza informazioni sui clienti che consentono di far avanzare un'interazione, inviare i dati dell'utente finale a Service Console tramite l'API pre-chat.
Versioni (Edition) richieste
| Visualizzare le versioni supportate. | |
Questo articolo si applica a:
|
Canali di chat Web ottimizzati |
Questo articolo non si applica a:
|
Chat in app ottimizzata, WhatsApp ottimizzato, Facebook Messenger standard e ottimizzato, SMS standard e ottimizzato, Apple Messages for Business ottimizzato, LINEA ottimizzata e Porta il tuo canale |
`
Questo procedimento combina casi d'uso comuni come esempi di dati che è possibile inviare agli agenti dell'assistenza utilizzando l'API pre-chat. Innanzitutto, passare l'ID di accesso dell'utente finale all'agente in modo che la verifica sia completata. Quindi, per evitare perdite su ordini di grandi dimensioni, il valore del carrello del cliente viene passato all'agente dell'assistenza. Per raggiungere questi obiettivi, creare campi pre-chat nascosti personalizzati che instradano i dati ai campi personalizzati di Salesforce tramite un flusso. Quindi modificare lo snippet di codice, indicandogli di compilare automaticamente i campi pre-chat nascosti.
Prima di creare questo procedimento, tenere presenti le seguenti avvertenze.
- È possibile fare riferimento ai campi dell'oggetto Sessione di Messaggistica o dell'oggetto Utente messaggistica (perché è collegato alla Sessione di Messaggistica) in un modello di formula di risposta automatica per Avvia conversazione, Termina conversazione e Conversazione inattiva. Non è possibile fare riferimento ai campi degli oggetti Sessione di Messaggistica o Utente messaggistica in Conversazione
- I campi degli oggetti personalizzati Salesforce sono diversi dai campi personalizzati pre-chat. Questo procedimento fa riferimento a entrambi i tipi di campi. Ulteriori informazioni sulla relazione e le differenze tra questi due tipi di campi.
- Creare campi personalizzati negli oggetti Salesforce. In questo esempio, creare un campo ID cliente e un campo Valore carrello nella sessione di messaggistica o negli oggetti utente di messaggistica.
- Se Service Console non visualizza l'oggetto in cui sono stati memorizzati i campi, modificare il layout per consentire agli agenti dell'assistenza di accedere facilmente. In questo esempio, la Service Console viene modificata per consentire un accesso semplice agli oggetti Sessione di Messaggistica e Utente messaggistica.
- Per acquisire i dati inviati ai campi personalizzati Salesforce dal passaggio 1, creare campi pre-chat nascosti. In questo esempio, creare parametri personalizzati denominati ID cliente e Valore carrello nelle impostazioni di Messaggistica per il canale e quindi selezionarli come campi pre-chat nascosti nelle impostazioni del modulo pre-chat Servizi incorporati.
- Mappare i campi pre-chat personalizzati ai campi personalizzati Salesforce e quindi compilare i campi Salesforce utilizzando un flusso. In questo esempio, il campo pre-chat denominato ID cliente viene mappato al campo Salesforce denominato ID cliente. Viene quindi mappato il campo pre-chat denominato Valore carrello al campo Salesforce denominato Valore carrello. Con la flessibilità dei flussi, è possibile combinare o suddividere i dati o compilare qualsiasi altro oggetto, ad esempio Caso o Referente, in base alle esigenze.
-
Creare e distribuire un componente LWC personalizzato che recupera le informazioni sull'utente.
- Nella cartella dei componenti LWC personalizzati appena creata, è riportato un modello del componente personalizzato.
-
Il file .js-meta.xml.
<?xml version="1.0" encoding="UTF-8"?> <LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata"> <apiVersion>55.0</apiVersion> <isExposed>true</isExposed> <masterLabel>[give a component name here]</masterLabel> <description>Set logged in User details for Embedded Messaging component</description> <targets> <target>lightningCommunity__Page</target> <target>lightningCommunity__Default</target> </targets> </LightningComponentBundle> -
Il file .js.
import { LightningElement, wire } from 'lwc'; import { getRecord, getFieldValue } from 'lightning/uiRecordApi'; import Id from '@salesforce/user/Id'; import First_Name from '@salesforce/schema/User.FirstName'; import Last_Name from '@salesforce/schema/User.LastName'; import Email from '@salesforce/schema/User.Email'; const fields = [First_Name, Last_Name, Email]; export default class EmbeddedMessagingSetRecordUser extends LightningElement { userId = Id; user; @wire(getRecord, { recordId: '$userId', fields }) wiredRecord({ error, data }) { if (error) { let message = "Unknown error"; if (Array.isArray(error.body)) { message = error.body.map((e) => e.message).join(", "); } else if (typeof error.body.message === "string") { message = error.body.message; } console.error("Error loading user record:" + message); } else if (data) { this.user = data; console.log('before custom event'); var selectedEvent = new CustomEvent('userInfo', { detail: { fname: getFieldValue(this.user, First_Name), lname : getFieldValue(this.user, Last_Name), email: getFieldValue(this.user, Email) }, bubbles: true, composed: true }); // Dispatches the event. window.dispatchEvent(selectedEvent); } } } -
Il file .html.
<template></template>
- Nel Generatore di siti Experience, trascinare il componente LWC personalizzato nel piè di pagina del modello.
-
Passare a Impostazioni → Avanzate → Modifica markup intestazione, incollare il seguente script di esempio nel markup intestazione.
<script> var fname, lname, email; window.addEventListener('userInfo', function(e){ console.log("userInfo received"); fname = e.detail.fname; lname = e.detail.lname; email = e.detail.email; }); window.addEventListener("onEmbeddedMessagingReady", e => { embeddedservice_bootstrap.prechatAPI.setVisiblePrechatFields({ "_firstName": { "value": fname, "isEditableByEndUser": true }, "_lastName": { "value": lname, "isEditableByEndUser": true }, "_email": { "value": email, "isEditableByEndUser": true } }); }); </script> -
Aggiornare lo snippet di codice di messaggistica incorporata, indicandogli di compilare automaticamente i campi pre-chat creati nel passaggio 2. Il codice in questo esempio utilizza l'API pre-chat per inviare automaticamente ID cliente e Valore carrello ai campi pre-chat. Prima di aggiungere uno snippet di codice, prestare attenzione ai seguenti punti.
- La prima sezione del codice contiene un esempio di snippet di codice standard per la distribuzione Servizio incorporato. L'aspetto è leggermente diverso a causa dell'ID distribuzione e del nome univoci.
-
Per completare il procedimento, aggiungere il codice che inizia con la riga commento
Passing Web Context to Prechat - BEGIN. - La prima sezione assegna valori statici a queste variabili, ma è possibile modificarli in modo da riflettere come si ottengono questi valori. La sezione successiva compila i campi pre-chat visibili. La sezione finale compila i campi pre-chat nascosti.
- Nell'assegnazione dei valori vengono utilizzate impostazioni di codice diverse. Ad esempio, il nome e il cognome sono bloccati e non modificabili dagli utenti.
- La pagina o il modello di sito deve avere il componente Messaggistica incorporata.
- Un sito Experience non consente di incollare direttamente uno snippet di codice. Includere l'API Prechat nel markup dell'intestazione. Aggiungere il codice in Generatore di esperienze → Impostazioni → Avanzate → Modifica markup head.
-
Nell'esempio di codice del sito Experience, non viene incluso uno snippet di codice di base, ad esempio la funzione
initEmbeddedMessaging(). Questo perché tale codice di base è già incluso nel componente LWC Messaggistica incorporata. - Questo esempio include un listener di eventi su userInfo. In questo modo le informazioni di un cliente connesso vengono inviate direttamente al modulo pre-chat senza chiedere al cliente di inserirle nuovamente. L'esempio rende i campi modificabili dai clienti. È anche possibile modificare la configurazione isEditableByEndUser per bloccarla.



