外观
网页渠道接入设置
概述
配置网页插件并接入客户咨询会话。
开始之前
已准备网站页面和可执行前端代码部署的技术人员。
配置步骤
第一步：新增网页插件
纷享在线客服会在新增网页插件时，自动生成一段代码，企业可将该代码嵌入到自身的网页标签前，即可在网站上开放客户咨询的入口。也同时支持您对网页咨询入口和聊天框进行一些个性化的配置，如工作台的图标、按钮名称、按钮样式和窗口主题色。调整个性化配置信息后，您可在右侧预览窗口实时查看页面效果。
网页渠道关键能力特性如下：
- 自定义插件样式，适应客户网页风格，支持实时预览。
- 自动生成插件代码，复制粘贴即可嵌入指定网页。
- 嵌入网页的客服插件，支持文字、表情、图片、附件等常规功能。
- 每家企业支持同时接入多个网页。
- 客服插件同步兼容web端和移动端。
- 兼容无身份游客和有身份客户两种模式，场景示例：
- 无身份游客：网页访客未登陆状态时，发起在线咨询；如官网；
- 有身份客户：网页访客登陆后，发起在线咨询，且登陆账号与纷享系统做过接口数据映射；如在线商城中，登陆用户对应纷享系统中的客户数据。
网页插件接入效果如下图
网页插件接入效果
第二步：配置会话分配规则
在上一步骤中，会话的渠道入口已经配置完成，接下来需要配置会话分配规则，客户会话会按照设定好的分配规则，在客服分组和人员之间进行流转。配置路径为：线上客服->网页接入设置->会话分配规则。会话分配规则的主要设置项如下：
- 自定义设置会话分配规则的名称。
- 存在多个网页接入渠道时，可勾选该规则适用的网页渠道，此规则仅在选中的渠道中生效。
- 自定义设置接入欢迎语，在会话接入时，会主动发送欢迎语给客户。
- 推广语：会话接入后，可自动发送推广语，实现对客户的自动营销。
- 客服处理最大会话数：超过最大会话数后，该渠道的新会话将不会分配给该客服。
- 用户身份识别：开启身份识别后，用户需要验证互联身份后才会接入会话。
会话分配给客服分组的分配规则：有新会话需要分配到分组时，支持“规则分配”和“指定分组”两种会话分配方式
① 规则分配：可配置网页访客会话进入对应客服分组的条件。
- 全部网页访客：全部网页访客会话均可以进入到选择的客服分组。
- 按访客信息筛选：符合筛选的网页访客会话才可以进入到选择的客服分组。
- 按询前表单筛选：符合询前表单信息的的会话可以进入到指定分组。
- 对于未匹配到会话分配规则的会话，系统会自动分配该会话到兜底分组内。
② 指定分组：会话接入前，会推送提示语给用户，让用户选择服务分组，例如售前分组/售后分组。
组内会话分配规则：
- 负载分配，优先分配给实时会话数最少的客服人员；
- 循环分配，在所选客服分组包含的所有客服人员中按照顺序轮流分配；
- 空闲率分配，优先分配给当天接入的会话数最少的客服人员；
- 按客户负责人分配，用户发送的消息，可定向推送给相应客户的负责人；、
- 按联系人负责人分配，用户发送的消息，可定向推送给相应联系人的负责人。
注意：按联系人/客户负责人分配时，需提前将负责人维护在客服分组中；建议按部门添加，系统会根据部门成员变动，自动添加/移除相应人员。
在客服无法实时处理会话时，需要对客户进行提醒和情绪安抚。针对客服全忙、客服均不在线和客服均不在服务时间的情形，企业可自定义设置是否发送提示语，如果发送提示语，可设置提示语的内容。
客服全忙时，可开启留言功能，让用户先行留言，等客服人员空闲时，对留言进行处理。企业可自定义设置留言的模板，收集想要收集的留言信息。
第三步：配置用户信息收集
用户信息收集用于将网页访客的来源、搜索词和访问页面等信息随会话一并传入线上客服，帮助客服人员了解访客当前的咨询背景。
可通过网页插件的 script 参数或全局变量 FSImChatParams 配置相关信息。script 参数的优先级高于全局变量。
html
<script id="fs-im-script" type="text/javascript" src="https://crm.ceshi112.com/open/imchat/static/creat.js?webImId=2447060116862665016&autoOpen=3000"></script>
<script>
window.FSImChatParams = { webImId: '2447060116862665016', autoOpen: 3000, serviceSessionParams: {} }
</script>| 参数名称 | 说明 | 示例 |
|---|---|---|
autoOpen | 自动打开网页插件对话框的时间，单位为毫秒。取值大于 0 时生效。 | 10000 |
serviceSessionParams | 发送会话消息时附带的业务参数，可用于记录用户来源。 | 搜索词、关键词、来源网站、落地页、咨询页 |
在 serviceSessionParams 中，可按企业实际字段传入 search_word、key_word、source_website、landing_page 和 consult_page 等信息。
网页插件还提供以下方法和事件，便于自研网站按实际场景控制会话窗口并接收状态变化：
| 类型 | 名称 | 说明 |
|---|---|---|
| 方法 | openChatDialog | 打开网页插件对话框。 |
| 方法 | updateParams | 更新网页插件初始化参数。 |
| 事件订阅 | $on | 持续监听指定事件。 |
| 事件订阅 | $once | 仅监听一次指定事件。 |
| 事件订阅 | $off | 移除指定事件或全部事件处理函数。 |
可监听 IM_CHAT_READY 事件判断插件是否完成初始化；可监听 RECEIVE_MESSAGE 事件接收新消息数量。
第四步：配置第三方身份校验
网页渠道一般情况下都是在官网中使用，如果用户在官网中登录，则官网中会收集到客户的身份信息，如果企业需要在纷享内也准确识别出客户的信息，则可以开启身份检验功能，在客服插件代码中按要求传参，即可打通线上客服与第三方网页中的客户身份信息校验通道。
- 开发接入前配置步骤
1、生成身份校验密钥：点击“生成密钥”，即可生成密钥，页面刷新后，秘钥会掩码显示，可点击查看秘钥按钮重新查看密钥。
2、设置访客身份校验字段： 在纷享销客系统中，全部咨询用户存储在访客对象（对象apiname是“WebImVisitorObj”，为了从自研官网发起咨询的用户可以自动匹配到纷享销客系统中的访客用户，需要配置校验的字段，支持企业自定义身份校验字段，通常情况下，从自研官网将姓名+手机号，就能匹配到唯一的访客用户，如果没有匹配到，会根据传参数新建一条访客用户数据。
3、访客用户关联CRM客户和联系人：一般情况下，从线上客服咨询进入纷享系统的访客用户需要客服人员手动关联到crm客户和联系人，如果企业自研官网需要将发起咨询的用户与crm客户和联系人关联，可以将自研官网系统的用户信息导入到crm客户和联系人中，并启用“自动关联客户和联系人”，设置访客用户自动查询和匹配联系人的字段，根据匹配字段自动查询系统中已有联系人，访客自动关联联系人，请尽量按手机或姓名+手机联合查询即可。
- 身份校验开发接入说明 1、生成访客校验字段json字符串，示例参数如下： {"full_name":"张三","phone":"15912345678"} 2、使用身份校验生成的密钥，对访客校验字段json字符串使用AES算法进行加密，获取加密字符串A 3、将生产的字符串A追加到网页插件customParams参数
加密算法：AES 工作模式：ECB 填充方式：PKCS5Padding
加密示例代码（java）
public static String encrypt(String data, String key) {
try {
// 密钥转换
`SecretKey` `secretKey` = toKey(key);
byte[] `enCodeFormat` = `secretKey`.`getEncoded`();
`SecretKeySpec` k = new `SecretKeySpec`(`enCodeFormat`, "AES");
Cipher cipher = Cipher.`getInstance`("AES/ECB/PKCS5Padding");
cipher.init(Cipher.`ENCRYPT_MODE`, k);
byte[] `dataArray` = data.`getBytes`("utf-8");
byte[] encode = cipher.doFinal(`dataArray`);
// 密文转换
return `bytesToHexString`(encode);
} catch (Exception e) {
`LOGGER`.error("failed to encrypt, data={}, key={}", data, key, e);
return null;
}
}
private static `SecretKey` toKey(String key) throws Exception {
byte[] data = Base64.decodeBase64(key);
`SecretKey` `secretKey` = new `SecretKeySpec`(data, "AES");
return `secretKey`;
}
private static final String `bytesToHexString`(byte[] bArray) {
`StringBuffer` sb = new `StringBuffer`(bArray.length);
String sTemp;
for (int i = 0; i < bArray.length; i++) {
sTemp = Integer.`toHexString`(0xFF & bArray[i]);
if (sTemp.length() < 2)
sb.append(0);
sb.append(sTemp.`toUpperCase`());
}
return sb.toString();
}
第五步：配置用户聊天窗口
开启后，用户可在聊天窗口通过按钮快速发送商品/订单等系统单据信息给客服人员。
可在用户的聊天窗口添加快捷发送系统内单据的按钮，并以模板消息的形式发送给客服。用户可设置按钮名称、按钮图标、按钮可见角色、数据对象、数据筛选范围、消息发送模板。
注意：目前限制必须有互联角色才可见此按钮，且游客角色不可见。
预期结果与验证
- 在已部署网页插件的测试页面打开访客窗口。
- 填写询前信息并发送一条测试消息。
- 在 客服工作台 中确认产生对应会话，且会话按规则分配。
常见问题与故障排除
- 页面未显示插件时，检查部署代码、站点域名和插件启用状态。
- 会话未进入工作台时，检查渠道和会话分配规则。