Creating the iframe
<iframe src="https://yourInstance.ucontactcloud.com/uphone/" scrolling="no" allow="camera;microphone"> </iframe>
Event notifications
Messages will be sent to the parent page when these events occur:
For subscribing uPhone events, window proxy API will have to be used.
This is an example of how to subscribe to events from the page that has the iframe.
window.addEventListener('message', e =>{ console.log(e.data.action); console.log(e.data.params.number); });
Making a call
Receiving a call
Sent dispositions
Agent login
The information will be received in the following format
Make call
{ "action":"makeCall", "params":{ "number":1234 "campaign":"campaign->" } }
Receiving a call
{ "action":"gettingCall", "params":{ "number":1234 "campaign":"campaign->" } }
Finished call
{ "action": "finishedCall", "params": { "campaign": "Incoming<-", "clientId": "9999", "date": "2022-6-17 12:51:59", "direction": "incoming", "duration": "123", "guid": "6353dfa0-2a90-4d57-b145-1c3826cde381" } }
Sent dispositions
{ "action": "sentDispositions", "params":{ "campaign": "Incoming<-", "clientId": "9999", "date": "2022-6-17 12:51:59", "direction": "incoming", "dispositions": { "action": "NOACTION" "comment": "comment" "value1": "Venta" "value2": "" "value3": "" }, "duration": "123", "guid": "6353dfa0-2a90-4d57-b145-1c3826cde381" } }
Agent Login
{ "action": "agentLogin", "params":{ "id": "384", "name": "4444", "callerid": "4444", "fullname": "ccass_ucontact", } }
Execute actions
You can execute actions on uPhone by using the window proxy API.
//Get the iframe window var w = document.getElementsByTagName('iframe')[0].contentWindow; const call = { action: "makecall", params:{ number:1113, campaign: "campaign->" } }; //Send message w.postMessage(call, '*');
Here is an example of how to obtain the iframe window and sending to the uPhone.