Questa pagina spiega come eseguire l'upgrade dalla versione 2 alla versione 3 dell'SDK web. Se stai installando l'SDK web per la prima volta, consulta la Guida all'SDK web v3.
Funzionalità dell'SDK web v3
Di seguito sono riportate alcune funzionalità dell'SDK web v3 che non esistono nell'SDK web v2:
Moduli personalizzati: gli agenti possono inviare moduli di raccolta dati personalizzati direttamente all'interno dell'interfaccia della chat web. Per saperne di più, consulta Moduli di raccolta dei dati.
Trascrizioni scaricabili: consenti agli utenti finali di scaricare le trascrizioni delle chat direttamente dal widget. Per saperne di più, consulta Scaricare le trascrizioni delle chat utilizzando l'SDK web e gli SDK per dispositivi mobili.
Trigger di chat proattivi avanzati: utilizza trigger di chat proattivi avanzati, ad esempio specificando la lingua della coda o utilizzando una logica AND-OR complessa per le parole chiave degli URL. Per saperne di più, consulta Trigger proattivi dell'SDK web.
Eseguire l'upgrade all'SDK web v3
Innanzitutto, individua questo script nel codice sorgente:
<script type="module" src="https://websdk.ujet.co/v2/loader.js"></script>
Poi, sostituiscilo con il seguente:
<script type="module" src="https://{your_ccaas_host}/web-sdk/v3/widget.js"></script>
Differenze importanti
L'SDK web v3 è basato direttamente sul client headless UJET. Poiché l'interfaccia utente del widget utilizza questa struttura headless, puoi accedere e chiamare tutti i metodi sottostanti e ascoltare gli eventi supportati dall'SDK headless scegliendo come target ccaas.client.
Questa sezione illustra le principali differenze tra la versione 2 e la versione 3 dell'SDK web.
Inizializzazione
v2
const ccas = new UJET({
"companyId": "{companyId}",
"host": "https://{your_ccaas_host}",
"authenticate": getAuthToken
})
v3
var ccas = new UJET({
"companyId": "{companyId}",
"host": "https://{your_ccaas_host}",
"authenticate": getAuthToken
})
// v3 has a mount point
// ccaas.mount(HTMLElement | string)
ccaas.mount('#ccaas-widget')
Opzioni
Quando avvii l'SDK web, devi specificare le opzioni. Questa sezione descrive le differenze tra la versione 2 e la versione 3 dell'SDK web.
v2
Non applicabile alla versione 2.
v3
Nella versione 3, le opzioni di inizializzazione sono le stesse dell'SDK headless.
interface ClientOption {
companyId: string;
authenticate: () => Promise<TokenResponse>;
tenant?: string;
host?: string;
lang?: string;
bridge?: string;
cobrowse?: {
enabled: boolean;
template?: string;
messages?: CobrowseMessages;
api?: string;
license?: string;
trustedOrigins?: string[];
capabilities?: string[];
registration?: boolean;
redactedViews?: string[];
unredactedViews?: string[];
};
}
È possibile configurare opzioni aggiuntive con il metodo ccaas.config():
ccaas.config({
disableAttachment: true
})
Opzioni di configurazione disponibili:
interface ConfigOptions {
accent?: AccentColor;
logo?: string;
menuKey?: string;
ticketId?: string;
preferredChannel?: string;
disableAttachment?: boolean;
customData?: string | Record<string, any>;
messages?: Record<string, unknown>;
reCaptchaSiteKey?: string;
}
Metodi
Nella versione 2, nel caricatore sono presenti alcuni metodi aggiuntivi, ad esempio:
ccaas.createCobrowseCode()
ccaas.fetchWaitTimes({id: 123})
Nella versione 3, l'interfaccia utente del widget utilizza un client headless, quindi puoi chiamare tutti i metodi supportati dall'SDK headless.
const client = ccaas.client
client.getCompany()
client.loadOngoingChat()
Per saperne di più, consulta la Guida all'SDK web headless.
Eventi
Nella versione 2, puoi ascoltare gli eventi con:
ccaas.on('chat:update', (chat) => {
console.log(chat)
})
Nella versione 3, puoi ascoltare gli eventi con il client headless:
const client = ccaas.client
client.on('chat.updated', (chat) => {
console.log(chat)
})
Per scoprire di più sugli eventi, consulta la Guida all'SDK web headless.
Personalizzazione del tema
L'SDK web v3 ha un approccio aggiornato alla personalizzazione del tema. Per saperne di più, consulta Personalizzazione del tema.