介绍利用微信web开发者工具进行本地和移动调试

概述

为帮助开发者更方便、更安全地开发和调试基于微信的网页,我们推出了 web 开发者工具。它是一个桌面应用,通过模拟微信客户端的表现,使得开发者可以使用这个工具方便地在 PC 或者 Mac 上进行开发和调试工作。立即下载体验

你可以:

  • 使用自己的微信号来调试微信网页授权
  • 调试、检验页面的 JS-SDK 相关功能与权限,模拟大部分 SDK 的输入和输出
  • 使用基于 weinre 的移动调试功能
  • 利用集成的 Chrome DevTools 协助开发

本地调试

跟使用chrome调试起来是一样的
本地调试
设置IOS或android版本

移动调试

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

  1. 无须手工在页面中加入 weinre 调试脚本
  2. 可以在 weinre 的网络请求页卡中,看到完整的 http 请求 log,非局限于 ajax 请求

由于移动端微信浏览器的兼容性问题,有的问题在本地重现不了,即使是用微信专用调试器也不行,这时就只能在手机端借助本工具提供的功能进行移动端的调试。

打开移动调试页签

手机上设置代理

手机上设置代理

打开调试窗口

打开调试窗口

选择有问题的html元素进行调试

选择元素进行调试

参考资料

文章目录
  1. 1. 概述
  2. 2. 本地调试
  3. 3. 移动调试
    1. 3.1. 打开移动调试页签
    2. 3.2. 手机上设置代理
    3. 3.3. 打开调试窗口
    4. 3.4. 选择有问题的html元素进行调试
  4. 4. 参考资料