Nodejs下微信网页开发进阶篇

前言

今天终于早回家一天了，也有空逛逛自己的博客，2月份只写了一篇博客就过去了，3月份至今还没有产出，看着有道云笔记里的几篇草稿躺在那里，是该趁着这会有点时间整理一下了。最近真的摊上了“大事”了，每天都忙着撸代码，都没有时间来面对那些躺在笔记里的草稿的招手，实在是有愧于心。

于是赶紧先整理出这一篇文章，也是继续在上次写的Nodejs下微信网页开发教程系列文章的基础上，再加上最近继续搞的项目，把之前总结的再丰富一下。

1、网页Token和基础Token

细心的童鞋肯定会发现在微信公众号的开发文档下有两处提到token:

刚开始我还以为二者没有多大区别，然后在项目开发的时候就被自己傻哭了，因为使用测试公众号的时候过于频繁调用token，导致微信报错：

{"errcode":45009,"errmsg":"api freq out of limit"}

然后才开始知道全局缓存Token的重要性。目前我们整个项目要用到基础Token的地方有：

1. 使用Token去获取Ticket然后生成signature供前端的wx.config使用，详细代码可以参考： getSignature函数
2. Nodejs端从微信服务器上下载图片，这个时候我们需要使用基础Token以及微信服务器提供的mediaId去下载：

大致代码：

request({
url: 'http://file.api.weixin.qq.com/cgi-bin/media/get',
qs: { access_token: token, media_id: serverId },
method: 'GET'
})

于是我们采用Redis去缓存微信Token，每2个小时去更新一次，同时在第一步中生成的Ticket也同时缓存。

关于这边的代码(包含了Nodejs后端会用到的微信全部功能)的实现如今已经抽成一个公共的包，其github地址是： wechat-nodejs-sdk。欢迎大家提issue。

2、关于提高微信网页开发的效率

之前的第一个项目中严格依赖于微信网页开发客户端，后来项目改成React+Mobx来实现，很多谷歌的插件都用不了，于是我们就想到不再依赖微信网页开发客户端，使用各种模拟手段去脱离微信网页开发客户端的控制。

比如我们不再强制跳转到微信确认登录页，转而使用一个已经存在的openid作为测试账号，再比如我们扫码在开发环境不再调用摄像头而是直接Mock数据返回结果。

另外我们在配置中使用开关来控制是否在开发环境下启用真的微信开发环境，以便在最后开发阶段来一次实际的使用效果。

整体下来开发的效率会比之前好了很多。

3、关于微信公众号只能配置一个回调域名的解决方案

更多的时候是我们可能在一个微信公众号上维护多个Nodejs服务器，于是相关的回调就有可能需要配置多个，但是，微信那边只能配置一个，于是乎便有了对应的解决方法。网上找了一下，觉得这个应该算是很不错的一个解决方法：

github: https://github.com/HADB/GetWeixinCode

该作者的解决思路是通过设置一个主控回调域名，然后再主控回调域名下放置一份脚本，由该脚本来执行微信code的获取以及跳转，相当于说：

B向A(主控回调域名)重定向，执行A的一个脚本，A向微信服务器请求code，然后获取code，重新跳回B。

该解决方案目前已经部署在自己的项目中，效果还是很不错的，感谢一下作者提供的脚本。

4、关于前端页面跳转过快导致微信报错：'invalid signature'

在实际的react项目中，页面切换过于频繁的时候，经常会出现微信的SDK没法使用的问题，后来经过调试发现，由于切换过快，时间戳几乎一致，但是计算出来的签名是被微信认为无效的，这个时候我们的解决方案便是在react-router中路由切换的时候加上防抖动函数：debounce。(lodash代码)

类似代码如下： onChange={_.debounce(() => wxConfig(), 500）}

5、后续....

整体微信公众号的开发暂时告一段落，对于基于微信开发的整体脉络也算是全部理清楚，后面会使用的基本上都是SDK上的运用，不会再有别的坑了。

有时间会将内部使用的wechat-nodejs-sdk包整合到weChat-learning上去，供大家学习使用