Fork me on GitHub

由于卤煮本人是做前端开发的,所以在做公众号过程中基本上没有遇到前端问题,在这方面花的时间是最少的。加上用了mui框架(纯css界面)和自己积累的代码,很快地开发出了界面来。接着是后台开发。卤煮选的是nodejs,作为中小型的项目开发,nodejs是前端开发人员的首选。然后是选了一些开发包,帮助快速上手。express,inspector,mysql等。卤煮不打算做nodejs教程,网上有很多。假设这些你都已经做好了,也就是说首先,你保证你已经有一份写好了的程序,并且通过本地浏览器测试。然后再开始搭建测试环境。

搭建本地服务器

很多同学在处于开发阶段的时候是不愿意搭建服务器环境的,一个是对linux系统不太熟悉,各种命令啦,方法啦,远程啦弄得人一头雾水,对于前端工程师来说尤其如此。况且,服务器需要花钱购买,虽然要不了几个钱,但终究是在产品未出来前持不愿意态度。这里,卤煮推荐一款非常有用的测试工具,它能够把内网公射到外网上去,并且给你一个能被访问到的域名。也就是说,域名是免费的,服务器则是你自己的电脑。它的操作步骤也非常简单,你花一分钟就可以搞定!

首先保证你的80端口被node监听。然后利用内网穿透工具把80端口映射出去。上一章讲过可以用ngrok工具穿透内网,使得你的本地ip作为外网使用。打开http://natapp.cn,下载window(根据你自己的系统)版本的工具,解压后打开cmd,切换到解压目录下输入以下命令:

ngrok -config ngrok.cfg -subdomain yourdomain 80

yourdomain是你自定义的域名,后面是端口,接着敲回车键,可以看到如下画面

 这时候,工具就把你的80端口映射出去了,而且还为你生成了一个域名,这个域名是可以被外网访问的。这样你的机器目前就是一台小服务器了。由于是内网穿透,http会走好几层路由,导致访问的速度会比较慢,但对于我们这些一毛钱没花就搭建好了服务器的同学来说,应该能刚到满足了吧。有了这个域名和服务器,我们就可以轻轻松松得来布置微信的测试环境了。

申请微信测试号

卤煮之前说过,微信公众号认证是需要公司资质的,而且认证费用要三百大洋。也就是说完成一个公众号的认证你大概需要注册公司成本(800)+ 认证成本(300),一共一千一的费用。卤煮本着在正式项目出来之前是不花一毛钱的原则,网上找到了微信的测试公众号平台。实现了不花钱用微信的认证功能的目的。打开微信测试公众号开发平台(http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=sandbox/login),点击登录,用自己的微信扫描后确认登录,系统为你自动建立一个测试账号。这个测试账号是临时的,最多拥有100位粉丝,但对于开发阶段来说完全足够,而且最有用的部分是该公众号的所有权限都为你开通。有了这个测试号,你就相当于已经拥有了一个认证过的准公众号:

如上图所示,数字的意义分别代表着:1:你的测试微信号, 2:appid, 3:appsecret, 4:与微信交互的后台接口 处理关注,发布,取消等事件, 5:Token 任意值,后台交互的凭证, 6:直接填写你的有效域名,引入js会以此域名为凭据。有一点值得注意,当你填写第四项的时候,点击提交微信会去验证你所填写的后台接口。为了方便第一次认证,你可以在此接口直接返回一段参数,已确认改服务器的所有权在你手上。后续我们会在这个接口里面逐步添加业务。代码如下:

//微信将很多事件推送到此接口上
app.post('/yourapi', function(req, res, next) {
	//微信得到返回后会通过你的认证
	var query = req.query;    
	var echostr = query.echostr; 
	res.send(echostr);
});	

接下来我们可以看到测试平台已经全部开放了权限,只需要你调用。里面还有测试公众号的二维码,扫描就可以关注,旁边是关注的粉丝名称以及它们的openid。往下翻页可以看到有“网页账号”这项服务功能,此功能是在用户打开网页时获取授权信息的,点击修改弹出填写域名界面。

在文本框内填写你的域名,这样微信才会给这个域名下的网页授权。记住,不需要www开头,直接写域名,如:baidudu.com。以www开头的是无效的。在开发环境下可以填写外网ip,但是在正式的公众号里面只允许填写域名。那么至此你已经把微信部分测试环境搭建好了,很简单吧。下一篇将讲解微信交互的一些过程。

 需要注意的地方

1.填写网页授权时不需要http或者www开头,只需要填写域名即可

2.微信授权域名只支持80端口,务必使node监听80端口

3.每次开机都需要重新搭建本地服务器环境,映射内网。

4.微信URL填写的是后端的接口,如:http://yourname.ngrok.natapp.cn/login/wechat 或者http://yourname.php,这个接口很重要,负责监听微信推送的各种事件。后面会详细讲解。

5.填写URL的时候微信会自动发送请求到该地址去,所以,必须先写好该接口,并且返回你填写的TOKEN,微信才会认为此服务器接口有效。res.send(req.query.echostr);

posted on 2016-03-01 08:35  chen·yan  阅读(5142)  评论(5编辑  收藏  举报