Node.js+Koa开发微信公众号个人笔记(二)响应事件
微信公众号中的事件有订阅事件/扫码事件/点击事件/跳转链接事件等等,具体可以查阅文档。
这里来实现一下订阅事件,其他的事件的实现过程也都类似。
当有人订阅了公众号后,微信服务器会向我们的服务器推送一个事件,这个事件是XML格式的数据包。
一、我们在index路由下实现post事件的响应。
可以理解为当微信向我们的服务器推送消息时,消息就会先走到这里。
/routes/index.js加入:
router.post('/', index_middleware.post(config.wechat));
二、实现index_middleware中的post方法:
就是我们该如何处理微信服务器给我们的服务器的post请求。
大致过程是先把微信服务器发来的数据包接收到,然后解析这个XML数据包,然后根据接收来的数据,在我们服务器上进行逻辑处理后形成一个XML格式的回复消息。
/wechat/index_middleware.js加入:
exports.post = function(opts) {
return function *(next) {
var token = opts.token;
var signature = this.query.signature;
var nonce = this.query.nonce;
var timestamp = this.query.timestamp;
var echostr = this.query.echostr;
var str = [token, timestamp, nonce].sort().join('');
var sha = sha1(str);
if (sha !== signature) {
this.body = 'wrong';
return false;
}
var data = yield getRawBody(this.req, {
length: this.length,
limit: '1mb',
encoding: this.charset
});
var message = yield util.parseXMLAsync(data);
var xml = yield autoReply(message.xml, wechat);
console.log(message);
console.log(xml);
this.status = 200;
this.type = 'application/xml';
this.body = xml;
};
};
这里的data就是我们接收到的数据包,使用了raw-body这个组件。同时使用了util这个工具函数和autoReply这个自定义的函数。
因此在/wechat/index_middleware.js中需要加入以下代码:
var getRawBody = require('raw-body');
var util = require('./util');
var autoReply = require('./autoReply');
三、实现util工具函数中的parseXMLAsync方法,它的作用是异步地将xml格式化为json数据。
/wechat/util.js:
var fs = require('fs');
var xml2js = require('xml2js');
exports.parseXMLAsync = function(xml) {
return new Promise(function(resolve, reject) {
xml2js.parseString(xml, {
trim: true,
explicitArray: false
}, function(err, content) {
if (err) {
reject(err);
}
resolve(content);
});
});
};
这里用到了xml2js这个组件。
四、实现autoReply函数,它的作用是将微信服务器发来的数据包进行逻辑处理,形成我们需要发送给微信的XML格式数据。
/wechat/autoReply.js:
var createXML = require('./createXML');
function autoReply(message, wechat) {
if (message.MsgType === 'event') {
if (message.Event === 'subscribe') {
if (message.EventKey) {
console.log('扫码进入');
}
var now = new Date().getTime();
return Promise.resolve(createXML({
ToUserName: message.FromUserName,
FromUserName: message.ToUserName,
MsgType: 'text',
Content: 'Hello!!'
}));
}else if (message.Event === 'unsubscribe') {
console.log('取关');
return Promise.resolve('');
}
}
}
这里只实现了关注和取关的事件,同时用到了createXML函数,它的作用是将数据封装成xml格式:
/wechat/createXML.js:
function createXML(messageObj) {
var { ToUserName, FromUserName, MsgType = 'text'} = messageObj;
var CreateTime = new Date().getTime();
var header = `<xml>
<ToUserName><![CDATA[${ToUserName}]]></ToUserName>
<FromUserName><![CDATA[${FromUserName}]]></FromUserName>
<CreateTime>${CreateTime}</CreateTime>
<MsgType><![CDATA[${MsgType}]]></MsgType>`;
var content = '';
switch(MsgType) {
case 'text':
var { Content } = messageObj;
content = `<Content><![CDATA[${Content}]]></Content>
</xml>`;
break;
case 'image':
var { MediaId } = messageObj;
content = `<Image>
<MediaId><![CDATA[${MediaId}]]></MediaId>
</Image>
</xml>`;
break;
case 'voice':
var { MediaId } = messageObj;
content = `<Voice>
<MediaId><![CDATA[${MediaId}]]></MediaId>
</Voice>
</xml>`;
break;
case 'video':
var { MediaId, Title, Description } = messageObj;
content = `<Video>
<MediaId><![CDATA[${MediaId}]]></MediaId>
<Title><![CDATA[${Title}]]></Title>
<Description><![CDATA[${Description}]]></Description>
</Video>
</xml>`;
break;
case 'music':
var { Title, Description, MusicUrl, HQMusicUrl, ThumbMediaId } = messageObj;
content = `<Music>
<Title><![CDATA[${Title}]]></Title>
<Description><![CDATA[${Description}]]></Description>
<MusicUrl><![CDATA[${MusicUrl}]]></MusicUrl>
<HQMusicUrl><![CDATA[${HQMusicUrl}]]></HQMusicUrl>
<ThumbMediaId><![CDATA[${ThumbMediaId}]]></ThumbMediaId>
</Music>
</xml>`;
break;
case 'news':
var { Articles } = messageObj;
var ArticleCount = Articles.length;
content = `<ArticleCount>${ArticleCount}</ArticleCount><Articles>`;
for (var i = 0; i < ArticleCount; i++) {
content += `<item>
<Title><![CDATA[${Articles[i].Title}]]></Title>
<Description><![CDATA[${Articles[i].Description}]]></Description>
<PicUrl><![CDATA[${Articles[i].PicUrl}]]></PicUrl>
<Url><![CDATA[${Articles[i].Url}]]></Url>
</item>`;
}
content += '</Articles></xml>';
break;
default:
content = `<Content><![CDATA[Error]]></Content>
</xml>`;
}
var xml = header + content;
return xml;
}
module.exports = createXML;
完成以上工作以后,启动我们的服务器,再次关注公众号,应该能收到一条Hello!!的信息。
这样就实现了对关注事件的处理。
Node.js+Koa开发微信公众号个人笔记(二)响应事件的更多相关文章
- Node.js+Koa开发微信公众号个人笔记(一)准备工作
本人也是在学习过程中,所以文章只作为学习笔记,如果能帮到你,那就更好啦~当然也难免会有错误,请不吝指出~ 一.准备工作 1.本人学习教程:慕课网Scott老师的<Node.js七天搞定微信公众号 ...
- Node.js+Koa开发微信公众号个人笔记(三)响应文本
响应输入文本和响应事件类似,首先对微信服务器发送来的数据的MsgType进行处理,如果是text,说明是文本,接下来可以对文本内容进行处理,比如用户输入了1,可以给用户回复一个文本或者图文或者视频等信 ...
- vue+node.js+webpack开发微信公众号功能填坑——v -for循环
页面整体框架实现,实现小功能,循环出数据,整体代码是上一篇 vue+node.js+webpack开发微信公众号功能填坑--组件按需引入 修改部门代码 app.vue <yd-flexbox&g ...
- vue+node.js+webpack开发微信公众号功能填坑——组件按需引入
初次开发微信公众号,整体框架是经理搭建,小喽喽只是实现部分功能,整体页面效果 整个页面使用两个组件:布局 FlexBox,搜索框 Search,demo文档 http://vue.ydui.org/d ...
- C#开发微信公众号-学习笔记
由于最近要做微信服务号的开发,所以开始找相关说明和接口文档开始学,故把学习过程及注意事项记录一下,帮助想学习的快速上手.废话不多少了,直接上干货! 1.申请微信公众号 这个就不需要多说了吧,大家直接照 ...
- 使用vue开发微信公众号下SPA站点的填坑之旅
原文发表于本人博客,点击进入使用vue开发微信公众号下SPA站点的填坑之旅 本文为我创业过程中,开发项目的填坑之旅.作为一个技术宅男,我的项目是做一个微信公众号,前后端全部自己搞定,不浪费国家一分钱^ ...
- Vue开发微信公众号默认背景为灰色
最近公司有一个项目,使用Vue开发微信公众号,开发过程遇到一个问题,即设计图的整体背景是白色的,但是公众号里默认的背景是浅灰色,如果某个页面高度没能占满一屏,就会露出浅灰色的默认背景,会显得很不协调. ...
- vux+vuex+vue+Es6开发微信公众号的坑
初次开发微信公众号遇到很多问题,可能是基础不怎么牢靠,最近几天一直在看vue的东西,现在就来慢慢介绍vux和vue这个骚东西的用法: 细看文档一步步来, npm install vux --save ...
- vue开发微信公众号--开发准备
由于工作项目的原因,需要使用vue开发微信公众号,但是这种微信公众号更多是将APP套了一个微信的壳子,除了前面的授权和微信有关系以外,其他的都和微信没多大的关系了,特此记录 开发流程 首先需要在电脑上 ...
随机推荐
- Android、JavaScript、WebView之间的交互学习
一.WebView调用Java //1.允许WebView加载jsmWebView.getSettings().setJavaScriptEnabled(true); //2.编写js的接口 ---- ...
- Flask 中的 5种返回值
1.Flask中的HTTPResponse 在Flask 中的HttpResponse 在我们看来其实就是直接返回字符串 2.Flask中的Redirect 每当访问"/redi" ...
- Android 使用View绘制文字(DrawText)技术总结
转载请注明出处: http://www.cnblogs.com/renhui/p/7453534.html 这里的绘制文字不是直接调用TextView.setText(String content)去 ...
- JS禁用键盘浏览器退格键
我们在真实的项目开发中经常会使用JS 对键盘上的一些按键进行禁用,常见的比如说退格键(backspace/ 后退键),我在一个项目中就遇到过在页面编辑的时候禁用掉退格键,因为退格键会发生页面后退,这样 ...
- OpenStack-Ocata版+CentOS7.6 云平台环境搭建 —7.网络服务Neutron配置
网络服务Neutron本章节结束如何安装并配置网络服务(neutron)采用:ref:`provider networks <network1>`或:ref:`self-service n ...
- D3.js的一些基础部分 (v3版本)
最近公司有需求要做一些可视化的功能.之前一直都是用Echarts做的,但是Echarts难以满足我们的需求,经过多方请教,查找发现D3可以满足我们的需求.第一次接触到D3,发现这些图标的可交互性非常丰 ...
- 自定义线程池reject策略
import java.util.Date;import java.util.concurrent.ArrayBlockingQueue;import java.util.concurrent.Rej ...
- C# 根据Combobox控件来动态显示TabControl下的子元素
根据下来列表来动态显示TabControl下的元素 需要准备两个控件:Combobox (命名为:cbPrjType)和 TabControl (命名为:tabPrjType),TabControl下 ...
- underscore.js源码解析【'_'对象定义及内部函数】
(function() { // Baseline setup // -------------- // Establish the root object, `window` (`self`) in ...
- Spring Boot 解决方案 - 配置
习惯优于配置 Spring Boot 项目的重要思想就是"习惯优于配置",这也是为什么该项目诞生的原因,让开发者免于 Spring 生态中各种项目的配置.尽管如此,但项目中完全零配 ...