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.

Belangrijke informatie over Click-to-Call

  • Click-to-Call wordt ondersteund op desktopbrowsers. Momenteel wordt dit niet ondersteund voor mobiele apparaten.

  • Click-to-Call wordt momenteel ondersteund in de volgende regio's:

    • Canada

    • Duitsland

    • Japan

    • VK

    • VS

  • Belangrijke informatie over de Click-to-Call SDK omvat:

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

  • De SDK biedt een optie om gebruikersgegevens, websitemetagegevens en routeringsgegevens door te geven als onderdeel van de SIP-uitnodigingsaanvraag met behulp van X-headers. U moet uw Studio-script dat is gekoppeld aan het Click-to-Call contactpuntClosed Het toegangspunt dat een inbound contact gebruikt om een interactie te starten, zoals een telefoonnummer of e-mailadres. configureren om de opname te verkrijgen en deze indien nodig te gebruiken. Dit kan bijvoorbeeld inhouden dat gebruikersgegevens worden weergegeven in een pop-upscherm voor agenten of dat de routeringsgegevens worden gebruikt om routeringsbeslissingen te nemen.

    Deze voorziening is optioneel en u dient deze alleen in te stellen als u deze nodig heeft. Als u het niet nodig hebt, kunt u de functie makeCall() instellen zonder gegevens door te geven.

    Het verzamelen en doorgeven van gegevens is uw verantwoordelijkheid. De SDK biedt alleen het mechanisme om de gegevens te verzenden. Het genereert, valideert of beheert de gegevens niet.

Integratievereisten

Om u voor te bereiden op de integratie van Click-to-Call in uw site, moet u het volgende doen:

  • Verkrijg een client-ID van uw NICE Accountmanager.

  • Werk samen met uw NICE Accountmanager om telefoonnummers in te richten 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 asymmetrische RSA-sleutels genereren met een grootte van 2.048 bits in de PKCS#1-indeling. De eerste is een privésleutel waarmee u uw JWT of JWT1 genereert. De JWT moet worden ondertekend met behulp van het RS256-algoritme. De tweede is een openbare sleutel, die u aan NICE moet verstrekken. 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. Zorg ervoor dat de vervaltijd van de JWT1-token niet langer is dan 20 seconden.

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

  4. 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>';

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

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

    let callFailedToConnectErrorMessage = 'Call failed to connect. Service not available!';
let uiErrorMessage = {
'Default': 'Error occurred. Please try again!',
'Terminated': 'Call ended successfully!',
'Canceled': 'Call cancelled. Please try again!',
'Failed': callFailedToConnectErrorMessage,
'login failed': callFailedToConnectErrorMessage,
'disconnected': callFailedToConnectErrorMessage,
'logout': callFailedToConnectErrorMessage,
'SIP Failure Code': callFailedToConnectErrorMessage,
'RTP Timeout':  'RTP Timeout': 'The call ended unexpectedly due to network issues. Please ensure your internet is stable and try placing the call again!',
'Token Claims': 'An error occurred during the call attempt. Please retry!'
						}
let contactSupportTeamMessage = "We're sorry, could not connect the call. Please try again later or contact our support team!";

  7. Configureer locatiegebaseerde bronnen als u de dichtstbijzijnde bronnen wilt toewijzen om Click-to-Call verzoeken te verwerken. Om dit te doen, doe je het volgende in clicktocall.js:

    1. Gebruik de functie getAvailableLocations() om een lijst met locaties te retourneren waar de vereiste bronnen, zoals Session Border Controllers (SBC's), zijn geïmplementeerd. Deze locaties helpen bepalen wat de beste bron is voor het verwerken van Click-to-Call-verzoeken.

    2. Integreer de locatieselectie in de gebruikersinterface. U kunt dit op twee manieren doen:

      • Door de gebruiker selecteerbare bediening: Bied een selecteerbaar element, zoals een vervolgkeuzelijst of keuzerondje, waarmee contactpersonen hun dichtstbijzijnde locatie kunnen selecteren uit de opties die de functie getAvailableLocations() biedt.

      • Automatische toewijzing: Als het systeem de locatie van het contact kan bepalen, wordt deze toegewezen aan een van de locaties die door de functie getAvailableLocations() zijn vrijgegeven en doorgegeven aan de functie makeCall().

    3. Configureer de standaardlocatie. Om dit te doen, stelt u de variabele defaultLocation in op de locatie waarvandaan uw contactpersonen het vaakst bellen. De standaardlocatie moet een van de locaties zijn die door de functie getAvailableLocations() worden geretourneerd.

      // Variable to store default location
let defaultLocation = "US";

  8. Voeg de makeCall(contactAddress, [location], [userData], [routingData])-methode toe aan de knop Click-to-Call. De parameters location, userData en routingData zijn optioneel.

    De parameters userData en routingData geven gebruikers- en routeringsgegevens door voor gebruik bij routeringsbeslissingen of voor weergave in Agent. Dit wordt gedaan als onderdeel van het SIP-uitnodigingsverzoek met behulp van X-headers. Vervolgens kunt u de gegevens verwerken in het script Studio dat voor het contactpunt wordt gebruikt.

    • userData: Geeft gebruikersgerelateerde informatie weer.

    • routingData: Geeft gegevens weer die worden gebruikt voor routeringsbeslissingen.

    Deze parameters moeten worden opgegeven als objecten die sleutel-waardeparen bevatten. De SDK converteert beide objecten naar strings met behulp van JSON.stringify() en verzendt ze als X-headers in het SIP-uitnodigingsverzoek:

    • X-user-data: Bevat het object userData.

    • X-routing-data: Bevat het object routingData.

    userData en routingData zijn afzonderlijke objecten zodat u de gegevens gemakkelijk kunt scheiden als dat nodig is. U kunt er echter ook voor kiezen om alle benodigde gegevens slechts in één van de parameters op te geven, indien gewenst. U kunt ook alle gegevens in één enkele X-header verzenden als uw Studio-script hierop is geconfigureerd.

    Vanwege beperkingen op de grootte van de gegevens die in X-headers kunnen worden doorgegeven, mag de tekenlengte van elk userData- en routingData-object niet meer dan 1.000 tekens (1 KB) bedragen na tekenreeksconversie.

    Raadpleeg de volgende voorbeelden om het te configureren voor uw specifieke gebruiksscenario:

    • Zonder parameters door te geven:

      makeCall(contactAddress);

    • Alleen location passeren:

      makeCall(contactAddress, "US");

    • Passeren van location, userData en routingData:

      makeCall(contactAddress, "US", { name: "Elizabeth Bennet", age: 20 }, { skill: "sales" });

    • Alleen userData passeren:

      makeCall(contactAddress, undefined, { name: "John Doe", age: 30 }, undefined);

  9. Als u de methode makeCall() hebt geconfigureerd om de objecten userData of routingData te gebruiken, moet u de X-headergegevens verwerken in het script Studio dat is gekoppeld aan het Click-to-Call contactpuntClosed Het toegangspunt dat een inbound contact gebruikt om een interactie te starten, zoals een telefoonnummer of e-mailadres. met behulp van de volgende acties:

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

  11. Test uw configuratie om er zeker van te zijn dat deze oproepen succesvol kan initiëren en routeren.