一款抓包工具-whistle

介绍

一款代理抓包工具，可用于进行对接口代理转发，造 Mock 数据，抓包等。

快速上手

官网介绍比较清晰，从安装 node 到 安装和启动 whistle 以及如何代理都写的很详细。一般都是 whistle 配合浏览器的插件 SwitchyOmega 一起使用。

官方文档

1. 安装 node 及 whistle
2. 第一次运行需要在终端运行 w2 start --init 这一步用于初始化 whistle ，并且配置好本地的安全证书，用于使用 https。后续的就只需要直接 w2 start 即可。
3. 此时去访问 localhost:8899 即可看到 whistle 的配置界面

• network：类似于 f12 的 network，用于查看包信息。
• rules：代理规则
• values：配置的值
• plugins：插件，暂时用的不多。

4. 除此之外，还有 stop，restart 等命令，具体可看官网。

5. 安装浏览器插件 SwitchyOmega

   1. 新建代理情景，名字随意，但是为了区分标识，一般用 whistle
   2. 配置代理情景，端口选 8899，因为 whistle 默认是这个端口。
   3. 再到对应网站切换即可，切换到 whistle 即使用 whistle 的代理，切换直接连接，即关闭代理。

使用场景

服务代理

所谓服务代理，就是当我在本地启动一个前端项目的时候，我们的项目一般都是运行在本地端口。有时候我们可以需要使用一些线上/验收/测试环境的登陆信息，希望在访问这些域名的时候，将服务打到本地端口上，便于开发调试。此时就可以去 Rules 里进行配置。

详细规则：wproxy.org/whistle/pat…

普通使用

对于这种情况，一般都是 域名A -> 本地：端口这种。我们可以直接编写下面代码即可。前面的三个星号代表是 http / https 都匹配，这也是常见的用法。这时候访问 domain.com 的时候，就都会打到本地 8080 端口下的服务了。

***domain.com  localhost:8080

只代理部分

对于上面的规则，会将所有 domain.com 的请求都代理到本地 8080，但是有时候我们可能后端服务也挂载在这个上面，我们希望只代理前端，后端还是正常走部署了的服务。一般这种情况，后端服务的 path 都会有一个前缀，我只需要将这个前缀过滤掉即可。

 # 所有baac_node/api下的都不会走代理
***domain.com  localhost:8080 excludeFilter://***domain.com/baac_node/api

这样，我们就可以实现前端是本地的，而后端是线上部署的。

当然如果你是全栈开发，你希望服务也打本地部署的，只需要多补充一个规则即可。如下：

***domain.com/baac_node/api  localhost:3000/baac_node/api

这样，就都是本地的了。而我们可以随心所欲的访问线上域名，并且在本地调试开发。

特殊场景

是我目前开发时所遇到的场景，其表现是，域名的 path 中，其中有一段是版本号，比如 1.0.0.231 这种类似的。对于这段 path 我们应该采取的措施是利用通配符进行匹配，而不是具体的值。自然而然，我们会写下下面这段配置：

***domain.com/*/*.html  localhost:8080/*.html

但是这段配置，它不会生效。具体原因不是很清楚，但是我们可以利用 $ 运算符，进行实现上面这段配置：

• $[index]：取第几个通配符的值

因为我们这是第希望匹配所有版本下的任何 html 都打到本地的 html，所以从左往右数，它是第三个，所以取 $3。

# 这个双斜杠不能丢（特殊场景）
***//domain.com/*/*.html  localhost:8080/$3.html

当域名为 domain.com/1.10.1/inde…

其值为下列数据

• $1 = https
• $2 = 1.10.1
• $3 = index

接口代理

这也是另外一个场景的功能，常用于制造mock数据。其使用分为两步：

1. 在values里面放好json数据

2. 在rules里面配置path

这样，这个接口就被 mock 了，即被本地拦截了。并且修改了它的 resBody，除了resBody，它还可以修改 header，cookie 等一系列。

移动端代理

移动端代理基本上网上都能搜出教程

• whistle苹果手机安装证书步骤:_whistle 证书无效-CSDN博客

• whistle手机抓包(以安卓手机为例) - 旅+ - 博客园

代理的前置条件

1. 手机和电脑必须在同一局域网内
2. 如果需要使用 https ，需要下载证书

证书是ex我比较多的一个地方，由于前期操作姿势不对，导致证书每次都安装很麻烦，其正确步骤是：

1. 必须！！！！同一局域网内且配置了代理
2. 进行去通过教程里面给的 url 去浏览器下载证书

拿 iphone 举例

1. 先在wifi处配置代理，并且处于同一个局域网
2. 然后用 safari 扫码，就可以看见顺利的下载了描述文件，再到设置里进行安装和配置就好了

如何验证是否代理成功？

利用 network 查看 finalUrl 即可。

• 有值即打到了代理规则上面
• 无值即没有打到

对比 Charles

1. Whistle 免费，Charles收费
2. charles配置点击偏多，交互较重，whistle把功能直接披露出来，使用起来更加方便。

个人看法，charles用的少，但是第一次接触，就让我觉得复杂麻烦。

相对的可能whistle功能上可能没charles足，不过对于代理来说，是比较足够的

最后

用charles代理，网易挂了，不能上班听歌了，伤心💔