微信公众号中的事件有订阅事件/扫码事件/点击事件/跳转链接事件等等,具体可以查阅文档。

这里来实现一下订阅事件,其他的事件的实现过程也都类似。

当有人订阅了公众号后,微信服务器会向我们的服务器推送一个事件,这个事件是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开发微信公众号个人笔记(二)响应事件的更多相关文章

  1. Node.js+Koa开发微信公众号个人笔记(一)准备工作

    本人也是在学习过程中,所以文章只作为学习笔记,如果能帮到你,那就更好啦~当然也难免会有错误,请不吝指出~ 一.准备工作 1.本人学习教程:慕课网Scott老师的<Node.js七天搞定微信公众号 ...

  2. Node.js+Koa开发微信公众号个人笔记(三)响应文本

    响应输入文本和响应事件类似,首先对微信服务器发送来的数据的MsgType进行处理,如果是text,说明是文本,接下来可以对文本内容进行处理,比如用户输入了1,可以给用户回复一个文本或者图文或者视频等信 ...

  3. vue+node.js+webpack开发微信公众号功能填坑——v -for循环

    页面整体框架实现,实现小功能,循环出数据,整体代码是上一篇 vue+node.js+webpack开发微信公众号功能填坑--组件按需引入 修改部门代码 app.vue <yd-flexbox&g ...

  4. vue+node.js+webpack开发微信公众号功能填坑——组件按需引入

    初次开发微信公众号,整体框架是经理搭建,小喽喽只是实现部分功能,整体页面效果 整个页面使用两个组件:布局 FlexBox,搜索框 Search,demo文档 http://vue.ydui.org/d ...

  5. C#开发微信公众号-学习笔记

    由于最近要做微信服务号的开发,所以开始找相关说明和接口文档开始学,故把学习过程及注意事项记录一下,帮助想学习的快速上手.废话不多少了,直接上干货! 1.申请微信公众号 这个就不需要多说了吧,大家直接照 ...

  6. 使用vue开发微信公众号下SPA站点的填坑之旅

    原文发表于本人博客,点击进入使用vue开发微信公众号下SPA站点的填坑之旅 本文为我创业过程中,开发项目的填坑之旅.作为一个技术宅男,我的项目是做一个微信公众号,前后端全部自己搞定,不浪费国家一分钱^ ...

  7. Vue开发微信公众号默认背景为灰色

    最近公司有一个项目,使用Vue开发微信公众号,开发过程遇到一个问题,即设计图的整体背景是白色的,但是公众号里默认的背景是浅灰色,如果某个页面高度没能占满一屏,就会露出浅灰色的默认背景,会显得很不协调. ...

  8. vux+vuex+vue+Es6开发微信公众号的坑

    初次开发微信公众号遇到很多问题,可能是基础不怎么牢靠,最近几天一直在看vue的东西,现在就来慢慢介绍vux和vue这个骚东西的用法: 细看文档一步步来, npm install vux --save ...

  9. vue开发微信公众号--开发准备

    由于工作项目的原因,需要使用vue开发微信公众号,但是这种微信公众号更多是将APP套了一个微信的壳子,除了前面的授权和微信有关系以外,其他的都和微信没多大的关系了,特此记录 开发流程 首先需要在电脑上 ...

随机推荐

  1. 一些有价值的Blog推荐

    待看的一些文章 1. 性能调优攻略 http://coolshell.cn/articles/7490.html 2. 内存的存储管理--段式和页式管理的区别 http://blog.sina.com ...

  2. Javascript模式小记(一)

    js总是可以在不知不觉中地创建了全局变量,其原因在于JavaScript的两个特性. 1.JavaScript可直接使用变量,甚至无需声明: 2.JavaScript有个暗示全局变量的概念,即任何变量 ...

  3. Android 音乐(音效)播放方式总结

    一.音效的分类 音效按照作用的不同,可以将音效分为即时音效和背景音乐.两种音效在Android中的实现技术是不同的. 主要的实现方式为:SoundPool.MediaPlayer. 区别在于,Medi ...

  4. spring boot log4j2配置

    [传送门]:log4j官网配置文件详解 1. 排除 spring boot 自带的  spring-boot-starter-logging 依赖 <dependency> <gro ...

  5. jsp-EL表达式简介

    表达式语言(Expression Language,EL),EL表达式是用"${}"括起来的脚本,用来更方便的读取对象! EL表达式主要用来读取数据,进行内容的显示! 使用EL表达 ...

  6. Hexo的next主题安装

    通过Git+Hexo搭建的个人博客地址:https://liangh.top/ 1.使用git克隆最新版本 2.先在themes目录创建一个next文件夹,然后在hexo站点目录下右键打开Git Ba ...

  7. springboot + mybatis

    这两天启动了一个新项目因为项目组成员一直都使用的是mybatis,虽然个人比较喜欢jpa这种极简的模式,但是为了项目保持统一性技术选型还是定了 mybatis.到网上找了一下关于spring boot ...

  8. linux下配置nginx负载均衡例子

    准备2台虚拟机: 分别在两个虚拟机上安装tomcat,并在服务器A安装nginx,其中nginx端口设置为了 70. 服务器A的tomcat安装目录: 服务器B的tomcat安装目录: 服务器A的ng ...

  9. 基于python+appium+yaml安卓UI自动化测试分享

    结构介绍 之前分享过一篇安卓UI测试,但是没有实现数据与代码分离,后期维护成本较高,所以最近抽空优化了一下.不想看文章得可以直接去Github,欢迎拍砖大致结构如下:   结构.png testyam ...

  10. SpringMVC redirect中文乱码问题

    在使用"redirect:xxx.do?param=中文"时会出现乱码问题,解决方案如下: 使用model.addAttribute来替代直接拼接参数.如下: @RequestMa ...