这是本文档旧的修订版!


微信小程序集成

概述

环信客服云支持微信小程序接入,绑定后您可以使用环信客服云统一接收与回复通过小程序咨询的消息。小程序属于微信渠道,小程序用户产生的会话消息将以微信渠道的形式在客服工作台进行展示和统计。

授权模式接入

步骤如下:

1、 登录环信客服云,进入“管理员模式 > 渠道管理 > 微信小程序”。

微信小程序1

2、 点击“添加微信小程序”。

微信小程序2

3、 选择“第三方平台授权(推荐)”。

微信小程序3

4、 点击“登录授权”,进入微信公众平台,扫描二维码授权第三方平台“环信移动客服”。

微信小程序4

5、 绑定成功。

开发者模式接入

集成步骤如下:

第1步:获取微信小程序的基本信息。

进入微信公众平台获取“小程序名称”、“原始ID”、“AppID”和“AppSecret”。

1. 进入“设置 > 基本设置”页面获取“小程序名称”和“原始ID”。

小程序基本设置页面

2. 进入“设置 > 开发设置”页面获取“AppID”和“AppSecret”。

小程序开发设置页面

第2步:在环信客服云添加微信小程序。

在环信客服云添加微信小程序,填写小程序的基本信息,生成服务器URL。

1. 进入“管理员模式 > 渠道管理 > 微信小程序”页面,点击“添加微信小程序”,并点击“小程序开发者授权”。

微信小程序2

2. 在“添加微信小程序”页面,填写小程序名称、原始ID、AppID、AppSecret,并点击下一步。

填写小程序的基本信息

3. 获取环信生成的服务器URL。

生成服务器URL

第3步:配置微信小程序的消息推送。

进入微信公众平台,配置微信小程序的消息推送。然后,将小程序的Token(令牌)和EncodingAESkey填入环信客服云,完成微信小程序的配置。

1. 进入微信公众平台的“设置 > 开发设置”页面,在“消息推送”区域,填入上一步生成的服务器URL,设置Token(令牌),并生成EncodingAESkey。

注意:选择消息加密方式为“安全模式”,数据格式为“XML”。

配置微信小程序的消息推送

2. 进入环信客服云,填写微信小程序的Token(令牌)和EncodingAESkey,并点击下一步,完成绑定微信小程序。

绑定微信小程序

第4步:在微信小程序上配置客服按钮。

在微信小程序的源码中添加如下代码,配置客服按钮。完成后,微信用户即可点击该按钮发起咨询。

<button open-type="contact" bindcontact="handleContact">客服</button>

基于微信小程序推出的新特性,客服端可以获取和展示微信用户的昵称和头像。如需获取和展示微信用户的昵称和头像,可在微信小程序的源码中添加如下代码。

<button open-type="contact" session-from='{"nickName":"{{userInfo.nickName}}","avatarUrl":"{{userInfo.avatarUrl}}"}'>联系客服</button>

注:

  1. 获取昵称和头像,需要首先获取小程序userInfo
  2. session-from字段传key:value形式的json字符串

注意:如需使用开发者模式访问微信小程序接口,为防止accessToken发生冲突(发生冲突时,客服系统可以收到访客的消息,但是访客收不到客服发送的消息),请调用环信提供的接口获取微信小程序accessToken。接口如下:

获取accessToken

根据tenanId,appId,secret从环信获取微信小程序的accessToken信息.

  • Path:http://kefu.easemob.com/v1/weixin/tenants/{tenantId}/xcx/accesstoken
  • HTTP Method:GET
  • Request Parameters:grant_type=client_credential&appid={appid}&secret={secret}
  • 可能的错误码:400(无效信息)。

Curl示例:

curl -X GET \
  'http://kefu.easemob.com/v1/weixin/tenants/20016/xcx/accesstoken?grant_type=client_credential&appid=wx676137238b282f12&secret=d036a38695bb6fe5d17d77ff8fa65f5c' \

参数说明:

名称类型是否非空(Y:是;N:否)说明
tenantIdintY租户ID
appId String Y小程序的appId
secret String Y小程序的secret

Response示例:

{
    "access_token": "19_9AUeL6YO4WGI99DU-SHWhxOPCpgniqdSmQVU7BHAR4J62DHP4QE7G6LOsg4xRiRLTFPH4ybxiXAjIrU2cDKcP3qWiWvbxAibJ1Aw7--sZ2S0rwgG6f4Ya5-WdV1D4c_c598vXvhXNU8QFxpHSWGbAJAAEO",
    "expires_in": 7200
}

参数说明:

名称类型说明
access_tokenString要获取的accessToken
expire_in int 到期时间,最大值为7200s

错误码说明:

错误码错误信息注释
400“invalid grant_type hint”.“invalid tenantId or appId or secret”.无效信息