抓包是開發調試移動端項目的必備技能，相應的工具有很多，比如 Fiddler, Charles, Tcpdump, Wireshark
最近有同事推薦另外一款工具：Whistle，接觸了一下還挺好用，比較符合我自身的需求，比如：
一、安裝
whistle 基於 node 實現，所以請保證已經安裝了 node.js
這裏只簡述一下安裝過程，並處理一下可能會遇到的問題，詳細流程可以查看這篇文章：《一鍵安裝 Whistle》
首先通過 npm 全局安裝 whistle
npm i -g whistle
如果一切順利，安裝完成後可以執行 w2 help 查看幫助信息，但也有可能遇到以下問題：
1. 網絡異常
如果安裝很慢，甚至安裝失敗，可以切換 npm 的鏡像，建議使用 nrm 來管理
npm install nrm -g --registry=https://registry.npmmirror.com
然後使用 npm cache clean 清除緩存，切換到 taobao 或者 cnpm 的鏡像之後再重新安裝 whistle
nrm use taobao
# or
nrm use cnpm
2. nvm 異常
如果全局安裝 whistle 成功，但使用 nvm 切換 node 版本後就無法使用，報錯 command not found
這說明 whistle 沒有正確安裝到全局依賴中，而是安裝到了當前 node 版本中
其原因是在安裝 nvm 之前已經存在了一個 node 版本，也就是 system
爲了正確安裝，需要先切回之前裝 whistle 的 node 版本，卸載錯誤安裝的 whistle
nvm use default
npm uninstall whistle -g
再切換到 system，重新安裝 whistle
nvm use system
npm i whistle -g
如果依然沒有安裝到全局位置，可以參考 nvm 給出的官方建議：
二、開啓代理
安裝完成後，可以通過 w2 start 啓動服務，w2 stop 關閉服務
whistle 的默認端口是 8899，如果端口號衝突，可以在啓動時通過 -p 來指定新的端口，比如：
w2 start -p 9800
啓動服務後，可訪問配置頁面 http://local.whistlejs.com/
然後需要安裝證書，這樣就能抓取 https 的請求了
1. 全局代理
啓動服務後，可以一行代碼開啓全局代理
# 開啓全局代理
w2 proxy
# 關閉全局代理
w2 proxy off
但全局代理的情況下，無法抓取 localhost 的請求，需要添加額外的 rules
比如這裏我添加了一條名爲 test-my-app 的 rule，將 127.0.0.1:9001 映射到 app.wise.org 這個虛擬域名
2. 瀏覽器代理
可以藉助 SwitchyOmega 等 Chrome 代理插件來實現瀏覽器代理
注意：使用瀏覽器代理時，應當關閉全局代理
瀏覽器代理依然存在無法抓取 localhost 請求的問題，可以像上面那樣添加 rules 來解決
也可以添加 <-loopback> 到 SwitchOmega 的“不代理地址”中
三、數據劫持
通過設置 Rules，能實現很多功能，極大的節省調試成本，詳見《快速上手》
其中有個幾個很香的功能，也是真正讓我選擇 Whistle 的地方：
1. 注入 JS
# 注入 JS
``` wise.js
;console.log('=====wisewrong=====');
```
www.zhihu.com jsPrepend://{wise.js}
2. 查看控制檯
對於 PC 端開發似乎沒有什麼特別的，但對於移動端開發，有了這個功能就不再需要 vConsole 了
3. 替換請求
在開發的時候，有時候會遇到後端部署代碼導致接口報錯的情況，前端要想繼續調試，要麼盲寫代碼，要麼修改前端邏輯，繞過或 mock 接口
現在通過 Whistle 替換請求，就能在不動前端的情況下直接 Mock 接口
先創建一個 Values
然後新增一條替換請求的 Rule
# 替換請求
www.zhihu.com/api/v4/notifications/v2/default tpl://{cover-zhihu.json}
關於“替換請求”的詳細功能，可以閱讀《常用功能》和《操作值》
Whistle 是一個很強大的工具，除了上面介紹的功能之外，還有很多可以深挖的地方，支持域名、路徑、正則表達式、通配符、通配路徑等多種匹配方式，且可以通過Node模塊擴展功能。這裏就不一一介紹了，可以查閱官網文檔瞭解。