Click-to-Call

Click-to-Call laat uw contactenClosed De persoon die contact heeft met een agent, IVR of bot in uw contactcenter. een live agent bellen met één klik op de knop. Via een knop op uw website kunnen bezoekers een directe oproep starten met een agent. Dit kan u helpen het volgende te verminderen of te elimineren:

  • Extra stappen bij het verbinden met een verkoop- of ondersteuningsteam.

  • Overheadkosten, zoals servicenummerbijdragen en mobiele toeslagen.

Click-to-Call werkt via een softwareontwikkelingskit (SDK), geschreven in JavaScript. Om dit in te stellen, moet u samenwerken met een ontwikkelaar voor het implementeren van de SDK in uw website. U moet ook samenwerken met een Accountmanager die specifieke referenties kan verstrekken.

Click-to-Call wordt ondersteund op desktopbrowsers.

Click-to-Call SDK-details

De SDK bestaat uit één bestand clicktocall.js. Dit moet worden opgenomen of er moet naar worden verwezen op elke webpagina waar u de knop Click-to-Call wil weergeven. U moet uw eigen UI-componenten ook implementeren, zoals de knop Click-to-Call en oproepbedieningselementen. De knop Click-to-Call moet de functie makeCall aanroepen in de SDK, wat een WebRTC-oproep initieert. Als het oproepverzoek is geauthenticeerd door CXone Mpower, wordt de oproep geplaatst.

Integratievereisten

Om uw ontwikkelaars voor te bereiden op het integreren van Click-to-Call in uw site, moet u het volgende voltooien:

  • U moet een client-ID verkrijgen van uw Accountmanager.

  • Werk samen met uw Accountmanager om de telefoonnummers op te geven die specifiek zijn voor Click-to-Call.

  • Implementeer een POST API op uw eigen server. De API moet een JWT-token voor authenticatie genereren. Dit valideert dat inkomende oproepverzoeken legitiem zijn.

    Click-to-Call authenticatie gebruikt een JWT. U moet een paar RSA asymmetrische sleutels genereren met een grootte van 2048 bits in de opmaak PKCS#1. De eerste is een privésleutel die u gebruikt voor het genereren van uw JWT of JWT1. De tweede is een openbare sleutel die u moet opgeven voor NICENICE. Wanneer u een telefoongesprek start, moet u de JWT1 opnemen in het verzoek. CXone Mpower Valideert de JWT1 in het inkomende verzoek met de openbare sleutel die u hebt opgegeven.

    U moet de JWT1 genereren met een POST API. U moet deze API implementeren op uw eigen server. De SDK verwacht dat deze API het contactpuntClosed Het toegangspunt dat een inbound contact gebruikt om een interactie te starten, zoals een telefoonnummer of e-mailadres. (contactadres) en de client-ID in de inhoud van het verzoek accepteert. Dit zou de JWT-token moet retourneren met ContactAddress en ClientId als claims.

    U kunt voorbeelden van codefragmenten zoeken in de map IntegrationHelpers/Templates van het SDK-pakket. Deze zijn geschreven in .NET en Java. Ze leggen uit hoe u de asymmetrische sleutels voor authenticatie moet genereren, evenals de POST API die u moet implementeren.

    Voorbeeld van een API-eindpunt:

    POST /generate-jwt1-token
Content-Type: application/json
{
	"ContactAddress": "<CONTACT_ADDRESS>",
	"ClientId": "<CLIENT_ID>"
}
							
	// API response:
"GENERATED_JWT1_TOKEN"

    Voorbeeld van een API-eindpunt URL van JWT1-token:

    let getJWT1TokenURL = '<YOUR_TOKEN_ENDPOINT_URL>'; //This is where you enter the URL for the POST API you implement.

  • Geef de openbare sleutel voor uw Accountmanager op voor de authenticatie.

  • Denk na over uw UI-design. U moet uw eigen UI ontwikkelen voor de contactzijde van de oproep, inclusief knoppen voor oproepbediening, zoals dempen of gesprek beëindigen. De SDK bevat voorbeeldcomponenten React en Angular die uw ontwikkelaars kunnen gebruiken als referentie en ter inspiratie. De agentzijde van de oproep wordt afgehandeld in hun agentapplicatie. Daarom is UI-ontwikkeling alleen nodig voor de contactzijde.

CXone Mpower-configuratie

Naast het toevoegen van de Click-to-Call-functionaliteit aan uw website, moet u ook zorgen dat uw routingcomponenten zijn ingesteld in CXone Mpower. Uw CXone Mpower-beheer kan de nodige componenten instellen.

