更新时间:2024-03-05 GMT+08:00
JS代码实例
|
环境要求 |
-- |
|---|---|
|
引用库 |
jquery.js |
|
下载链接 |
index.html
<!DOCTYPE html>
<!--
Tutorial.
Check available devices.
-->
<html>
<head>
<title>Tutorial. Check devices</title>
<meta charset="UTF-8" />
<!--link rel="stylesheet" href="phone.css"-->
<!--link rel="icon" href="favicon.png"-->
</head>
<body>
<!-- Check that browser is not IE -->
<script>
var ua = window.navigator.userAgent;
if (ua.indexOf('MSIE ') > 0 || ua.indexOf('Trident/') > 0) {
alert("Internet Explorer is not supported. Please use Chrome or Firefox");
}
</script>
<!-- Phone script -->
<script src="js/jquery-1.8.0.js"></script>
<script>
// 当前demo写法需要引入jquery
// 创建script标签并运行脚本
var importScript = (function (oHead) {
function loadError(oError) {
throw new URIError("The script " + oError.target.src + " is not accessible.");
}
return function (sSrc, fOnload) {
var oScript = document.createElement("script");
oScript.type = "text\/javascript";
oScript.onerror = loadError;
if (fOnload) { oScript.onload = fOnload; }
oHead.appendChild(oScript);
oScript.innerHTML = sSrc;
}
})(document.head || document.getElementsByTagName("body")[0]);
//配置请求参数,access_token为鉴权信息,tenantSpaceId为租间id,userAccount为登录账号,请参见表1
var param = {
"access_token": "XXXXXXXXXXX",
"tenantSpaceId": "XXXXXXXXXX",
"userAccount": "XXXXXXXXXX"
}
//定义变量$aicc_ContextPath,必须定义名称为$aicc_ContextPath,内容为https://ip:port或域名/service-cloud/
const $aicc_ContextPath = "https://ip:port/service-cloud/";
//发起请求,请求云客服并传递data内容(access_token / tenantSpaceId / userAccount)
$.ajax({
type: "post",
data: JSON.stringify(param),
url: $aicc_ContextPath+"ccdesktop/pages/cc-bar/js/ccbarclient.js?t=" + Math.random(),
crossDomain: true,
xhrFields: {
withCredentials: true
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
},
success: function (data) {
//请求成功后执行js,云客服回传js,并动态生成接续条,目前暂不支持接续条样式和位置修改
importScript(data)
//以下为通过postmessage传递事件(座席状态)
var param = new Array;
param.push("AgentState_Busy");
param.push("AgentState_Work");
param.push("AgentState_Ready");
param.push("AgentEvent_TransOutResult");
var json = { name: "eventpost", param: param }
setTimeout(function(){ window.frames["ccbarclient"].postMessage(JSON.stringify(json), $aicc_ContextPath); }, 2000)
//设定每2秒都去云客服服务器检查最新的坐席状态
//如果出现window.frames["ccbarclient"]值报错,可以将对应检查时间“2000”适当设置更大一点,例如设置为3000,4000等。
//frames:ccbarclient, 是由 importScript 返回的data 动态生成的
window.listeners["eventpost"] = callback;
}
});
</script>
<!-- HTML components of simple GUI -->
<div id="status_line">
</div>
</body>
</html>
父主题: 开发集成页面