推荐关注
› Meteor
› JSLint - a JavaScript code quality tool
› jsFiddle
› D3.js
› WebStorm
推荐书目
› JavaScript 权威指南第 5 版
› Closure: The Definitive Guide
› Closure: The Definitive Guide
分享：真机页面调试＋抓包，调试微信生产环境 HTTPS 页面工具集成。(weinre + AnyProxy)
wuchangming89 · 2016-07-26 13:04:16 +08:00 · 14902 次点击这是一个创建于 3044 天前的主题，其中的信息可能已经有所发展或是发生改变。
项目地址在 github 上： https://github.com/wuchangming/spy-debugger
关于 spy-debugger
一站式页面调试、抓包工具。远程调试任何手机浏览器页面，任何手机移动端 webview （如：微信， HybirdApp 等），支持： HTTP/HTTPS
Demo
调试界面
抓包界面
特性
1 、页面调试＋抓包
2 、操作简单
3 、支持 HTTPS。
4 、spy-debugger内部集成了weinre、node-mitmproxy、AnyProxy。
5 、自动忽略原生 App 发起的 https 请求，只拦截 webview 发起的 https 请求。对使用了 SSL pinning 技术的原生 App 不造成任何影响。
6 、可以配合其它代理工具一起使用(默认使用 AnyProxy) [(设置外部代理)](#设置外部代理默认使用 anyproxy)
安装
Windows 下
npm install spy-debugger -g
Mac 下
sudo npm install spy-debugger -g
三分钟上手
第一步：手机和 PC 保持在同一网络下（比如同时连到一个 Wi-Fi 下）
第二步：命令行输入spy-debugger，按命令行提示用浏览器打开相应地址。
第三步：设置手机的 HTTP 代理，代理 IP 地址设置为 PC 的 IP 地址，端口为spy-debugger的启动端口(默认端口： 9888)。
第四步：安装证书。注：手机必须先设置完代理后再通过(非微信)手机浏览器访问http://spydebugger.com/cert安装证书（手机首次调试需要安装证书，已安装了证书的手机无需重复安装)。
第五步：用手机浏览器访问你要调试的页面即可。
自定义选项
端口
(默认端口： 9888)
spy-debugger -p 8888
设置外部代理（默认使用 AnyProxy ）
spy-debugger -e http://127.0.0.1:8888
spy-debugger 内置 AnyProxy 提供抓包功能，但是也可通过设置外部代理和其它抓包代理工具一起使用，如： Charles 、 Fiddler 。
是否让 weinre 监控 iframe 加载的页面
(默认： false)
spy-debugger -i true
是否只拦截浏览器发起的 https 请求
(默认： true)
spy-debugger -b false
有些浏览器发出的 connect 请求没有正确的携带 userAgent ，这个判断有时候会出错，如UC 浏览器。这个时候需要设置为 false 。大多数情况建议启用默认配置： true ，由于目前大量 App 应用自身（非 WebView ）发出的请求会使用到 SSL pinning 技术，自定义的证书将不能通过 app 的证书校验。
是否允许 HTTP 缓存
(默认： false)
spy-debugger -c true
更多
spy-debugger原理是集成了weinre，简化了weinre需要给每个调试的页面添加 js 代码。spy-debugger原理是拦截所有 html 页面请求注入weinre所需要的 js 代码。让页面调试更加方便。
30 条回复 • 2016-12-05 13:18:32 +08:00
 |
1
wuchangming89 OP 不仅限于微信，所有手机端的页面都支持
|
 |
2
jsser 2016-07-26 13:16:45 +08:00
👍
|
|
3
wuchangming89 OP @jsser Thanks
|
 |
4
iyaozhen 2016-07-26 13:25:09 +08:00
赞！
|
|
5
wuchangming89 OP |
 |
6
laoyuan 2016-07-26 13:40:30 +08:00
好，之前我用 Charles + Proxifier 调试，现在可以扔了！
|
|
7
wuchangming89 OP @laoyuan : )
|
 |
8
bobsam 2016-07-26 14:12:58 +08:00
看上去挺不错的！先试用看看效果~
|
|
9
wuchangming89 OP @bobsam 欢迎试用 : )
|
|
10
wuchangming89 OP 长时间使用， AnyProxy 可能导致 crash ，不知道 AnyProxy 什么时候能更新一版本
|
 |
11
xmpx310 2016-07-26 16:15:00 +08:00
有 fiddler 好用吗
|
 |
12
yangxiongguo 2016-07-26 16:16:50 +08:00 via iPhone
mark
|
|
13
wuchangming89 OP @xmpx310 ,看场景，如果你要调试页面。或者看 js 的 log 。 fiddler 就没办法了
|
|
14
wuchangming89 OP @xmpx310 ，但 spy-debugger 也可以结合 fiddler 一起用。
https://github.com/wuchangming/spy-debugger#设置外部代理默认使用 anyproxy 启动方式： spy-debugger -e http://127.0.0.1:[fiddler 端口] |
 |
15
yushiro 2016-07-26 17:08:49 +08:00 via iPhone
这个可以有，非常不错的我工具
|
|
16
wuchangming89 OP @yushiro : )
|
 |
17
TangMonk 2016-07-26 17:27:13 +08:00
 现在用的这个，微信官方出的，感觉还行 |
|
18
wuchangming89 OP @TangMonk ，嗯，这个不支持 HTTPS
|
|
19
wuchangming89 OP @TangMonk 而且没有找到开源代码。。本来想改它的。
|
 |
20
fhefh 2016-07-26 21:48:29 +08:00
太棒了
|
 |
21
xerr 2016-07-27 07:22:35 +08:00 via iPhone
mark
|
 |
22
tonyyu 2016-07-27 08:40:14 +08:00
真棒！！！
|
 |
23
ak47947 2016-07-27 08:47:45 +08:00
回复只为点赞！
|
|
24
wuchangming89 OP @ak47947 ,哈哈，谢谢！
|
 |
25
quix 2016-07-28 17:06:34 +08:00
@wuchangming89 最新的版本支持使用 chrome inspector 远程调试 可以支持 https 的
|
|
26
quix 2016-07-28 17:07:41 +08:00
weinre 比较弱..我建议还是用 xposed 给所有的 webview 都开启 remote debug 然后用 chrome 的 remote inspector 调试
|
|
27
wuchangming89 OP @quix ，嗯， inspector 是安卓调试里最方便实用的。你这方法我有空研究下。不过对我这种安卓小白来说，难度有点大。
|
 |
28
mingyun 2016-11-20 20:28:32 +08:00
厉害了
|
 |
29
litpen 2016-12-05 10:54:02 +08:00
简直就是解决手机调试的一枚银弹！
以前都要看平台的，这一个方法解决了所有平台调试问题，还解决了 https 不能调试的问题。 |
|
30
wuchangming89 OP @litpen 谢谢支持。使用过程中有问题，欢迎提 issue ，我会尽力去完善该项目。
|
Select Language