差别
这里会显示出您选择的修订版和当前版本之间的差别。
两侧同时换到之前的修订记录 前一修订版 | |||
cs:300visitoraccess:20webplugin [2018/05/11 11:40] huangqian |
cs:300visitoraccess:20webplugin [2019/02/25 10:22] (当前版本) liulj |
||
---|---|---|---|
行 1: | 行 1: | ||
====== 网页渠道集成(旧版) ====== | ====== 网页渠道集成(旧版) ====== | ||
- | 可以通过以下两种方式,实现网页渠道与环信客户互动云的对接: | + | 可以通过以下两种方式,实现网页渠道与环信客服云的对接: |
* [[cs:300visitoraccess:20webplugin#引用标准版本_集成聊天窗口|引用标准版本]]:引用线上 web 插件,在桌面网站植入聊天窗口并提供 H5 网页,让访客与客服聊天; | * [[cs:300visitoraccess:20webplugin#引用标准版本_集成聊天窗口|引用标准版本]]:引用线上 web 插件,在桌面网站植入聊天窗口并提供 H5 网页,让访客与客服聊天; | ||
行 13: | 行 13: | ||
===== 前提条件 ===== | ===== 前提条件 ===== | ||
- | Web 插件依赖环信客户互动云中的APP关联收发消息。 | + | Web 插件依赖环信客服云中的APP关联收发消息。 |
- | * 对于在kefu.easemob.com注册的用户:环信已为您创建了一个隐藏的“体验关联”,直接在您的网页添加JS代码,就可以实现与客户互动云对接。 | + | * 对于在kefu.easemob.com注册的用户:环信已为您创建了一个隐藏的“体验关联”,直接在您的网页添加JS代码,就可以实现与客服云对接。 |
- | * 对于其他用户(多租户系统的用户):请您登录环信客户互动云后,选择“管理员模式 > 渠道管理 > 手机APP”,在该页面依次点击“添加APP关联”和“快速创建”,环信将为您创建一个APP关联。该关联可以作为网页访客端收发消息的通道,也可用于APP渠道集成。 | + | * 对于其他用户(多租户系统的用户):请您登录环信客服云后,选择“管理员模式 > 渠道管理 > 手机APP”,在该页面依次点击“添加APP关联”和“快速创建”,环信将为您创建一个APP关联。该关联可以作为网页访客端收发消息的通道,也可用于APP渠道集成。 |
===== 快速集成 ===== | ===== 快速集成 ===== | ||
行 59: | 行 59: | ||
集成后,在桌面网页点击“联系客服”按钮,可以打开聊天窗口与客服聊天,窗口内默认按钮和会话状态如下图所示。 | 集成后,在桌面网页点击“联系客服”按钮,可以打开聊天窗口与客服聊天,窗口内默认按钮和会话状态如下图所示。 | ||
- | 您可以通过参数[[cs:300visitoraccess:20webplugin#引用标准版本_集成聊天窗口|设置]]是否显示“留言”等按钮及其他个性化设置;还可以登录环信客户互动云,在“管理员模式 > 渠道管理 > 网页”页面设置聊天窗口的主题颜色、信息栏内容、以及企业形象展示(在客户互动云设置的主题颜色等对聊天窗口和H5网页同时生效)。 | + | 您可以通过参数[[cs:300visitoraccess:20webplugin#引用标准版本_集成聊天窗口|设置]]是否显示“留言”等按钮及其他个性化设置;还可以登录环信客服云,在“管理员模式 > 渠道管理 > 网页”页面设置聊天窗口的主题颜色、信息栏内容、以及企业形象展示(在客服云设置的主题颜色等对聊天窗口和H5网页同时生效)。 |
{{:cs:300visitoraccess:access-web6.png?nolink|聊天窗口}} | {{:cs:300visitoraccess:access-web6.png?nolink|聊天窗口}} | ||
行 72: | 行 72: | ||
打开该H5网页后可以与客服聊天,窗口内默认按钮和会话状态如下图所示。 | 打开该H5网页后可以与客服聊天,窗口内默认按钮和会话状态如下图所示。 | ||
- | 您可以通过参数[[cs:300visitoraccess:20webplugin#引用标准版本_集成h5网页|设置]]是否显示“留言”等按钮及其他个性化设置;还可以登录环信客户互动云,在“管理员模式 > 渠道管理 > 网页”页面设置聊天窗口的主题颜色、信息栏内容、以及企业形象展示(在客户互动云设置的主题颜色等对聊天窗口和H5网页同时生效)。 | + | 您可以通过参数[[cs:300visitoraccess:20webplugin#引用标准版本_集成h5网页|设置]]是否显示“留言”等按钮及其他个性化设置;还可以登录环信客服云,在“管理员模式 > 渠道管理 > 网页”页面设置聊天窗口的主题颜色、信息栏内容、以及企业形象展示(在客服云设置的主题颜色等对聊天窗口和H5网页同时生效)。 |
{{:cs:300visitoraccess:access-web5.png?nolink|H5网页}} | {{:cs:300visitoraccess:access-web5.png?nolink|H5网页}} | ||
行 131: | 行 131: | ||
</code> | </code> | ||
- | 方式二:登录环信客户互动云,选择“管理员模式 > 渠道管理 > 网页”,将页面内的代码拷贝到</body>标签之前。 | + | 方式二:登录环信客服云,选择“管理员模式 > 渠道管理 > 网页”,将页面内的代码拷贝到</body>标签之前。 |
==== 自定义“联系客服”按钮 ==== | ==== 自定义“联系客服”按钮 ==== | ||
行 189: | 行 189: | ||
==== 指定技能组 ==== | ==== 指定技能组 ==== | ||
- | 对于随机访客,只需添加 emgroup 参数,并将技能组名称赋值给 emgroup 即可;如需绑定自己的用户,需要在环信客户互动云管理员面板使用相同 AppKey 创建多个关联,并使用关联绑定技能组功能。 | + | 对于随机访客,只需添加 emgroup 参数,并将技能组名称赋值给 emgroup 即可;如需绑定自己的用户,需要在环信客服云管理员面板使用相同 AppKey 创建多个关联,并使用关联绑定技能组功能。 |
参照下面的示例,在 A 标签中设置 emgroup 参数的值为“技能组名称”,该技能组名称须和客服系统设置的技能组名称完全一致,中英文均可(确保 tenantId 为自己的)。 | 参照下面的示例,在 A 标签中设置 emgroup 参数的值为“技能组名称”,该技能组名称须和客服系统设置的技能组名称完全一致,中英文均可(确保 tenantId 为自己的)。 | ||
行 215: | 行 215: | ||
==== 指定关联 ==== | ==== 指定关联 ==== | ||
- | 默认情况下,Web渠道通过租户下的“体验关联”收发消息,无需在代码中指定该“体验关联”。如果您在客户互动云的“管理员模式 > 渠道管理 > 手机APP”页面创建了一个“快速创建的关联”,或者绑定了一个您在环信即时通讯云后台(console.easemob.com)创建的应用,您可以将“联系客服”按钮指定到您自己的关联,这样,点击该按钮咨询客服的访客的消息均通过该关联连接客服系统。将按钮指定某个关联,需要配置参数:to 和 appKey。 | + | 默认情况下,Web渠道通过租户下的“体验关联”收发消息,无需在代码中指定该“体验关联”。如果您在客服云的“管理员模式 > 渠道管理 > 手机APP”页面创建了一个“快速创建的关联”,或者绑定了一个您在环信即时通讯云后台(console.easemob.com)创建的应用,您可以将“联系客服”按钮指定到您自己的关联,这样,点击该按钮咨询客服的访客的消息均通过该关联连接客服系统。将按钮指定某个关联,需要配置参数:to 和 appKey。 |
配置示例: | 配置示例: | ||
行 346: | 行 346: | ||
参考环信服务器端[[http://docs.easemob.com/im/100serverintegration/20users|用户体系集成]],获取环信后台 username 和 password,写入 easemobIM.config.user 完成集成指定用户。 | 参考环信服务器端[[http://docs.easemob.com/im/100serverintegration/20users|用户体系集成]],获取环信后台 username 和 password,写入 easemobIM.config.user 完成集成指定用户。 | ||
- | 注:集成用户体系前,需要[[#指定关联|指定关联]],并且在客户互动云的“管理员模式 > 渠道管理 > 手机APP”页面绑定该AppKey。 | + | 注:集成用户体系前,需要[[#指定关联|指定关联]],并且在客服云的“管理员模式 > 渠道管理 > 手机APP”页面绑定该AppKey。 |
配置示例: | 配置示例: | ||
行 434: | 行 434: | ||
==== 自动上报客户信息 ==== | ==== 自动上报客户信息 ==== | ||
- | 可以在 easemobim.config 方法下配置 eventCollector 为 true,以便用户访问网站时自动上报访客信息给环信客户互动云(客服端)。客服端收到上报的访客信息后,在“待接入”列表展示访客信息,客服可以主动发起会话。 | + | 可以在 easemobim.config 方法下配置 eventCollector 为 true,以便用户访问网站时自动上报访客信息给环信客服云(客服端)。客服端收到上报的访客信息后,在“待接入”列表展示访客信息,客服可以主动发起会话。 |
限制条件: | 限制条件: | ||
行 566: | 行 566: | ||
==== 指定关联 ==== | ==== 指定关联 ==== | ||
- | 默认情况下,Web渠道通过租户下的“体验关联”收发消息,无需在代码中指定该“体验关联”。如果您在客户互动云的“管理员模式 > 渠道管理 > 手机APP”页面创建了一个“快速创建的关联”,或者绑定了一个您在环信即时通讯云后台(console.easemob.com)创建的应用,您可以将“联系客服”按钮指定到您自己的关联,这样,点击该按钮咨询客服的访客的消息均通过该关联连接客服系统。将按钮指定某个关联,需要配置参数:to 和 appKey。 | + | 默认情况下,Web渠道通过租户下的“体验关联”收发消息,无需在代码中指定该“体验关联”。如果您在客服云的“管理员模式 > 渠道管理 > 手机APP”页面创建了一个“快速创建的关联”,或者绑定了一个您在环信即时通讯云后台(console.easemob.com)创建的应用,您可以将“联系客服”按钮指定到您自己的关联,这样,点击该按钮咨询客服的访客的消息均通过该关联连接客服系统。将按钮指定某个关联,需要配置参数:to 和 appKey。 |
参数说明如下: | 参数说明如下: | ||
行 633: | 行 633: | ||
<code http>https://kefu.easemob.com/webim/im.html?tenantId=0000&wechatAuth=true&appid=wx1e7ed77036581061</code> | <code http>https://kefu.easemob.com/webim/im.html?tenantId=0000&wechatAuth=true&appid=wx1e7ed77036581061</code> | ||
- | 注意:当您配置wechatAuth和appid这两个参数时,还需要在客户互动云的“管理员模式 > 渠道管理 > 微信”页面通过授权的方式绑定您的微信公众号。 | + | 注意:当您配置wechatAuth和appid这两个参数时,还需要在客服云的“管理员模式 > 渠道管理 > 微信”页面通过授权的方式绑定您的微信公众号。 |
===== 定制开发模式 ===== | ===== 定制开发模式 ===== | ||
行 680: | 行 680: | ||
//租户id | //租户id | ||
tenantId: '', | tenantId: '', | ||
- | //环信客户互动云域,固定值,请按照示例配置 | + | //环信客服云域,固定值,请按照示例配置 |
domain: '//kefu.easemob.com', | domain: '//kefu.easemob.com', | ||
//您网站上im.html文件的完整路径 | //您网站上im.html文件的完整路径 | ||
行 699: | 行 699: | ||
^参数^类型^必选^描述^桌面网页是否支持^移动端网页是否支持^ | ^参数^类型^必选^描述^桌面网页是否支持^移动端网页是否支持^ | ||
|tenantId|String|是|租户id(注意:tenantId中I大写)|是|是| | |tenantId|String|是|租户id(注意:tenantId中I大写)|是|是| | ||
- | |domain|String|是|环信客户互动云域,必须配置为'%%//%%kefu.easemob.com'|是|是| | + | |domain|String|是|环信客服云域,必须配置为'%%//%%kefu.easemob.com'|是|是| |
|path|String|是|im.html的本机服务器路径,例如:'%%//%%XXX'|是|是| | |path|String|是|im.html的本机服务器路径,例如:'%%//%%XXX'|是|是| | ||
|staticPath|String|是|访客插件static的路径,例如:'%%//%%XXX/static'|是|是| | |staticPath|String|是|访客插件static的路径,例如:'%%//%%XXX/static'|是|是| | ||
行 742: | 行 742: | ||
//租户id | //租户id | ||
tenantId: '', | tenantId: '', | ||
- | //环信客户互动云域,固定值,请按照示例配置 | + | //环信客服云域,固定值,请按照示例配置 |
domain: '//kefu.easemob.com', | domain: '//kefu.easemob.com', | ||
//您网站上im.html文件的完整路径 | //您网站上im.html文件的完整路径 | ||
行 766: | 行 766: | ||
注:使用浏览器打开网址后,右键点击页面,并选择“查看源代码”即可查看详细配置信息。 | 注:使用浏览器打开网址后,右键点击页面,并选择“查看源代码”即可查看详细配置信息。 | ||
- | |||