更新时间:2025-03-05 GMT+08:00
开发样例:JS页面集成样例
|
环境要求 |
- |
|---|---|
|
引用库 |
jquery.js |
|
下载链接 |
index.html
<!DOCTYPE html>
<html>
<head>
<!-- 如果需要使用网页协同功能,需引入cobrowse.js,cobrowseCommon.js这两个js,其中ip:port需替换成实际云客服的ip和port,或者直接使用域名 -->
<script type="text/javascript" src="https://ip:port/service-cloud/resource.root/cobrowse/sdk/cobrowse.js"></script>
<script type="text/javascript" src="https://ip:port//service-cloud/webclient/chat_client/js/cobrowseCommon.js"></script>
<!-- 0.引入jquery组件 -->
<script type="text/javascript" src="jquery.js"></script>
</head>
<body>
<script>
// 1.定义变量,后续聊天框页面需要使用,详细参数说明请参见表1
const userId = "XXXXXXXX"; // 用户id(即为表中thirdUserId)
const userName = "XXXXXXXXXXX"; // 用户昵称(即为表中thirdUserName)
const tenantSpaceId ="XXXXXXXXXX"; // 租间id(tenant id)
const configId = "XXXXXXXXXXXXXXXXXX"; // 渠道id(wWEBchannelConfig id)
const locale = "zh"; // 语言,locale:[zh,en]
const $ContextPath = "https://ip:port/service-cloud"; //请求地址
// 2.构造请求参数
let serviceUrl = $ContextPath + "/webclient/chat_client/js/newThirdPartyClient.js?&t="+new Date().getTime();
let thirdUserData = {};
thirdUserData['thirdUserName'] = userName;
thirdUserData['thirdUserId'] = userId;
thirdUserData['tenantSpaceId'] = tenantSpaceId;
thirdUserData['channelConfigId'] = configId;
thirdUserData['locale'] = locale;
thirdUserData['timestamp'] = new Date().getTime(); // 时间戳
thirdUserData['secretKey'] = 'XXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX'; // 认证秘钥
getAuthorization(thirdUserData); // Authorization 签名
// 3.请求newThirdPartyClient.js
var request = $.ajax({
url: serviceUrl,
method: "POST",
data: JSON.stringify(thirdUserData),
xhrFields: { withCredentials: true },
success: function (data) {
// 4.创建script标签并运行newThirdPartyClient.js脚本
importScript(data);
},
error: function (XMLHttpRequest, textStatus) {
alert("unauthorized,validate failed")
}
});
// 5.在集成页面加载运行JS
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]);
// 根据参数获取authration签名
function getAuthorization(thirdUserData){
$.ajax({
url:"/webchat/authorizationService",
method:"post",
data:JSON.stringify(thirdUserData),
async:false,
success: function (data) {
thirdUserData['thirdPartAuthorization'] = data;
}
});
}
</script>
</body>
</html>
父主题: 开发集成页面