小程序在线客服自动回复功效(node版)
前言
我们知道H5页面经常需要将用户导流到APP，通过下载安装包或者跳转至应用宝市场/Appstore等方式举行导流。然则由于小程序嵌套webview时需要校验域名，因此跳转到第三方应用市场和Appstroe无法实现导流。那怎么办呢? 只能说道高一尺魔高一丈，看看微博小程序是怎么导流的:
曲线救国的方式，行使小程序的在线功效可以打开H5的方式，去举行下载指导。 于是，就引出了这次文档的主题，小程序在线客服自动回复功效。
阅读本文档之前，最好已经领会过小程序客服信息官方的相关文档:
1.客服新闻使用指南
2.小程序客服新闻服务端接口
3.客服新闻开发文档
这次开发做在线客服功效也踩了不少坑，网上也查阅不少资料，但大部分的后台都是基于php或者python,java开发，node.js开发的较少，因此将这次开发的流程纪录一下，供人人参考，制止人人踩坑。可能会有一些错误地方迎接指正交流。 另外，我们用的node框架是基于koa自行封装的，在一些细节实现上和其他框架会有区别，不必纠结。
需求形貌
小程序中点按钮跳转在线客服界面，凭据关键词自动回复 客服回复判断条件，支持cms设置key，及 respond respond 支持设置以下类型，及回复内容:
type内容texttext=文本回复内容linktitle=题目 description=形貌 url=跳转链接 thumb_url=图片地址imageimageurl=图片地址
- 设置后用户需要精准匹配回复条件才可收到自动回复
- 可支持设置多个key，及对应respond
- 除了设置的key以外的回复，可设置默认的自动回复
开发流程
写个跳转客服的按钮吧
index.wxml
<button open-type="contact">转在线客服</button>
复制代码
后台设置
登录小程序后台后，在「开发」-「开发设置」-「新闻推送」中，管理员扫码启用新闻服务，填写服务器地址（URL）、令牌（Token） 和 新闻加密密钥（EncodingAESKey）等信息。
- URL服务器地址
URL: 开发者用来吸收微信新闻和事宜的接口 URL。开发者所填写的URL 必须以 http:// 或 https:// 开头，划分支持 80 端口和 443 端口。
务需要记着，服务器地址必须是线上地址，由于需要微信服务器去接见。localhost，IP，内网地址都不行的。
否则会提醒 ‘剖析失败，请检查信息是否填写准确’。
那么问题来了，差别的公司都有一套上线流程，总不能为了调试URL是否可用要上到线上去测试，成本太大，也不利便。
这就要引出内网穿透了，简朴来说就是设置一个线上域名，然则这个域名可以穿透到你设置的内陆开发地址上，这样可以利便你去调试看日志。 推荐一个可以实现内网穿透的工具。(非广告 )
小网络公司靠什么赚钱，互联网公司的盈利模式
NATAPP 详细不详细先容，省得广告嫌疑。
简朴说，NATAPP有免费和付费两种模式，免费的是域名不准时替换，对于微信的推送新闻设置一个月只有3次更改机遇来说，有点奢侈。不定什么时候设置的域名就不能接见，得重新设置。而付费的则是牢固域名，映射的内网地址也可以随时更改。楼主从免费切到付费模式，一个月的VIP使用也许十几块钱吧。
2.Token
Token自己随便写就行了，然则要记着它，由于你在接口中要用的。
3.EncodingAESKey
随机天生即可。
4.加密方式和数据花样
凭据自己喜欢选择，楼主选择的平安模式和JSON花样。 差别的模式和数据花样，在开发上会有差别，自己权衡。 既然这些设置都清晰，那最先码代码。
验证新闻简直来自微信服务器
设置提交前，需要把验证新闻来自微信服务器的接口写好。
server.js
/*
* https://developers.weixin.qq.com/miniprogram/dev/framework/server-ability/message-push.html
* 验证新闻简直来自微信服务器
* 开发者通过磨练 signature 对请求举行校验（下面有校验方式）。
* 若确认此次 GET 请求来自微信服务器，请原样返回 echostr 参数内容，
* 则接入生效，成为开发者乐成，否则接入失败。加密/校验流程如下：
* 将token、timestamp、nonce三个参数举行字典序排序
* 将三个参数字符串拼接成一个字符串举行sha1加密
* 开发者获得加密后的字符串可与signature对比，标识该请求来源于微信
*/
const crypto = require('crypto');
async wxCallbackAction(){
const ctx = this.ctx;
const method = ctx.method;
//微信服务器署名验证，确认请求来自微信
if(method === 'GET') {
// 1.获取微信服务器Get请求的参数 signature、timestamp、nonce、echostr
const {
signature,
timestamp,
nonce,
echostr
} = ctx.query;
// 2.将token、timestamp、nonce三个参数举行字典序排序
let array = ['yourToken', timestamp, nonce];
array.sort();
// 3.将三个参数字符串拼接成一个字符串举行sha1加密
const tempStr = array.join('');
const hashCode = crypto.createHash('sha1'); //建立加密类型
const resultCode = hashCode.update(tempStr, 'utf8').digest('hex');
// 4.开发者获得加密后的字符串可与signature对比，标识该请求来源于微信
if (resultCode === signature) {
console.log('验证乐成，新闻是从微信服务器转发过来');
return this.json(echostr);
}else {
console.log('验证失败！！！');
return this.json({
status: -1,
message: "验证失败"
});
}
}
}
复制代码
验证接口开发完毕，后台设置可以去点提交了。设置乐成会提醒如下:
吸收新闻和推送新闻
当用户在客服会话发送新闻、或由某些特定的用户操作引发事宜推送时，微信服务器会将新闻或事宜的数据包发送到开发者填写的 URL。开发者收到请求后可以使用 发送客服新闻 接口举行异步回复。
本文以吸收文本新闻为例开发:
server.js
const WXDecryptContact = require('./WXDecryptContact');
async wxCallbackAction(){
const ctx = this.ctx;
const method = ctx.method;
//吸收信息时为POST请求；(完整代码自行与上面验证时的合并即可)
if(method === 'POST'){
const { Encrypt } = ctx.request.body;
//设置时选的平安模式 因此需要解密
if(!Encrypt){
return this.json('success');
}
const decryptData = WXDecryptContact(Encrypt);
await this._handleWxMsg(decryptData);
return this.json('success');
}
}
//处置微信回调新闻的总入口 (只处置了文本类型，其他类型自行添加)
async _handleWxMsg(msgJson){
if(!msgJson){
return ;
}
const { MsgType } = msgJson;
if(MsgType === 'text'){
await this._sendTextMessage(msgJson);
}
}
//微信文本信息关键字自动回复
async _sendTextMessage(msgJson){
//获取CMS客服关键词回复设置
const result = await this.callService('cms.getDataByName', 'wxApplet.contact');
let keyWordObj = result.data || {};
//默认回复default
let options = keyWordObj.default;
for(let key in keyWordObj){
//查看是否掷中设置的关键词
if(msgJson.Content === key){
//CMS设置项
options = keyWordObj[key];
}
}
}
//获取access_token
const accessToken = await this._getAccessToken();
/*
* 先判断设置回复的新闻类型是不是image类型
* 若是是 则需要先通过 新增素材接口 上传图片文件获得 media_id
*/
let media_id = '';
if(options.type === 'image'){
//获取图片地址(相对路径)
let url = options.url;
const file = fs.createReadStream(url);
//挪用微信 uploadTempMedia接口 详细实现见 service.js
const mediaResult = await this.callService('wxApplet.uploadTempMedia',
{
access_token: accessToken,
type: 'image'
},
{
media: file
}
);
if(mediaResult.status === 0){
media_id = mediaResult.data.media_id;
}else {
//若是图片id获取失败 则按默认处置
options = keyWordObj.default;
}
}
//回复信息给用户
const sendMsgResult = await this.callService('wxApplet.sendMessageToCustomer',
{
access_token: accessToken,
touser: msgJson.FromUserName,
msgtype: options.type || 'text',
text: {
content: options.description || '',
},
link: options.type === "link" ?
{
title: options.title,
description: options.description,
url: options.url,
thumb_url: options.thumb_url
}
:
{},
image: {
media_id
}
}
);
}
复制代码
service.js
const request = require('request');
/*
* 获取CMS客服关键词回复设置
* 这个接口只是为了回去CMS设置的字段回复关键字设置 返回的data数据结构如下
*/
async contact(){
return {
data: {
"1": {
"type": "link",
"title": "点击下载[****]APP",
"description": "注册领取领***元注册红包礼",
"url": "https://m.renrendai.com/mo/***.html",
"thumb_url": "https://m.we.com/***/test.png"
},
"2": {
"url": "http://m.renrendai.com/cms/****/test.jpg",
"type": "image"
},
"3": {
"url": "/cms/***/test02.png",
"type": "image"
},
"default": {
"type": "text",
"description": "再见"
}
}
}
}
/*
* 把媒体文件上传到微信服务器。现在仅支持图片。用于发送客服新闻或被动回复用户新闻。
* https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/customer-message/customerServiceMessage.uploadTempMedia.html
*/
async uploadTempMedia(data,formData){
const url = `https://api.weixin.qq.com/cgi-bin/media/upload?access_token=${data.access_token}&type=${data.type}`;
return new Promise((resolve, reject) => {
request.post({url, formData: formData}, (err, response, body) => {
try{
const out = JSON.parse(body);
let result = {
data: out,
status: 0,
message: "ok"
}
return resolve(result);
}catch(err){
return reject({
status: -1,
message: err.message
});
}
});
}
}
/*
* 发送客服新闻给用户
* https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/customer-message/customerServiceMessage.send.html
*/
async sendMessageToCustomer(data){
const url = `https://api.weixin.qq.com/cgi-bin/message/custom/send?access_token=${data.access_token}`;
return new Promise((resolve, reject) => {
request.post({url, data}, (err, response, body) => {
...
});
}
}
复制代码
WXDecryptContact.js
新闻加密解密文档
const crypto = require('crypto'); // 加密模块
const decodePKCS7 = function (buff) {
let pad = buff[buff.length - 1];
if (pad < 1 || pad > 32) {
pad = 0;
}
return buff.slice(0, buff.length - pad);
};
// 微信转发客服新闻解密
const decryptContact = (key, iv, crypted) => {
const aesCipher = crypto.createDecipheriv('aes-256-cbc', key, iv);
aesCipher.setAutoPadding(false);
let decipheredBuff = Buffer.concat([aesCipher.update(crypted, 'base64'), aesCipher.final()]);
decipheredBuff = decodePKCS7(decipheredBuff);
const lenNetOrderCorpid = decipheredBuff.slice(16);
const msgLen = lenNetOrderCorpid.slice(0, 4).readUInt32BE(0);
const result = lenNetOrderCorpid.slice(4, msgLen + 4).toString();
return result;
};
// 解密微信返回给设置的新闻服务器的信息
const decryptWXContact = (wechatData) => {
if(!wechatData){
wechatData = '';
}
//EncodingAESKey 为后台设置时随机天生的
const key = Buffer.from(EncodingAESKey + '=', 'base64');
const iv = key.slice(0, 16);
const result = decryptContact(key, iv, wechatData);
const decryptedResult = JSON.parse(result);
console.log(decryptedResult);
return decryptedResult;
};
module.exports = decryptWXContact;
复制代码
总结
开发并不是一帆风顺的，也遇到了一些值得注意的坑，强调一下:
- 后台设置URL地址一定外网可接见(可以通过内网穿透解决)
- 文件上传接口uploadTempMedia media参数要用 FormData数据花样 (用node的request库很容易实现。urllib这个库有坑有坑 都是泪T_T)
- 切记吸收新闻岂论乐成失败都要返回success，否则纵然乐成吸收返回新闻，日志没有报错的情况下，照样泛起IOS提醒该小程序提供的服务泛起故障 请稍后再试。
本文来源于自互联网，不代表n5网立场，侵删。发布者：虚拟资源中心，转载请注明出处：https://www.n5w.com/134029.html
微信扫一扫 
