npm全局安裝 全局啟動 啟動之後，輸入127.0.0.1:8899 就可以訪問到whistle調試界面了： 我們主要常用幾個功能： 1、mock本地數據映射，即手機請求線上某個介面的時候做本地映射，直接請求本地json數據 2、查看console列印信息，對於windows系統的電腦來說還是很有用 ...
npm全局安裝
npm install -g whistle
全局啟動
w2 start
啟動之後，輸入127.0.0.1:8899 就可以訪問到whistle調試界面了：
我們主要常用幾個功能：
1、mock本地數據映射，即手機請求線上某個介面的時候做本地映射，直接請求本地json數據
2、查看console列印信息，對於windows系統的電腦來說還是很有用的，否則調試ios是個很大的麻煩
mock數據映射
點擊該調試界面的左邊第二個按鈕，rules，輸入想要攔截的介面 空格 本地mock數據文件路徑
eg:
net.abc.com/getlist E:\project\mock-data\ios.json
如果想要註釋掉此行，前面加 “ # ”
如果想要調試某個頁面，在頁面後面加 weinre:// 任意名稱
如果要查看某個頁面的log，在頁面後面加 log://
這些都可以同時寫在一起如下：
192.168.5.252:3001/aaa.html log:// weinre://aaa
手機代理設置
1、手機在連著和電腦同一個區域網下，手機進入wifi設置，設置代理為手動，IP地址為電腦IP地址，埠號為whistle本地調試界面打開的埠號，這裡是8899
2、安裝證書，手機瀏覽器輸入rootca.pro （或者在調試界面點HTTPS，手機掃描即可跳轉） ,會跳轉到下載證書界面，點擊下載好之後安裝，安卓需要起個名字，ios需要在 設置——通用——關於本機——證書信任設置中開關置為開。
註意：很多瀏覽器不支持下載此類文件，或者有些瀏覽器雖然可以下載此類文件但是無法安裝，因為不識別相應文件格式，可以使用扣扣瀏覽器或者其他支持的瀏覽器下載安裝即可。
小米手機獨特的解決方案，參考此文：https://blog.csdn.net/jinshitou2012/article/details/79044560
頁面調試
至此，手機點擊請求的頁面，whistle調試界面已經可以看到請求了，右側點擊tools-log，可以查看頁面console.log列印，如果想要調試html，點擊調試界面上面的weinre，找到剛剛rules配置的時候weinre後面名字點擊即可看到
點開調試界面之後還需要一步重要操作，targets下會顯示頁面調試地址，點擊地址，地址變為綠色，就可以到 【elements】中審查元素了。
其他使用方法參考官方文檔：http://wproxy.org/whistle/
推薦好文：https://segmentfault.com/a/1190000014891582
