whistle--跨平臺網絡抓包調試工具

whistle--跨平臺網絡抓包調試工具

whistle

[TOC]css

簡介

whistle是一款跨平臺的網絡抓包調試工具,基於node開發。支持抓包,重放,替換,修改等方式來調試http(s),WebSocket請求,也能夠做爲普通的http代理。其功能和經常使用的fiddler(windows),Charles(Mac)工具功能相同,不過對於開發者更加友好,操做和調試更加方便,還支持node模塊的插件。html

快速上手

安裝

npm install -g whistle // 全局安裝whistle

啓動

w2 start  //啓動whistle

配置代理 (推薦使用瀏覽器插件)

127.0.0.1:8899

配置規則

瀏覽器訪問http://local.whistlejs.com 打開whistle界面,在rule裏面配置:node

jd.com  127.0.0.1
taobao.com  127.0.0.1
tmall.com 127.0.0.1

OK,就是這麼簡單linux

安裝使用

首先須要安裝好node,官方推薦使用最新的LTS版本nodegit

安裝whistle

node環境配置成功後開始安裝whistle,非root用戶加sudogithub

npm install -g whistle

安裝完成後,執行命令whistle help或者w2 help能夠查看whistle的幫助信息,有輸出則證實已安裝成功web

$ w2 help
Usage: whistle <command> [options]

Commands:

    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]                         the base dir of config data
    -A, --ATS                                       generate Root CA for iOS ATS (Node >= 6 is required)
    -z, --certDir [directory]                       custom certificate path
    -l, --localUIHost [hostname]                    local ui host (local.whistlejs.com by default)
    -n, --username [username]                       the username of whistle
    -w, --password [password]                       the password of whistle
    -N, --guestName [username]                      the guest name
    -W, --guestPassword [password]                  the guest password
    -s, --sockets [number]                          max sockets (60 by default)
    -S, --storage [newStorageDir]                   the new local storage directory
    -C, --copy [storageDir]                         copy storageDir to newStorageDir
    -c, --dnsCache [time]                           the cache time of DNS (30000ms by default)
    -H, --host [host]                               whistle listening host(:: or 0.0.0.0 by default)
    -p, --port [port]                               whistle listening port (8899 by default)
    -P, --uiport [uiport]                           whistle ui port (8900 by default)
    -m, --middlewares [script path or module name]  express middlewares path (as: xx,yy/zz.js)
    -M, --mode [mode]                               the whistle mode (as: pureProxy|debug|multiEnv)
    -u, --uipath [script path]                      web ui plugin path
    -t, --timeout [ms]                              request timeout (66000 ms by default)
    -e, --extra [extraData]                         extra data for plugin
    -f, --secureFilter [secureFilter]               the script path of secure filter
    -R, --reqCacheSize [reqCacheSize]               the cache size of request data (512 by default)
    -F, --frameCacheSize [frameCacheSize]           the cache size of socket frames (512 by default)
    -V, --version                                   output the version number

啓動whistle

新版本的whistle支持三種等價命令whistle,w2,wproxy正則表達式

啓動whistlechrome

w2 start

重啓whistleexpress

w2 stop

中止whistle

w2 stop

啓動調試模式(啓動了一個前臺服務,主要用於查看whistle的異常及插件開發)

w2 run

配置代理

代理服務器,若是在本地則爲127.0.0.1,若是部署在遠程服務器或者虛擬機上,就改爲對應IP便可。
默認端口爲8899,若是端口被佔用,要修改端口號,能夠經過 -p來指定新的端口號

代理方式

  1. 直接配置系統代理

  2. 安裝瀏覽器代理插件,推薦方式

  3. 移動端須要配置當前WIFI的代理

如何使用

經過w2 start啓動後,訪問http://local.whistlejs.com 便可打開whistle界面。
圖片

全部經過whistle的篡改操做,均可以用過下面的配置方式實現

pattern operatorURL

pattern爲匹配請求URL,支持域名,路徑,正則,通配符等多種方式

