做微信开发的朋友一定遇到过这样的问题，在电脑上测试正常的网页到微信里面就出错了，不知道原因只能使用排除法一点点的排除，因为微信客户端无法输出浏览器中抛出的异常信息，对我们开发带来了很大的问题。

在网络上搜索了一些方法，基本上都是从一个出处复制出来的，比如 http://www.jianshu.com/p/ccf124f1f74b，里面写的比较详细，但是我再部署过程中还是遇到了很多问题，所以这里特意记录一下分享给大家。调试原理我就不再赘述，上面给出的文章链接已经写的非常清楚了。只传一张调试原理的图。

删除微信默认 TBS

打开微信，在任意对话中，输入 //deletetbs 后发送，发送后没有任何提示的，可以再输入 //gettbs 查看当前情况。

//deletetbs

//gettbs

手机中安装 TbsSuiteNew.apk

你可以在 Mac 上下载好并解压出来，然后用 Mac QQ 给你手机 QQ ，手机 QQ 接收以后直接下载安装就可以了。

点击安装后，桌面会出现一个 TBS工具集 代表已经安装完成。打开刚安装好的 TBS工具集 选择 安装本地TBS内核

点击 安装TBS

安装完成后提示需要你打开应用，并在应用里面打开一个内嵌的网页，点击 启动应用，打开网页 按钮后，会自动弹出微信界面。你只需在微信里面随便找一个公共号点一片文章或者一个网页进入等待就可以了。我随便找了一个内推网的页面进去，等待了 1 分钟。

此时 TBS工具集 页面已经开始倒计时了，当倒计时结束时，按钮会变成 检查是否安装成功

点击 检查是否安装成功 按钮后如果安装成功，那么按钮名字会变成 安装完成，请重新启动应用以应用新内核

点击 安装完成，请重新启动应用以应用新内核 后会跳转到系统结束任务的界面，点击结束微信任务后，重新打开微信即可。

安装 ADB

下载完成后解压出来，我把它放到了 /Users/myCode/Project/android-sdk-macosx 目录下，运行 android-sdk-macosx/tools 目录下的 android。

此时会提示你没有安装 Java，如果你是 Mac OS X EI Capitan 的情况下，即使下载了 Java 官网最新的安装包依然无法解决问题的，你需要下载特定版本的安装包，参考资料。

下载完 Java 安装，然后再运行 android-sdk-macosx/tools 目录下的 android 会弹出如下界面。选择 Android SDK Platform-tools 并点击 Install Packages 按钮。

安装完成后，Android SDK Platform-tools 就显示为 installed 状态了。

同时，在 android-sdk-macosx/tools 目录下会生成一个 platform-tools 的文件夹。

我们需要把这个目录添加到系统的环境变量中，终端下输入 vi ~/.bash_profile，打开终端的用户配置文件，在最后面追加如下两条信息。请一定注意要换成你自己的路径。

export ANDROID_TOOLS=/Users/myCode/Project/android-sdk-macosx/platform-tools

export PATH=$PATH:$ANDROID_TOOLS

添加完成后执行以下刷新用户配置文件的命令 source ~/.bash_profile，然后重启 ADB

adb kill-server

adb start-server

安装 Python

Python 官网下载 Python 安装包，我下载的是 3.5.0 版本。

安装过程非常简单，就不多说了。确保命令行下执行 python 可以运行 python 命令行即可。

Python 启动调试服务

下载 wx_sq_webview_debug。

这一步是最坑的，我下载完成后解压 wx_sq_webview_debug.zip 就变成了 inspector_client20150401.zip.cpgz，怎么也打不开。网上查了查不是说文件损坏就是下载不完整等等，最后下载了一个名为 Unarchiver 的解压工具，用它一键搞定。

解压完成后，在命令行下切换目录到解压出来的 inspector_client20150401 目录。

在该目录下执行如下命令，注意路径！

python ./inspector.py --adb /Users/myCode/Project/android-sdk-macosx/platform-tools/adb

可能遇到错误 device unauthorized. Please check the confirmation dialog on your device. 请在你自己设备上同意usb调试。

如果没有问题，此时调试环境已经启动了，下一步就是连接手机调试了。

数据线连接手机进行调试

将数据线连接到电脑后，从手机的微信中打开一个公共号内嵌的网页，然后再电脑的 Chrome 浏览器中，输入 http://localhost:9222/ 会显示如下界面。你微信中打开了什么网页，这里就显示该网页的 Title。

点击进去以后，就可以看到针对该网页的强大的调试工具啦。

相关