微信公众号搭建本地测试环境

原因:
1、由于公司的微信公众号已经在阿里云上运营,如果有任何bug不可能去停掉服务器去调试,这就需要在本地搭建测试环境了。
2、公众号开发涉及到微信的回调,所以你本地搭建的服务器需要外网能够访问,这个时候就需要把运行在内网的服务器映射到外网去给微信访问。

方法:
1、搭建内网穿透环境
如果喜欢自己搭建的话可以多找些关于内网穿透的资料看看,我是由于时间的关系,当时就选择了一个工具来把自己的电脑穿透到外网,(主要是收费不是很贵)。
在这里可以推荐一下:natapp,https://natapp.cn/,网络感觉还不错,虽然不快,但是基本能满足我的微信开发就足够了,我使用的是付费5/月的套餐,因为这样就能固定的外网地址。

2、映射好后,要试着访问以下映射的地址,看看是否能访问到你的服务器,可以的话就说明你的映射是成功的。如图:

微信公众号搭建本地测试环境


3、配置公众号的测试账号:
1)、进入到微信公众号首页左侧导航栏下有个开发者工具,点击进去:
微信公众号搭建本地测试环境
2)、在右边能看到如下的测试账号,点击进入
微信公众号搭建本地测试环境
3)、用个人微信扫一扫进去即可登录个人的测试账号,此时会有如下的东西,这个是公众号开发的时候需要用到的参数。
注:这些最好用配置文件的形式保存,方便以后修改为正式环境的参数!
微信公众号搭建本地测试环境
4)、这个url是微信那边需要发个验证请求过来的,需要你配置一个你服务器的外网地址,即第一步我们将公众号服务器映射到外网的地址,(注意端口号哦)。token的话自己随机设置,并保存到配置文件中。
微信公众号搭建本地测试环境

5)、当你点击提交的时候,微信会立刻试着发个请求到这个地址上去,如果请求成功的话,可以看到如下图;
微信公众号搭建本地测试环境
url尾部的wechat,是因为我本地用了nginx路由转向,这个转向就是转到我的本地公众号服务器。(如果还没有接触nginx的话,可以先试着直接把映射的端口直接跟你公众号服务器端口设置成一样,就是如下图的本地端口。不过一般还是建议搭配nginx使用,这样就不用总是去改端口,只需要配置好你的nginx代理服务器就可以了。
微信公众号搭建本地测试环境

6)、微信发送认证请求到你本地服务器的代码如下,这个是node的代码,这个代码只在微信认证的时候使用,平时注释掉即可:
// 微信url 验证token代码
router.get('/',function function_name(req,res) {
// body...
var state = req.query.state;
//console.log(req);
var Isign = sign.checkSignature(req.query);
console.log('sign',Isign);
if(!Isign){
//如果签名不对,结束请求并返回
res.end('signature fail');
}
if (req.method == "GET") {
//如果请求是GET,返回echostr用于通过服务器有效校验
res.end(req.query.echostr);
}
});
sign文件的检查签名
var crypto = require('crypto');
checkSignature = function (query) {
var signature = query.signature;
var timestamp = query.timestamp;
var nonce = query.nonce;

var shasum = crypto.createHash('sha1');
var arr = [configs.token, timestamp, nonce].sort();
shasum.update(arr.join(''));

return shasum.digest('hex') === signature;
};
7)、当你到这一步的时候,相信你微信扫一扫关注的测试账号就可以给你测试使用了,真机测试如下图:
微信公众号搭建本地测试环境