operatorURI爲對應的操做,由協議和值組成(operatorURL = opProtocol://opValue)
支持的協議類型:協議列表

PS; {value} 則對應工具欄Values下的文件

兩邊結合一下:

# 域名匹配IP
 www.example.com  127.0.0.1
 # 帶端口的域名匹配
 www.example.com:6666  127.0.0.1
 # 帶協議的域名,支持:http、https、ws、wss、tunnel
 http://www.example.com  127.0.0.1

 # 路徑匹配,一樣支持帶協議、端口
 www.example.com/test  http://127.0.0.1:9090
 https:/www.exapmle.com/test http://127.0.0.1:9090
 https:/www.exapmle.com:6666/test  http://127.0.0.1:9090

 # 正則匹配
 /^https?://www\.example\.com\/test/(.*)/ referer://http://www.test.com/$1

 # 通配符匹配
 ^www.example.com/test/*** referer://http://www.test.com/$1

功能詳解

whistle功能歸納:

代理設置

設置http代理
pattern proxy://ip:port
# 加用戶名密碼
pattern proxy://username:password@ip:port
www.jd.com proxy://test:123@127.0.0.1:8888
設置socks代理
pattern socks://ip:port
# 加用戶名密碼
pattern socks://username:password@ip:port

www.jd.com socks://test:123@127.0.0.1:8888
設置pac代理
pattern pac://filepath

/./ pac://https://raw.githubusercontent.com/imweb/node-pac/master/test/scripts/normal.pac
設置反向代理

區別於正向代理,具體可參考 正向代理與反向代理
whistle做爲反向代理只支持http訪問,啓動whistle時設置監聽的端口爲6060:

w2 start -p 6060
#或
w2 restart -p 6060

非root用戶須要加sudo w2 start -p 6060。 ​ 根據域名、或路徑、或正則表達式配置帶端口的host:

localhost:6060/aa host://10.8.43.82:8080
localhost:6060/bb host://10.8.43.82:8081

這樣訪問localhost:6060的請求會自動轉到8080或8181端口,實現無故口訪問。 PS:若是要用IP訪問,能夠採用 http://127.0.0.1/-/xxxhttp://127.0.0.1/_/xxx,whistle會自動轉成 http://127.0.0.1/xxx

移動端調試

移動端調試的時候須要在同一個局域網內,涉及到https的鏈接須要開啓https攔截。

開啓https攔截

若是要攔截https和websockets請求,必須安裝根證書和開啓https攔截。

下載根證書

在工具欄=>https 下載 RootCA, 並勾選 intercept HTTPS CONNECTs 選項

安裝CA證書

具體參見:安裝根證書

設置手機代理

設置 => 無線局域網 => 找到對應局域網點擊感嘆號 => HTTP代理 配置代理 => 選擇手動 => 填寫whistle服務的IP和端口號

PS: 若是配置完代理,手機沒法訪問,多是whistle所在的電腦防火牆限制了遠程訪問whistle的端口,關閉防火牆或者設置白名單: http://jingyan.baidu.com/arti...

訪問界面

whistle集成了weinre的功能,只須要簡單配置pattern weinre://id便可使用。

weinre in whistle

而後點擊工具欄的weinre,選擇對應的ID打開weinre界面

移動調試

相對於PC調試,移動端調試會常遇到如下問題

  1. 沒法經過console輸出錯誤,也沒法看到頁面的js報錯
  2. 沒法查看和修改頁面的DOM和樣式
  3. 沒法debug
1.來捕獲頁面的錯誤和log

whistle能夠經過相似console的log平臺,來捕獲頁面的錯誤和log

www.jd.com log://
# 若是你想同時注入js腳本,能夠用下面一種方式
# 在mac或linux中
www.jd.com log:////Users/willhu/work/whistle-test/log-test.js
# 在windows中
www.jd.com log://D:\xxx\test.js
# 直接從whistle的Values配置的key-value裏面獲取腳本
www.jd.com log://{log-test.js}

log-test

2.查看、修改頁面的DOM和樣式

集成了weinre的功能,用戶只需經過簡單配置(pattern weinre://id)便可使用便可經過在pc上經過weinre修改網頁的DOM結構及其樣式,這裏的ID只是一個分類,避免一個weinre調試頁面出現太多連接

m.jd.com weinre://test-weinre

test-weinre

3. 暫不支持debug功能,能夠經過log來替代

推薦騰訊的vConsole插件

m.jd.com js:///Users/willhu/work/whistle-test/vconsole.min.js

vConsole: https://github.com/Tencent/vC...

demo: vConsole

文件導入導出

在network中右鍵點擊請求列表,能夠將請求的數據導出到txt.saz文件,也可導入txt.saz.har文件。

抓包重放

查看請求響應數據

在network中能夠看到每條請求的詳細狀況。

network

重放請求

打開network ==> 選中請求 ==> 右鍵選擇replay

replay-w433

重構請求

能夠自定義請求的URL、請求方法、請求頭,請求內容
Composer

請求和響應修改
修改請求URL或者參數

設置靜態規則列表

pattern reqScript://filepath
www.jd.com reqScript:///Users/willhu/work/whistle-test/rulelist.txt

rulelist.txt若是文件的第一行爲規則的註釋,即#開頭則任務filepath指定的是規則列表,會加載該列表,並進行二次匹配獲取規則

# rules
pattern1 operatorURI1
pattern2 operatorURI2
patternN operatorURIN

經過腳本設置規則列表

www.jd.com reqScript://{rulelist.js}
設置服務器IP(host)

支持兩種配置方式,這樣就不用查找本機的host文件了

ip pattern
或者
pattern host://ip

例子

# 傳統hosts配置
127.0.0.1 www.example.com # 等價於: www.example.com  127.0.0.1
127.0.0.1 a.example.com b.example.com c.example.com

# 支持帶端口
127.0.0.1:8080 www.example.com # 等價於: www.example.com  127.0.0.1:8080
127.0.0.1:8080 a.example.com b.example.com c.example.com

# 支持經過域名獲取host,相似DNS的cname
host://www.qq.com:8080 www.example.com # 等價於: www.example.com  host://www.qq.com:8080
host://www.qq.com:8080 a.example.com b.example.com c.example.com

# 支持經過正則表達式匹配
127.0.0.1:8080 /example\.com/i # 等價於: /example\.com/i  127.0.0.1:8080
127.0.0.1:8080 /example\.com/ /test\.com/

# 支持路徑匹配
127.0.0.1:8080 example.com/test # 等價於: example.com/test 127.0.0.1:8080
127.0.0.1:8080 http://example.com:5555/index.html www.example.com:6666 https://www.test.com/test

# 支持精確匹配
127.0.0.1:8080 $example.com/test # 等價於: $example.com/test 127.0.0.1:8080
127.0.0.1:8080 $http://example.com:5555/index.html $www.example.com:6666 $https://www.test.com/test
替換請求
https://jd.com https://baidu.com/
修改請求方法

配置方式以下:

pattern method://newMethod
jd.com method://post
修改請求頭

修改請求頭,配置方式:

pattern reqHeaders://filepath
jd.com reqHeaders://{reqHeaders.json}
修改請求內容

把指定的內容替換請求內容(GET等請求沒有內容沒有替換一說),配置方式

pattern reqBody://filepath
www.jd.com method://post reqBody://{test-reqBody.html}
注入或替換內容

把指定的內容添加到請求內容前面(GET等請求沒有內容沒法添加),配置方式:

pattern reqPrepend://filepath
限速或者延遲請求

延遲請求

pattern reqDelay://timeMS
www.jd.com reqDelay://3000

設置速度

pattern reqSpeed://kbs
www.jd.com reqSpeed://3
修改相應狀態碼

設置響應狀態碼(狀態碼範圍100~999),請求會直接根據設置的狀態碼返回,不會請求到線上,配置方式:

pattern statusCode://code
jd.com statusCode://404
修改響應頭

方式同請求頭

修改響應內容

把指定的內容替換響應內容(304等響應沒有內容沒法替換),配置方式:

pattern resBody://filepath
st.360buyimg.com/m/css/2014/layout/layout2015.css resBody://{myAppend.css}
注入或者替換內容

把指定的內容追加到響應內容後面(304等響應沒有內容沒法追加),配置方式:

pattern resAppend://filepath
st.360buyimg.com/m/css/2014/layout/layout2015.css resAppend://{myAppend.css}
限制速度或延遲響應

延遲響應

pattern resDelay://timeMS
www.jd.com resDelay://3000

設置速度

pattern resSpeed://kbs
www.jd.com resSpeed://3

插件擴展

有些不多用的功能,及一些跟業務相關的功能,考慮到會致使安裝過程比較長或者佔用內存空間或者適應範圍比較小,whistle沒有把這些功能加進去,但提供了插件的方式擴展這些功能。whistle自己就是一個Node模塊,只須要按照whistle.xxx的形式命名便可。

編寫whistle插件:如何編寫插件

官方提供的插件列表:官方插件列表

socket和websocket

利用whistle調試socket和webscoket

測試用的文件:whistle-test-files

測試用的rules: rules

整理的有些凌亂,若有不對之處,請指正,謝謝。

相關文章
相關標籤/搜索