# 核心代码简析
1. 引入所需的JS框架，在以下提供的样例中需要引入jQuery，参考版本为jQuery- v3.4.1，如果需要使用网页协同功能，请引入cobrowse.js和cobrowseCommon.js组件或发布插件给用户使用（插件开发参考3.1：cobrowse插件开发、使用指导），cobrowse.js和cobrowseCommon.js采用cdn方式引入，其中ip:port需替换成实际云客服的ip和port，或者直接使用域名，如：https://www.test.com/service-cloud/resource.root/cobrowse/sdk/cobrowse.js，引用代码示例如[图1]所示。
   
   图1JS框架引用示例   
   ![](https://support.huaweicloud.com/devg-weblite-cec/figure/zh-cn_image_0000001579575233.png)
   ![](https://support.huaweicloud.com/devg-weblite-cec/public_sys-resources/note_3.0-zh-cn.png)
   1、网页协同功能不支持打开新的页签后在新页签上进行协同操作。
   2、引入网页协同的cobrowse.js和cobrowseCommon.js组件时，第三方页面中包含多层iframe嵌套时，仅引入了js组件的iframe内可以进行网页协同，若该iframe存在父iframe框架，则无法在父iframe中进行网页协同操作）。
   
   
2. 请按照章节[开发Authorization签名生成机制](https://support.huaweicloud.com/devg-weblite-cec/cec_05_1223.html)在服务端生成Authorization签名。
3. 在企业自有系统前台通过ajax请求，获取服务端生成的Authorization签名。 
   ```
   function testAjax() {
        let timestamp = new Date().getTime();
        let serviceUrl = "authorizationService";
        let thirdUserData = {};
        thirdUserData['thirdUserName'] = userName;
        thirdUserData['thirdUserId'] = userId;
        thirdUserData['tenantSpaceId'] = tenantSpaceId; 
        thirdUserData['channelConfigId'] = configId;
        thirdUserData['locale'] = locale;
        thirdUserData['mapService'] = tencent; 
        thirdUserData['timestamp'] = timestamp;
        var request = $.ajax({
            url: serviceUrl,
            method: "POST",
            contentType: "application/json",
            data: JSON.stringify(thirdUserData),
        });
        request.done(function(message){
            if(message){
                thirdUserData['thirdPartAuthorization'] = message;
                thirdValidate(thirdUserData);
            }
            return  message;
        });
   ```
   
   
4. 获得签名后，用ajax请求需要集成的js脚本。 
   ```
   const $ContextPath = "https://ip:port/service-cloud"; 
   function thirdValidate(thirdUserData) {
     let timestamp = new Date().getTime();
     let serviceUrl = $ContextPath + "/webclient/chat_client/js/newThirdPartyClient.js?"+"&t=" + timestamp;
         var request = $.ajax({ 
            url: serviceUrl,
            method: "POST",
            data: JSON.stringify( ),
            crossDomain: true,
            dataType:"text",
            xhrFields: {withCredentials: true},
            error: function (XMLHttpRequest, textStatus, errorThrown)
                 { console.log(XMLHttpRequest.status); console.log(XMLHttpRequest.readyState); console.log(textStatus); },
            success: function (data) {
                importScript(data)
            }    
   });
   ```
   表1开发集成页面参数说明 
   | 参数名                    | 是否必填  | 说明                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                             |
   |:---|:---|:---|
   | $ContextPath           | True  | 实际域名。请将上述https://ip:port/换成云客服的公网域名。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           |
   | thirdPartAuthorization | True  | 企业生成的Authorization签名，与[2.5.1 - 步骤7](https://support.huaweicloud.com/devg-weblite-cec/cec_05_1223.html#ZH-CN_TOPIC_0000001182512271__li29261911152118)中签名保持一致。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                  |
   | tenantSpaceId          | True  | 租间ID，请在"配置中心 \> 系统管理 \> 租户信息"中查看。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                              |
   | thirdUserId            | True  | 企业用户ID。[2.5.1 - 步骤5](https://support.huaweicloud.com/devg-weblite-cec/cec_05_1223.html#ZH-CN_TOPIC_0000001182512271__li6219102815714)中的同名参数保持一致。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                               |
   | thirdUserName          | True  | 企业用户名。[2.5.1 - 步骤5](https://support.huaweicloud.com/devg-weblite-cec/cec_05_1223.html#ZH-CN_TOPIC_0000001182512271__li6219102815714)中的同名参数保持一致。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                |
   | channelConfigId        | True  | 渠道配置ID。完成[配置WEB渠道](https://support.huaweicloud.com/devg-weblite-cec/cec_05_1221.html#ZH-CN_TOPIC_0000002028133877__zh-cn_topic_0000001271522736_zh-cn_topic_0000001136272764_li13213101216131)后，请在"配置中心 \> 接入配置 \> 渠道配置"中查看。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                   |
   | locale                 | True  | 第三方租间语言信息。 - zh：中文  - en：英文  - ar：阿语  - es：西语  - pt：葡语  - fr：法语   |
   | timestamp              | True  | 时间戳。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                                           |
   | mapService             | False | 用户地图服务。 - tencent  - google   缺省值：tencent 说明： 腾讯地图暂不支持国外位置。                                                                                                                                                                                                                                                                                                                                                                                                                                                                                     |