客服消息
<button open-type='contact'>联系客服<button>
我们只需要上面一行代码，即可在微信小程序里实现人工客服的服务。真的是非常的方便，但是我如果想要对接一个机器人客服怎么办呢？这就需要我们开启消息推送，将用户在客服会话中的消息转发到咱们自己的服务器地址中。
uniCloud云函数
这里我们使用uniCloud来完成，薅它的羊毛！
首先我们在支持uniCloud的uni-app里新建一个云函数，并且为其开启URL化，就是允许通过http的方式来请求。
然后我们复制这个路径，并填入下图中的URL(服务器地址)中
https://e0b75de1-90c7-4c11-9d12-a8bc84c4d081.bspapp.com/http/customerservice
要在云函数里接收客服消息推送
- 填写服务器配置
- 验证服务器地址的有效性
- 据接口文档实现业务逻辑，接收消息和事件
填写服务器配置
- Token（令牌）
根据提示输入
- EncodingAESKey
随机生成
- 加密方式
明文模式
- 数据格式
JSON
验证服务器地址的有效性
现在如果点提交，我们是通不过的，因为云函数里还没写代码。为了通过，我们先写这么一段
'use strict'; exports.main = async (event, context) => { return event.queryStringParameters.echostr; };
云函数修改后记得上传部署云函数，然后再点服务器配置中的提交按钮，验证就通过了。这里我们没有真正去校验签名，虽然可以通过，但有被伪造消息的风险。校验签名的事后面再说。
接收消息和事件
接下来所有的客服消息都会被提交给这个接口，我们在云函数中相应的做出处理即可。
通过http请求URL化后的云函数，get请求取参要通过queryStringParameters获取，post请求取参要通过body获取。
const receiveMsg = event.body?JSON.parse(event.body):null;
客服消息会有以下几种消息类型（MsgType）
- event
- text
- image
- miniprogrampage
比如用户在客服消息对话中发送文字信息时，会对服务器URL发起一次post请求，从请求body中我们可以获取到如下信息
{ "ToUserName": "toUser", "FromUserName": "fromUser", "CreateTime": 1482048670, "MsgType": "text", "Content": "this is a test", "MsgId": 1234567890123456 }
回复消息
现在我们只需要拿到这个content，交给机器人服务获取回复，再发送一条回复信息，用户就可以收到了。在uniCloud里我们这么写
if(receiveMsg.MsgType=="text"){ //对receiveMsg.text.content做处理 //处理结束后 const access_token = //调用回复用户消息的接口，需要先获取access_token const res = await uniCloud.httpclient.request("https://api.weixin.qq.com/cgi-bin/message/custom/send?access_token="+access_token,{ method:"POST", headers:{ "Content-Type":"application/json" }, dataType:"json", data:{ //你要回复的用户就是刚才发消息的用户，所以直接赋值为刚才收到消息体中的FromUserName即可 touser: receiveMsg.FromUserName, msgtype: 'text', text: { content: '收到', } } }); }
彩蛋！
在小程序里要展示掘金的文章还挺麻烦，webview肯定不行，因为业务域名操作不了的。拿到内容自己htmlParser的话，掘金里很多长文，估计自己解析也很麻烦。
那么利用这个客服消息，我们能怎么做呢？
掘金的两个接口
//获取文章列表 //https://api.juejin.cn/content_api/v1/article/query_list //获取文章详情 //https://api.juejin.cn/content_api/v1/article/detail
我的做法是这样的，先通过文章列表接口，在前端显示文章列表，文章列表项都用客服消息组件button来装载
回复Link类型消息
<button open-type="contact" :session-from="'jj_'+item.article_id" style="opacity: 0;width: 100%;height: 100%;position: absolute;z-index: 1;">button</button>
这里的关键是SessionFrom字段，当点击这个按钮进入客服消息会话时，服务器URL会接收到一个Event消息
if(receiveMsg.Event=="user_enter_tempsession"){ var sessionFrom = receiveMsg.SessionFrom; if(sessionFrom.indexOf("jj_")>=0){ //需要显示掘金文章jj_后为文章id var articleId = sessionFrom.substr(3); //获取掘金文章详情，用于拼接回复消息 const articleDetailRes = await uniCloud.httpclient.request("https://api.juejin.cn/content_api/v1/article/detail",{ data:{ "article_id":articleId }, method:"POST", headers:{ "Content-Type":"application/json" }, dataType:"json" }) const res = await sendCustomerServiceMessage({ touser:receiveMsg.FromUserName, msgtype:"link", link: { "title":articleDetailRes.data.data.article_info.title, "description":articleDetailRes.data.data.article_info.brief_content, "url": "https://juejin.cn/post/"+articleId, "thumb_url": articleDetailRes.data.data.article_info.cover_image } }); } }
*Tada！*完成啦！
后记
接下来我会发布一系列基于uniCloud的原创技术分享，感兴趣的朋友可以关注这个新的专题。
