whistle 是一款很棒的前端调试代理工具，可以用来对前端和移动 H5 http, https 的抓包。
在 windows 上直接可以替代对 hosts 文件的 ip 和域名的映射，当然功能远远不止于此。
01 简介
whistle 是基于Node实现的跨平台抓包调试代理工具，有以下基本功能：
查看 HTTP、HTTPS 请求响应内容
查看 WebSocket、Socket 收发的帧数据
设置请求 hosts、上游 http/socks 代理
修改请求 url、方法、头部、内容
修改响应状态码、头部、内容，并支持本地替换
修改 WebSocket 或 Socket 收发的帧数据
内置调试移动端页面的 weinre 和 log
作为 HTTP 代理或反向代理
支持用 Node 编写插件扩展功能
02 如何安装
Mac 上
sudo cnpm i whistle -g -S
启动 whistle
w2 start
可以在控制台看到
http://127.0.0.1:8899/
这里非常推荐用 chrome 扩展程序 SwitchOmega 来控制 chrome 浏览器的代理配置，
如何安装 chrome 扩展以及离线安装扩展可以看我的另一篇文章。
安装Chrome代理插件：推荐安装 SwitchyOmega
在 SwitchOmega 配置好 whistile 代理之后，浏览器输入 http://local.whistlejs.com/
可以新建代理规则，
ip 域名 或者 域名 ip
我们在 chrome 中启用 whistle 代理之后，访问 https://www.baidu.com, 可以看到百度的每一个请求都可以在 whistle 上看到。
但是由于是 https 加密，所以传输内容我们看不到。下面跟大家说明如何安装 whistle https 证书。
03 安装 whistle 证书
访问一个 https 站点，https://www.baidu.com, 如下图，点一个 https 请求并点上面的 https 按钮会弹出一个二维码，点下载证书下载后打开钥匙串。
添加后点箭头的证书会筛选出 whistle 证书，点开证书选择始终信任该证书。
这样就可以抓 https 的包了。
如上图可以看到百度的请求的返回内容。
这个方式在移动端抓包的时候特别有用，在没有 chrome dev tools 的时候。
后续会有文章说明如何在移动 H5 上抓包调试。
网友评论