mac指导安装whistle

最近在和客户端做联调工作，需要经常抓包分析请求。此时就需要一个抓包工具，windows上比较常用的有charles和fiddler，那mac上有没有好用的抓包软件呢？同事推荐了whistle，上午搞了搞，可以成功抓包了，觉着很方便，所以记录一下，希望可以帮到有抓包需求的小伙伴。
我这篇文章主要参考的whistle官方的文档，我觉着它写的不清晰，我重新整理了一下，如果觉着我写的不清晰，可以移步官网whistle官网

安装whistle，一共分为以下几步，缺一不可。
1.安装node
2.安装whistle
3.配置代理
4.mac安装根证书
5.ios安装根证书
6.开始抓包

1.安装node

访问https://nodejs.org/，安装LTS版本的Node，默认安装即可。
安装完Node后，执行下面命令，查看当前Node版本

$ node -v
v16.15.0

如果能正常输出Node的版本号，表示Node已安装成功(Windows系统可能需要重新打开cmd)。

2.安装whistle

Node安装成功后，执行如下npm命令安装whistle （Mac或Linux的非root用户需要在命令行前面加sudo，如：sudo npm install -g whistle）

$ npm install -g whistle

npm默认镜像是在国外，有时候安装速度很慢或者出现安装不了的情况，如果无法安装或者安装很慢，可以使用taobao的镜像安装：

$ npm install cnpm -g --registry=https://registry.npmmirror.com
$ cnpm install -g whistle

#或者直接指定镜像安装：
$ npm install whistle -g --registry=https://registry.npmmirror.com

whistle安装完成后，执行命令 whistle help 或 w2 help，查看whistle的帮助信息

test@ZBMac-VVYKNPW4G ~ % w2 help

  Usage: w2 <command> [options]


  Commands:

    status      Show the running status
    add         Add rules from local js file (.whistle.js by default)
    proxy       Set global proxy
    ca          Install root CA
    install     Install whistle plugin
    uninstall   Uninstall whistle plugin
    exec        Exec whistle plugin cmd
    run         Start a front service
    start       Start a background service
    stop        Stop current background service
    restart     Restart current background service
    help        Display help information

  Options:

    -h, --help                                      output usage information
    -D, --baseDir [baseDir]                         set the configured storage root path
    -z, --certDir [directory]                       set custom certificate store directory
    -l, --localUIHost [hostname]                    set the domain for the web ui (local.whistlejs.com by default)
    -L, --pluginHost [hostname]                     set the domain for the web ui of plugin  (as: "script=a.b.com&vase=x.y.com")
    -n, --username [username]                       set the username to access the web ui
    -w, --password [password]                       set the password to access the web ui
    -N, --guestName [username]                      set the the guest name to access the web ui (can only view the data)
    -W, --guestPassword [password]                  set the guest password to access the web ui (can only view the data)
    -s, --sockets [number]                          set the max number of cached connections on each domain (256 by default)
    -S, --storage [newStorageDir]                   set the configured storage directory
    -C, --copy [storageDir]                         copy the configuration of the specified directory to a new directory
    -c, --dnsCache [time]                           set the cache time of DNS (60000ms by default)
    -H, --host [boundHost]                          set the bound host (INADDR_ANY by default)
    -p, --port [proxyPort]                          set the proxy port (8899 by default)
    -P, --uiport [uiport]                           set the webui port
    -m, --middlewares [script path or module name]  set the express middlewares loaded at startup (as: xx,yy/zz.js)
    -M, --mode [mode]                               set the starting mode (as: pureProxy|debug|multiEnv|capture|disableH2|network|rules|plugins|prod)
    -t, --timeout [ms]                              set the request timeout (360000ms by default)
    -e, --extra [extraData]                         set the extra parameters for plugin
    -f, --secureFilter [secureFilter]               set the path of secure filter
    -r, --shadowRules [shadowRules]                 set the shadow (default) rules
    -R, --reqCacheSize [reqCacheSize]               set the cache size of request data (600 by default)
    -F, --frameCacheSize [frameCacheSize]           set the cache size of webSocket and socket's frames (512 by default)
    -A, --addon [pluginPaths]                       add custom plugin paths
    --init [bypass]                                 auto set global proxy (and bypass) and install root CA
    --config [workers]                              start the cluster server and set worker number (os.cpus().length by default)
    --cluster [config]                              load the startup config from a local file
    --dnsServer [dnsServer]                         set custom dns servers
    --socksPort [socksPort]                         set the socksv5 server port
    --httpPort [httpPort]                           set the http server port
    --httpsPort [httpsPort]                         set the https server port
    --no-global-plugins                             do not load any globally installed plugins
    --no-prev-options                               do not reuse the previous options when restarting
    --inspect [[host:]port]                         activate inspector on host:port (127.0.0.1:9229 by default)
    --inspectBrk [[host:]port]                      activate inspector on host:port and break at start of user script (127.0.0.1:9229 by default)
    -V, --version                                   output the version number

