差别
这里会显示出您选择的修订版和当前版本之间的差别。
两侧同时换到之前的修订记录 前一修订版 后一修订版 | 前一修订版 | ||
cs:connect-to-mini-program [2019/07/29 04:30] candywang [获取accessToken] |
cs:connect-to-mini-program [2022/01/27 06:26] (当前版本) xiaowei [开发者模式接入] |
||
---|---|---|---|
行 1: | 行 1: | ||
- | ====== 微信小程序集成 ====== | + | ====== 微信小程序接入 ====== |
===== 概述 ===== | ===== 概述 ===== | ||
行 37: | 行 37: | ||
1. 进入“设置 > 基本设置”页面获取“小程序名称”和“原始ID”。 | 1. 进入“设置 > 基本设置”页面获取“小程序名称”和“原始ID”。 | ||
- | {{:cs:300visitoraccess:30wechat:wechat-miniprogram4.png?nolink|小程序基本设置页面}} | + | {{ :cs:300visitoraccess:001.png?nolink&950 |}} |
- | 2. 进入“设置 > 开发设置”页面获取“AppID”和“AppSecret”。 | + | {{ :cs:300visitoraccess:002.png?nolink&950 |}} |
- | {{:cs:300visitoraccess:30wechat:wechat-miniprogram3.png?nolink|小程序开发设置页面}} | + | 2. 进入“开发-开发管理-开发设置”页面获取“AppID”和“AppSecret”。 |
+ | |||
+ | {{ :cs:300visitoraccess:003.png?nolink&950 |}} | ||
**第2步:在环信客服云添加微信小程序。** | **第2步:在环信客服云添加微信小程序。** | ||
行 63: | 行 65: | ||
进入微信公众平台,配置微信小程序的消息推送。然后,将小程序的Token(令牌)和EncodingAESkey填入环信客服云,完成微信小程序的配置。 | 进入微信公众平台,配置微信小程序的消息推送。然后,将小程序的Token(令牌)和EncodingAESkey填入环信客服云,完成微信小程序的配置。 | ||
- | 1. 进入微信公众平台的“设置 > 开发设置”页面,在“消息推送”区域,填入上一步生成的服务器URL,设置Token(令牌),并生成EncodingAESkey。 | + | 1. 进入微信公众平台的“开发-开发管理-开发设置”页面,在“消息推送”区域,填入上一步生成的服务器URL,设置Token(令牌),并生成EncodingAESkey。 |
<WRAP round tip> | <WRAP round tip> | ||
行 83: | 行 85: | ||
<button open-type="contact" bindcontact="handleContact">客服</button> | <button open-type="contact" bindcontact="handleContact">客服</button> | ||
</code> | </code> | ||
+ | |||
+ | 基于微信小程序推出的新特性,客服端可以获取和展示微信用户的昵称和头像以及其他属性信息。如需获取和展示微信用户的昵称和头像以及其他信息,可在微信小程序的源码中添加如下代码。 | ||
+ | |||
+ | <code> | ||
+ | <button open-type="contact" session-from='{"nickName":"{{userInfo.nickName}}","avatarUrl":"{{userInfo.avatarUrl}}","trueName":"李小环","phone":"186158282828","qq":"88888888","weixin":"lixiaohuan","email":"huan@163.com","companyName":"环信","description":"精品美妆店铺\n会员id:55555\n购买产品:护肤霜"}'>联系客服</button> | ||
+ | </code> | ||
+ | |||
+ | 注: | ||
+ | - 获取昵称和头像,需要首先获取小程序userInfo | ||
+ | - nickName不允许为空 | ||
+ | - session-from字段传key:value形式的json字符串 | ||
+ | 3. 参数说明: | ||
+ | ^名称^类型^说明^ | ||
+ | |trueName| String |姓名| | ||
+ | |phone| String |手机| | ||
+ | |qq|String|QQ号| | ||
+ | |weixin| String |微信号| | ||
+ | |email| String |邮箱| | ||
+ | |companyName|String|公司| | ||
+ | |description|String|描述,可传递访客来源属性等,如:店铺及商品信息或店铺及订单信息| | ||
+ | |||
+ | |||
+ | **新增 String routingRuleFlag 业务标识路由** | ||
+ | |||
+ | 在路由时,如会话中带业务标识(EXT扩展字段),则查询是否有绑定的技能组或客服,有绑定技能组则走指定;如没有带业务标识或没查到绑定技能组,则按照会话分配规则走。 | ||
+ | |||
+ | <code> | ||
+ | <button open-type="contact" session-from='{"nickName":"{{userInfo.nickName}}","avatarUrl":"{{userInfo.avatarUrl}}","trueName":"李小环","phone":"186158282828","qq":"88888888","weixin":"lixiaohuan","email":"huan@163.com","companyName":"环信","description":"精品美妆店铺\n会员id:55555\n购买产品:护肤霜","routingRuleFlag": "业务路由标识"}'>联系客服</button> | ||
+ | </code> | ||
+ | |||
+ | ====获取accessToken ==== | ||
<WRAP round tip> | <WRAP round tip> | ||
- | 注意:如需使用开发者模式访问微信小程序接口,为防止accessToken发生冲突,请调用环信提供的接口获取微信小程序accessToken。接口如下: | + | 注意:如需使用开发者模式访问微信小程序接口,为防止accessToken发生冲突(发生冲突时,客服系统可以收到访客的消息,但是访客收不到客服发送的消息),请调用环信提供的接口获取微信小程序accessToken。接口如下: |
</WRAP> | </WRAP> | ||
- | ====获取accessToken ==== | ||
根据tenanId,appId,secret从环信获取微信小程序的accessToken信息. | 根据tenanId,appId,secret从环信获取微信小程序的accessToken信息. | ||
行 94: | 行 126: | ||
* HTTP Method:GET | * HTTP Method:GET | ||
* Request Parameters:grant_type=client_credential&appid={appid}&secret={secret} | * Request Parameters:grant_type=client_credential&appid={appid}&secret={secret} | ||
- | * 可能的错误码:400(无效信息)。详见:[[#错误码说明|错误码说明]] | + | * 可能的错误码:400(无效信息)。 |
Curl示例: | Curl示例: | ||
行 125: | 行 157: | ||
^错误码^错误信息^注释^ | ^错误码^错误信息^注释^ | ||
|400|“invalid grant_type hint”.“invalid tenantId or appId or secret”.|无效信息| | |400|“invalid grant_type hint”.“invalid tenantId or appId or secret”.|无效信息| | ||
+ | ===== H5网页接入 ===== | ||
+ | |||
+ | |||
+ | 使用H5集成环信网页访客端,需要小程序注册类型为非个人类型或非海外类型,个人类型与海外类型的小程序暂不支持使用。 | ||
+ | |||
+ | 步骤如下: | ||
+ | |||
+ | 1、登录小程序后台“开发管理>开发设置>业务域名”,下载“校验文件”,并提供该原始文件、域名与租户ID给环信。 | ||
+ | |||
+ | {{:cs:300visitoraccess:业务域名.png?400|}} | ||
+ | \\ 注: | ||
+ | \\ 域名配置使用网页访客端的对应客服系统二级域名或客户集成网站,如:leoli.kefu.easemob.com;xxx.com。 | ||
+ | |||
+ | \\ 2、登录小程序后台“开发管理>开发设置>业务域名”,配置使用网页访客端的对应客服系统二级域名或客户集成网站。 | ||
+ | |||
+ | \\ 3、在小程序web_view中使用即可。 | ||
+ | |||
+ | ===== 小程序视频客服支持同步客户信息 ===== | ||
+ | |||
+ | 客户通过小程序视频联系客服时,支持自动同步客户信息。客服接待时能第一时间了解客户情况,进一步提升服务效率。集成方式如下: | ||
+ | |||
+ | 第一步 在globalData 里增加visitor字段,建议传ID,名称会变 | ||
+ | |||
+ | {{:cs:releasenote:图片007.png?nolink&600|}} | ||
+ | |||
+ | 第二步 在小程序视频demo的index文件里增加相关代码 | ||
+ | |||
+ | {{:cs:releasenote:图片008.png?nolink&600|}} | ||
+ | |||
+ | ===== 支持指定技能组、 指定客服===== | ||
+ | |||
+ | 第一步 在在globalData 里增加字段 | ||
+ | |||
+ | {{:cs:增加字段.jpg?nolink&600|}} | ||
+ | |||
+ | 第二步 在小程序视频demo的index文件里增加相关代码 | ||
+ | |||
+ | {{:cs:增加相关代码.jpg?nolink&600|}} | ||
+ | |||
+ | ===== 后续操作 ===== | ||
+ | |||
+ | 更多操作请参考[[cs:300visitoraccess:mini-program|微信小程序集成]] |