微信web开发者工具作为程序开发设计人员的神器,它可以通过与微信有关的网页来进行模拟,可以更好地进行小程序、web页面的测试,能够了解自己开发的不足,为你快速找出问题所在。
微信公众平台针对设计人员而开发的一款桌面应用,该应用可以帮助开发者更方便、更安全地开发和调试基于微信的网页,通过模拟微信客户端的表现,使得开发者可以方便地在PC或者Mac上进行开发和调试工作。
功能说明
1、调试、检验页面的 JS-SDK 相关功能与权限,模拟大部分 SDK 的输入和输出
2、使用自己的微信号来调试微信网页授权
3、利用集成的 Chrome DevTools 协助开发
4、使用基于 weinre 的移动调试功能
微信开发者工具如何使用
–调试微信网页授权
1)开发者可以在调试器中点击“登录”,使用手机微信扫码登录,从而使用真实的用户身份来开发和调试微信网页授权。请确认手机登录页,绑定的公众号为“微信 web 开发者工具”。
2)为了保证开发者身份信息的安全,对于希望调试的公众号,我们要求开发者微信号与之建立绑定关系。具体操作为:公众号登录管理后台,启用开发者中心,在开发者工具——web 开发者工具页面,向开发者微信号发送绑定邀请。
3)开发者在手机微信上接受邀请,即可完成绑定。每个公众号最多可同时绑定10个开发者微信号。
4)完成登录和绑定后,开发者就可以开始调试微信网页授权了,注意只能调试自己绑定过的公众号。
–模拟JSSDK权限校验
通过它,可以模拟 JSSDK 在微信客户端中的请求,并直观地看到鉴权结果和 log。以微信JSSDK DEMO 页面为例:
在调试器中打开该 URL,可以方便地在右侧的 JS-SDK Tab 中看到当前页面 wx.config 的校验情况和 JSSDK 的调用 log。
–移动调试
移动调试功能是基于 weinre 的,并且做了一些改进,相比直接使用 weinre 有两个优点:
1)可以在 weinre 的网络请求页卡中,看到完整的 http 请求 log,非局限于 ajax 请求
2)无须手工在页面中加入 weinre 调试脚本
微信开发者工具怎么导入项目
1、运行之后我们找到想要导入的项目所属的类型点击进去,比如小编需要导入一个小程序项目,就点击小程序项目模块。
2、点击之后进入到小程序项目界面,在界面底部有一个管理项目选项,然后我们点击它右边的添加图标。
3、点击这个添加图标之后会出现一个新增项目的界面,我们选择项目目录以及填写项目名称等其他信息。
4、点击项目目录右边的图标即可打开选择项目目录的界面,我们找到想要导入的项目src源代码文件夹之后,点击选择它并点击确定按钮进行导入即可。