移動端調試神器 whistle

移動端h5頁面嵌入的方式多種多樣，普通的chrome真機調試功能有時就不能知足要求了。

whistle經過設置wifi服務器代理的方式，能夠抓包調試全部移動端請求的頁面。

whistle的github地址：https://github.com/avwo/whistle/blob/master/README-zh_CN.md。

總的來講，分紅3步：

　　1. 啓動代理服務器。

　　　　依託node，全局安裝whistle，經過 whistle start 命令啓動。

　　2. 瀏覽器設置代理服務器，用於顯示抓包調試內容。

　　　　目前僅限chrome瀏覽器。推薦使用switchOmega插件。主要須要配置ip地址和端口號。

　　3. 手機wifi設置代理服務器。

 

 

下面來講說代理服務器：

　　代理服務器至關於一箇中轉站。假設坐在家中的小張，忽然想喝甜品店的紫薯麥麥拿鐵，

　　不用代理時，小張直接打電話給甜品店：「歪~來杯熱的紫薯麥麥拿鐵~」；

　　設置代理時，小張須要給中轉站打電話：「我想要甜品店的紫薯麥麥拿鐵」，中轉站給甜品店打電話：「要一杯熱的紫薯麥麥拿鐵」，拿到後再給小張。

 

whitle功能很強大，

能夠調出控制檯，顯示打印信息；

查看並調整dom結構；

查看css樣式。

更多功能及詳細用法，能夠參考文檔：http://wproxy.org/whistle/