whistle常用命令参数，可以查看这篇文章whistle常用命令参数

最新版本的whistle支持三种等价的命令whistle、w2、wproxy
启动whistle:

$ w2 start

Note: 如果要防止其他人访问配置页面，可以在启动时加上登录用户名和密码：
w2 start -n yourusername -w yourpassword。建议搞一个密码，安装一点

重启whsitle:

$ w2 restart

停止whistle:

$ w2 stop

调试模式启动whistle(主要用于查看whistle的异常及插件开发):

$ w2 run

如果启动成功，会输出如下信息

test@ZBMac-VVYKNPW4G ~ % w2 start -n wangyangyang94 -w cvbnm67890
[i] whistle@2.9.15 started
[i] 1. use your device to visit the following URL list, gets the IP of the URL you can access:
       http://127.0.0.1:8899/
       http://192.168.168.168:8899/
       Note: If all the above URLs are unable to access, check the firewall settings
             For help see https://github.com/avwo/whistle
[i] 2. set the HTTP proxy on your device with the above IP & PORT(8899)
[i] 3. use Chrome to visit http://local.whistlejs.com/ to get started

注意上面的两个url：
http://127.0.0.1:8899以及http://192.168.168.168:8899。这2个ip地址，一会我们访问whistle控制台以及配置手机代理都用的上。

3.配置代理

3.1.mac增加全局代理配置

Mac: System Preferences > Network > Advanced > Proxies > HTTP or HTTPS

3.2.增加浏览器代理插件
增加这个插件原因：如果我们有多个代理，可以通过这个插件进行快速切换。我理解和switch的功能差不多。推荐安装Proxy SwitchyOmega

3.3.移动端需要在设置中配置当前Wi-Fi的代理，以 iOS 为例：

PS: 如果配置完代理，手机无法访问，可能是whistle所在的电脑防火墙限制了远程访问whistle的端口，关闭防火墙或者设置白名单：关闭防火墙或设置白名单

4.mac安装根证书

访问whistle控制台,127.0.0.1:8899。进入控制台(启动时配置了密码，需要输入配置的密码进入)
点击HTTPS选项

点击链接下载根证书

根证书下载成功后，开始给mac安装根证书
首先找到下载后的根证书，带有whistle字样。

刚打开时，文件上有一个红色的叉号，代表这个证书不被信任。我们双击这个文件，进行信任操作。
选择最上面的始终信任，下面的选项就都信任了。

信任后，证书会变成这样

5.ios安装根证书

确认一下3.3小节，手机是否配置了代理。配置后，Safari 地址栏输入 rootca.pro，按提示安装证书（或者通过 whistle 控制台的二维码扫码安装，iOS安装根证书需要到连接远程服务器进行验证，需要暂时把Https拦截功能关掉）

安装好的证书到以下位置安装：
设置—>通用—>描述文件与设备管理

点击安装即可。
iOS 10.3 之后需要手动信任自定义根证书，路径：设置—>通用—>关于本机—>证书信任设置，信任我们的whistle证书就可以了

ok，以上操作都完成后，我们就可以开始抓包了。如果要抓https的包，记得打开https抓包选项

简单说两句如何看抓到的请求

都是技术人员，不说那么细了，包都抓到了，稍微研究一下就知道咋用了。

如果按照上述步骤安装后，还是无法抓取到手机上的请求。可能有以下原因：
1.手机和电脑没有处于同一网段，需要处于同一网段或者手机wifi和电脑wifi有特殊端口能互访
2.更换网络后，手机的代理ip需要更换，保证连接的是whistle当前的代理地址
3.如果更换了网络，无法抓包，检查whistle可以抓取电脑上的请求后，手机重新下载证书，重新认证即可。

这篇好文章是转载于：学新通技术网