Zorgt dat u het volgende hebt:

  • Een inbound spraakACDskill, gemaakt met de nodige agents eraan toegewezen.

  • Contactpunten (POC) ingesteld voor de spraakoproepen. Deze moeten telefooncontactpunten zijn voor elk Click-to-Call telefoonnummer. De ontwikkelaar die Click-to-Call implementeert op uw site, moet dit gebruiken voor contactAddress in het bestand JavaScript.

  • Een Studio-script om de oproepen naar een agent te routeren.

Afhankelijk van uw CXone Mpower-instelling, kunt u mogelijk bestaande routeringscomponenten gebruiken, of moet u nieuwe aanmaken en instellen.

SDK-integratie

Zorg dat u de nodige items hebt voltooid of voorbereid in de sectie Vereisten.

  1. Integreer het bestand clicktocall.js in uw webpagina volgens uw voorkeur.

  2. Stel de API-eindpunt-URL van uw POST API in het bestand clicktocall.js in.

    let getJWT1TokenURL = '<YOUR_TOKEN_ENDPOINT_URL>';

  3. Werk de getJWT2TokenURL-variabele bij met het volgende API-eindpunt. CXone Mpower gebruikt dit om uw JWT te valideren:

    let getJWT2TokenURL = 'https://api-na1.niceincontact.com/ClickToCall/GetJWT2Token';

  4. Voeg de volgende UI-componenten toe aan uw website. Zorg dat u elke component een unieke id geeft. Het SDK-pakket bevat voorbeelden van UI-componenten in React en Angular. U kunt deze vinden in de map IntegrationHelpers/UIComponents.

    • Knop om de spraakoproep te starten.

    • Knop om in te haken of de oproep te verbreken.

    • Knop voor het dempen en weergeven van de audio van de oproep.

    • Knop voor het weergeven van een toetsenblok voor DTMF-invoer.

    • Een <div> voor het weergeven van de toetsen van het toetsenblok.

    • Label voor het weergeven van berichten over gelukte oproepen of foutmeldingen.

    • Een <audio>-tag voor het afspelen van bepaald geluiden, zoals beltonen of geluiden bij het verbinden van een oproep.

  5. Werk het bestand clicktocall.js bij met verwijzingen naar de UI-componenten die u in de vorige stap hebt toegevoegd.

    let clickToCallButtonId = '<YOUR_CLICK_TO_CALL_BUTTON_ID>';
let hangUpButtonId = '<YOUR_HANG_UP_BUTTON_ID>';
let muteAudioButtonId = '<YOUR_MUTE_AUDIO_BUTTON_ID>';
let keypadButtonId = '<YOUR_KEYPAD_BUTTON_ID>';
let dtmfKeyDivId = '<YOUR_DTMF_KEY_DIV_ID>';
let callStatusMessageLabelId = '<YOUR_CALL_STATUS_MESSAGE_LABEL_ID>';
let remoteAudioId = '<YOUR_AUDIO_CONTROL_ID>';

  6. Voeg de makeCall(contactAddress)-methode toe aan de knop Click-to-Call.

  7. Om DTMF-tonen te verzenden, roept u de functie guiSendDTMF(digit) op wanneer op een DTMF-knop wordt geklikt.

  8. Stel uw voorkeuren in de configuratiesectie van het bestand clicktocall.js in. Dit is een sectie met verschillende configuratievariabelen die bepaalde gedragstypen beheren.

    • Stel het aantal nieuwe pogingen in met retryCount. Als een oproep wordt verbroken, is dit het aantal keer dat het systeem probeert opnieuw te verbinden met de oproep. De standaardwaarde is 3.

    • Stel de waarde POCREnvironmentXHeaderValue in op PROD.

    • Stel de configuratie-instellingen voor de telefoonserver in phoneServerConfig en clientId in.

      let phoneServerConfig = {
	domain: '<Domain of the SIP server>', //Set value of this configuration to 'cxonevoice.com'
	addresses: [], //Keep this array empty
	iceServers: [], //Keep this array empty
	userName: '<username>', //This configuration is a human-readable string used to identify the sender in a more friendly way. In agent applications like CXone Agent, this might be displayed on the screen during a call. Tthis value should not contain any spaces and should not exceed 20 characters. 
	displayName: '', // This is an optional field and its value can be kept the same as userName 
	password: '' //Keep this field empty
}
let clientID = '<YOUR_CLIENT_ID>'; //Set the value of this configuration as provided by CXone

  9. Als u de meldingen aan contactzijde die verwant zijn met oproepen die mislukken of worden verbroken wilt aanpassen, wijzigt u de tekenreeksen in de volgende variabelen in clicktocall.js.

    • callFailedToConnectErrorMessage

    • uiErrorMessage

    • contactSupportTeamMessage

  10. Zorg dat u dit uitgebreid test om zeker te zijn dat u de oproepen met succes kunt starten en routeren.