微信web开发工具

开发网址

点击打开链接

使用自己的微信号来调试微信网页授权





为了保证开发者身份信息的安全，对于希望调试的公众号，我们要求开发者微信号与之建立绑定关系。具体操作为：公众号登录管理后台，启用开发者中心，在开发者工具——web
开发者工具页面，向开发者微信号发送绑定邀请。绑定页面如下图所示：




开发者在手机微信上接受邀请，即可完成绑定。每个公众号最多可同时绑定10个开发者微信号。邀请确认页面如下图所示：




完成登录和绑定后，开发者就可以开始调试微信网页授权了，注意只能调试自己绑定过的公众号：
非静默授权的 URL 样例： https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx841a97238d9e17b2&redirect_uri=http://cps.dianping.com/weiXinRedirect&response_type=code&scope=snsapi_userinfo&state=type%3Dquan%2Curl%3Dhttp%3A%2F%2Fmm.dianping.com%2Fweixin%2Faccount%2Fhome

在微信 web 开发者工具中打开类似的授权页 URL（样例不可直接使用，请更换为绑定完成的公众号授权页URL），webview
模拟器显示效果如图：





点击“确认登录”即可带着用户信息跳转到第三方页面，很方便的进行后续的开发和调试。

静默授权的 URL 样例： https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx841a97238d9e17b2&redirect_uri=http://cps.dianping.com/weiXinRedirect&response_type=code&scope=snsapi_base&state=type%3Dquan%2Curl%3Dhttp%3A%2F%2Fmm.dianping.com%2Fweixin%2Faccount%2Fhome

在微信 web 开发者工具中打开类似的授权页 URL（样例不可直接使用，请更换为绑定完成的公众号授权页URL）则会自动跳转到第三方页面。

注意：如果使用了代理，需代理本身支持https直连，才能调试https页面。

2.调试、检验页面的 JS-SDK 相关功能与权限，模拟大部分 SDK 的输入和输出

通过 web 开发者工具，可以模拟 JSSDK 在微信客户端中的请求，并直观地看到鉴权结果和 log。以微信 JSSDK DEMO 页面为例：

http://demo.open.weixin.qq.com/jssdk

在调试器中打开该 URL，可以方便地在右侧的 JS-SDK Tab 中看到当前页面 wx.config 的校验情况和 JSSDK 的调用 log

移动调试

移动调试功能是基于 weinre 的，并且做了一些改进，相比直接使用 weinre 有两个优点：

无须手工在页面中加入 weinre 调试脚本
可以在 weinre 的网络请求页卡中，看到完整的 http 请求 log，非局限于 ajax 请求
如下图所示：





注意，移动调试功能暂不支持https。

Chrome DevTools

微信 web 开发者工具集成了 Chrome DevTools。同之前在 PC 上的调试体验一致，可以快速上手。

如下图所示：

下载地址

最新版本： (2016.2.22) 0.3.0

更新内容：

修复部分已知的 bug
新增支持微信企业号
Windows 64位版本：下载地址

MD5: e74dd9499379ad93c68a952133eb7116

Windows 32位版本：下载地址

MD5: b69a7d94a045430a1d8216950cb27199

Mac版本：下载地址

MD5: 4024846d39293b492cec0d83edd97b73

注：支持 win7 及以上版本，支持OS X 10.8 及以上版本