更新时间: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>
 
   父主题: 开发集成页面