微信公众平台开发入门之工具篇

前言

工欲善其事,必先利其器

Ngrok

微信需要外网地址,那意味着我们只能把代码传到外网服务器来查看开发调试?这样做是不是太low,而且效率及其低下,这是肯定不能接受的,下面我就介绍一个内网穿透神器ngrok,它能给我们生成一个外网地址并映射到本地服务器:

  1. 首先你要到ngrok官网注册一个账户
  2. 然后下载与系统相应的ngrok版本
  3. 解压后,通过命令行进入到你解压的位置
  4. 执行命令:
./ngrok authtoken <your-authtoken>

your-authtoken你注册后就能看到。到此ngrok就安装完成了。
分配外网地址:

./ngrok http <your-port>

your-port是本地服务器端口号,可自行设置。
但上面的命令每次分配的外网地址是变化的,如果需要固定的外网地址,那你分配外网地址的时候要这样(付费用户才能用):

./ngrok http -subdomain=<your-app> <your-port>

例如:./ngrok -subdomain=baz 8080,那给你分配的外网地址就是baz.ngrok.io

注意:ngrok 1.x与2.x命令稍有不同,请注意用ngrok -help查看

ngrok使用中的问题

访问缓慢以及不可访问

由于服务器是在美国,这个稳定性实在不能保证,经常外网发布成功却不能访问或访问很慢,原因大家都懂的。

域名不固定

这个你当然可以靠付费解决,ngrok并不是很贵,但结合第一条稳定性的问题,这就日了狗了。
ngrok确实是神器,不用的话对我们开发起来确实不方便,那有解决办法么?这个是肯定的。

Tunnel

关于Tunnel的最新消息:
Tunnel不能用了,据说是作者暂时不打算再为服务器空间续费了,没钱,大家可以给你众筹嘛!不要停好不好,泪流满面有没有。因此关于Tunnel的部分可以跳过了。

就是这个tunnel:

tunnel是一个基于ngrok的网络服务,通过tunnel,他人在公网可以通过类似example.tunnel.mobi这样的二级域名来访问你的本地网络服务。
tunnel部署在国内,支持ngrok的绝大多数功能,同时改变了由于ngrok服务器在美国所造成的访问缓慢和不可用的现状。

服务器在国内,域名能固定,简直完美解决了ngrok的使用问题。

如何使用tunnel
  1. 下载客户端:Linux版本Mac OSX版本32Bit Win版本64Bit Win版本
  2. 下载配置文件ngrok.cfg
  3. 运行客户端时,请添加-config以载入配置文件。
./ngrok -config ngrok.cfg -subdomain <your-appname> <your-port>

例如 ngrok -config ngrok.cfg -subdomain example 8080 ;意为将本地服务器的8080端口映射到example.tunnel.mobi上
注意:使用tunnel,需要下载的是ngrok 1.x 版本,不能是2.x版本,ngrok官方目前并不准备开放2.0客户端的第三方服务器支持

Localtunnel

Localtunnel是一个类似于ngrok的内网映射工具,但Localtunnel是基于nodejs的,而ngrok是基于go语言;相信做过一段时间前端的对nodejs都有了解的,所以安装nodejs部分略过不讲啦,当然npm也是必备的。至于为什么有了ngrok,tunnel还要用Localtunnel,实在是Tunnel虽然在国内,访问速度也可以,但经常不能访问,估计是服务器也不堪负荷,挂了,但这很耽误事好不好,好不好,好不好!只好用Localtunnel备用啦!虽然Localtunnel也不太稳定,但好待能用。好了,废话不多说。
首先全局安装Localtunnel

npm install -g localtunnel

然后设置项目名和本地服务器端口

lt -s <your-appname> -p <your-port>

例如:lt -s example -p 8080;意为将本地服务器的8080端口映射到example.localtunnel.me上
只是微信正式的公众号js接口安全域名竟然不支持未通过ICP备案的域名,真是日了狗了,日了狗了,狗了…,所以只能在微信公众平台测试帐号里使用,好在测试帐号支持的接口还是比较多的

QQ浏览器微信调试工具

Tunnel挂了,localtunnel,ngrok不稳定,找一个方便的微信调试工具就迫在眉睫了,无意发现了QQ浏览器微信调试工具,其实也是内置了使用ngrok,只是把它封装成了一个插件,粗略试了一下,还是不错的,具体教程我就不搬过来了,这里面写的很详细,只是必须下载QQ浏览器,如果不想下载QQ浏览器,可以使用网络大神从qq浏览器中提取的版本,地址在这里,有win版和mac版,使用方式和ngrok命令一样。

Sunng-ngrok

QQ的微信调试工具最近也不能用了,不知道是不是停了,还是临时性的,导致工作好几天没法开展,没办法只能再找。
Sunng-ngrok是一个个人维护的类似于tunnel的工具,作者是sunny,作者强调不收费,大家可以凭个人意愿打赏。使用方法大家看作者的教程吧,我就不列了。
也不知道这个能坚持多久,找了这么多,觉得如果有条件的话还是自己搭一套ngrok算了,真心太折腾了

微信开发者工具

微信开发者工具是微信为帮助开发者更方便、更安全地开发和调试基于微信的网页的开发者工具。它是一个桌面应用,通过模拟微信客户端的表现,使得开发者可以使用这个工具方便地在 PC 或者 Mac 上进行开发和调试工作,注意这是微信官方发布的哦,应该能够得到很好的维护。