發(fā)布時間：2017-03-06 16:07

  本文關(guān)鍵詞：Fiddler調(diào)試權(quán)威指南，由筆耕文化傳播整理發(fā)布。

參考 小坦克

1. 簡介

Fiddler（中文名稱：小提琴）是一個HTTP的調(diào)試代理，以代理服務(wù)器的方式，監(jiān)聽系統(tǒng)的Http網(wǎng)絡(luò)數(shù)據(jù)流動， Fiddler可以也可以讓你檢查所有的HTTP通訊，設(shè)置斷點(diǎn)，以及Fiddle所有的“進(jìn)出”的數(shù)據(jù)（我一般用來抓包）,Fiddler還包含一個簡單卻功能強(qiáng)大的基于JScript .NET事件腳本子系統(tǒng)，它可以支持眾多的HTTP調(diào)試任務(wù)。

Fiddler官方網(wǎng)站提供了大量的幫助文檔和視頻教程,這是學(xué)習(xí)Fiddler的最好資料

2. 工作原理

Fiddler是以代理WEB服務(wù)器的形式工作的,瀏覽器與服務(wù)器之間通過建立TCP連接以HTTP協(xié)議進(jìn)行通信，瀏覽器默認(rèn)通過自己發(fā)送HTTP請求到服務(wù)器，它使用代理地址:127.0.0.1, 端口:8888. 當(dāng)Fiddler開啟會自動設(shè)置代理， 退出的時候它會自動注銷代理，這樣就不會影響別的程序。不過如果Fiddler非正常退出，這時候因為Fiddler沒有自動注銷，會造成網(wǎng)頁無法訪問。解決的辦法是重新啟動下Fiddler.

3. HTTP協(xié)議簡介 3.1 什么是HTTP協(xié)議

協(xié)議是指計算機(jī)通信網(wǎng)絡(luò)中兩臺計算機(jī)之間進(jìn)行通信所必須共同遵守的規(guī)定或規(guī)則，超文本傳輸協(xié)議(HTTP)是一種通信協(xié)議，它允許將超文本標(biāo)記語言(HTML)文檔從Web服務(wù)器傳送到客戶端的瀏覽器，目前我們使用的是HTTP/1.1 版本。

3.2 URL詳解

URL(Uniform Resource Locator) 地址用于描述一個網(wǎng)絡(luò)上的資源, 基本格式如下

schema://host[:port#]/path/.../[?query-string][#anchor]

名稱 解釋

scheme 指定低層使用的協(xié)議(例如：http, https, ftp)

host HTTP服務(wù)器的IP地址或者域名

port# HTTP服務(wù)器的默認(rèn)端口是80，這種情況下端口號可以省略。如果使用了別的端口，必須指明，例如 :8080/

path 訪問資源的路徑

query-string 發(fā)送給http服務(wù)器的數(shù)據(jù)

anchor 錨

3.3 HTTP消息的結(jié)構(gòu)

Request

先看Request 消息的結(jié)構(gòu), Request 消息分為3部分，第一部分叫Request line, 第二部分叫Request header, 第三部分是body. header和body之間有個空行

第一行中的Method表示請求方法,比如"POST","GET", Path-to-resoure表示請求的資源， Http/version-number 表示HTTP協(xié)議的版本號,當(dāng)使用的是"GET" 方法的時候， body是為空的

Response

我們再看Response消息的結(jié)構(gòu), 和Request消息的結(jié)構(gòu)基本一樣。 同樣也分為三部分,第一部分叫Response line, 第二部分叫Response header，第三部分是body. header和body之間也有個空行

3.4 狀態(tài)碼

Response 消息中的第一行叫做狀態(tài)行，由HTTP協(xié)議版本號， 狀態(tài)碼， 狀態(tài)消息 三部分組成。
狀態(tài)碼用來告訴HTTP客戶端,HTTP服務(wù)器是否產(chǎn)生了預(yù)期的Response.
HTTP/1.1中定義了5類狀態(tài)碼， 狀態(tài)碼由三位數(shù)字組成，第一個數(shù)字定義了響應(yīng)的類別

狀態(tài)碼 解釋

1XX 提示信息，表示請求已被成功接收，繼續(xù)處理

2XX 成功，表示請求已被成功接收，理解，接受

3XX 重定向，要完成請求必須進(jìn)行更進(jìn)一步的處理

4XX 客戶端錯誤，請求有語法錯誤或請求無法實現(xiàn)

5XX 服務(wù)器端錯誤，服務(wù)器未能實現(xiàn)合法的請求

200 OK
最常見的就是成功響應(yīng)狀態(tài)碼200了， 這表明該請求被成功地完成，所請求的資源發(fā)送回客戶端

302 Found
重定向，新的URL會在response 中的Location中返回，瀏覽器將會自動使用新的URL發(fā)出新的Request

例如在IE中輸入， HTTP服務(wù)器會返回302， IE取到Response中Location header的新URL, 又重新發(fā)送了一個Request.

304 Not Modified
代表上次的文檔已經(jīng)被緩存了， 還可以繼續(xù)使用，例如打開博客園首頁, 發(fā)現(xiàn)很多Response 的status code 都是304
[提示：　如果你不想使用本地緩存可以用Ctrl+F5 強(qiáng)制刷新頁面]

400 Bad Request 客戶端請求與語法錯誤，不能被服務(wù)器所理解

403 Forbidden 服務(wù)器收到請求，但是拒絕提供服務(wù)

404 Not Found

500 Internal Server Error 服務(wù)器發(fā)生了不可預(yù)期的錯誤

503 Server Unavailable 服務(wù)器當(dāng)前不能處理客戶端的請求，一段時間后可能恢復(fù)正常

4. 界面操作 4.1 主界面

Fiddler的主界面分為 工具面板、會話面板、監(jiān)控面板、狀態(tài)面板，下面進(jìn)行一一介紹。

4.2 工具面板

說明
注釋、重新請求、刪除會話、繼續(xù)執(zhí)行、流模式/緩沖模式、解碼、保留會話、監(jiān)控指定進(jìn)程、尋找、保存會話、切圖、計時、打開瀏覽器、清除IE緩存、編碼/解碼工具、彈出控制監(jiān)控面板、MSDN、幫助

兩種模式

緩沖模式（Buffering Mode）
Fiddler直到HTTP響應(yīng)完成時才將數(shù)據(jù)返回給應(yīng)用程序。可以控制響應(yīng)，修改響應(yīng)數(shù)據(jù)。但是時序圖有時候會出現(xiàn)異常

流模式（Streaming Mode）
Fiddler會即時將HTTP響應(yīng)的數(shù)據(jù)返回給應(yīng)用程序。更接近真實瀏覽器的性能。時序圖更準(zhǔn)確。但是不能控制響應(yīng)。

4.3 會話面板

4.4 監(jiān)控面板

統(tǒng)計報表

(1) 請求總數(shù)、請求包大小、響應(yīng)包大�。�

(2) 請求起始時間、響應(yīng)結(jié)束時間、握手時間、等待時間、路由時間、TCP/IP傳輸時間；

(3) HTTP狀態(tài)碼統(tǒng)計；

(4) 返回的各種類型數(shù)據(jù)的大小統(tǒng)計以及餅圖展現(xiàn)。

時間軸
每個網(wǎng)絡(luò)請求都會經(jīng)歷域名解析、建立連接、發(fā)送請求、接受數(shù)據(jù)等階段。把多個請求以時間作為 X 軸，用圖表的形式展現(xiàn)出來，就形成了瀑布圖。在Fiddler 中，只要在左側(cè)選中一些請求，右側(cè)選擇Timeline標(biāo)簽，就可以看到這些請求的瀑布圖

看到這張圖，你是否可以回答這些問題：

每個請求前面兩個小圓圈是什么，為什么有的是紅色，有的是綠色？
下面將一一揭曉。

4.5 狀態(tài)面板

控制臺
Fiddler的左下角有一個命令行工具叫做QuickExec,允許你直接輸入命令。
常見得命令有

命令 解釋

help 打開官方的使用頁面介紹，所有的命令都會列出來

cls 清屏 (Ctrl+x 也可以清屏)

select 選擇會話的命令

?.png 用來選擇png后綴的圖片

bpu 截獲request

bpafter 截獲response

5. 常用功能 5.1 監(jiān)聽HTTPS

Fiddler不僅能監(jiān)聽HTTP請求而且默認(rèn)情況下也能捕獲到HTTPS請求，Tool -> Fiddler Option -> HTTPS下面進(jìn)行設(shè)置，勾選上“Decrypt HTTPS traffic”，如果不必監(jiān)聽服務(wù)器端得證書錯誤可以勾上“Ignore server certification errors”，也可以跳過幾個指定的HOST來縮小或者擴(kuò)大監(jiān)聽范圍。

HTTPS例子：
https://pay.tenpay.com/main/app/v1.0/trans_manage.cgi?OutPutType=JSON

5.2 HOST切換

5.2 模擬各類場景

根據(jù)一些場景自定義規(guī)則

低網(wǎng)速模擬
有時出于兼容性考慮或者對某處進(jìn)行性能優(yōu)化，在低網(wǎng)速下往往能較快發(fā)現(xiàn)問題所在也容易發(fā)現(xiàn)性能瓶頸，可惜其他調(diào)試工具沒能提供低網(wǎng)速環(huán)境，而強(qiáng)大的Fiddler考慮到了這一點(diǎn)，能夠進(jìn)行低網(wǎng)速模擬設(shè)置Rules > Performance > Stimulate Modem Speeds。

5.3 Compare（對比文本）

5.4 Composer（構(gòu)造器）

請求構(gòu)造顧名思義就是我們可以模擬請求，也就是說我們可以借助Fiddler的Composer 在不改動開發(fā)環(huán)境實際代碼的情況下修改請求中的參數(shù)值并且方便的重新調(diào)用一次該請求，然后相比較2次請求響應(yīng)有何具體不同。任何一個請求參數(shù)只要是合法的取值再次調(diào)用后都會有相應(yīng)的響應(yīng)，那么你想要的任意一個合法請求組合自然也能夠按照你的意愿構(gòu)造出來，然后再次調(diào)用以及查看返回數(shù)據(jù)，十分方便！

下面舉一個交易查詢請求構(gòu)造的例子。首先進(jìn)入交易查詢頁面抓包找到目標(biāo)請求https://pay.tenpay.com/main/app/v1.0/trans_manage.cgi?OutPutType=JSON，雙擊該包在Inspectors標(biāo)簽下查看返回數(shù)據(jù)為JSON格式，而XML格式一欄為空：

將該請求鼠標(biāo)左鍵單擊拖入Fiddler右側(cè)Request Builder標(biāo)簽內(nèi)并修改原請求參數(shù)OutPutType=JSON為OutPu tType=XML，然后點(diǎn)擊Execute按鈕再次觸發(fā)調(diào)用請求，

雙擊這次請求包在Inspectors標(biāo)簽下查看返回數(shù)據(jù)為XML格式，而JSON格式一欄為空：

5.5 Filters(過濾監(jiān)控)

對一個重新載入的頁面進(jìn)行抓包，如果包的條目過多而你需要關(guān)注的就那么幾項的話，可以使用Fiddler的過濾器Filters進(jìn)行抓包，那么抓包時只會抓取你希望抓到的那些包。切換到Filters標(biāo)簽勾選Use filter，以便激活過濾器，這樣下面的各種過濾方式就可以進(jìn)行選擇了。

(1).

(2).

選項1 解釋

No zone filter 不設(shè)置hosts過濾

Show Only Intranet Hosts 只顯示內(nèi)網(wǎng)HOST

Show Only Internet Hosts 只顯示外網(wǎng)HOST令

選項2 解釋

No Host Filter 不設(shè)置hosts過濾

Show Only The Following Hosts 隱藏過濾到的域名

Show Only The Following Hosts 只顯示過濾到的域名

Flag The Following Hosts 標(biāo)記過濾到的域名

5.5 AutoResponder(請求重定向)

所謂請求無非就是需要調(diào)用到的一些資源(包括JS、CSS和圖片等)，，所謂重定向就是將頁面原本需要調(diào)用的資源指向其他資源(你能夠控制的資源或者可以引用到的資源)。

(1)你可以將前臺服務(wù)器的諸多或者某個資源在本地做個副本，如果正常網(wǎng)絡(luò)訪問環(huán)境下該資源出現(xiàn)了BUG而導(dǎo)致開發(fā)環(huán)境崩潰時，可以先將這個資源的請求重定向到本地副本，這樣就可以繼續(xù)進(jìn)行開發(fā)調(diào)試你的頁面，從而大量節(jié)省資源維護(hù)的等待時間。

(2)你也可以將多人同時維護(hù)的某個JS文件復(fù)制一份出來在本地，當(dāng)你的開發(fā)調(diào)試收到他人調(diào)試代碼干擾時，可以將這個JS的調(diào)用重定向到本地?zé)o干擾的JS文件，進(jìn)行無干擾開發(fā)，功能開發(fā)完成并調(diào)試OK之后再將你的代碼小心合入到開發(fā)環(huán)境中，這樣就可以避免受到他人干擾專心搞你的模塊開發(fā)，也就是說能夠?qū)S文件脫離開發(fā)環(huán)境卻不影響線上調(diào)試。

(3)你還可以將樣式文件或者圖片指向本地如果需要的話。開發(fā)過程中的很多頁面其實都是慘不忍睹的，究其原因很大程度上是因為缺少對應(yīng)的樣式文件或者沒有圖片資源，所以樣式文件和圖片的重定向會對美感稍有要求的開發(fā)人員帶來福音。

6. 插件介紹 6.1 Format

6.2 Script

Fiddler Script 是用JScript.NET語言寫的，
JScript.NET

在這個方法中修改Request的內(nèi)容， 我們用得最多,

static function OnBeforeRequest(oSession: Session)

在這個方法中修改Response的內(nèi)容，

static function OnBeforeResponse(oSession: Session)

添加IP Main方法中添加

FiddlerObject.UI.lvSessions.AddBoundColumn("HostIP", 50, "x-hostIP");

請求，響應(yīng)延遲 在OnBeforeRequest 添加

oSession["request-trickle-delay"] = "3000"; oSession["response-trickle-delay"] = "3000";

我們可以控制Session在Fiddler中顯示的樣式，把這段腳本放在OnBeforeRequest(oSession: Session) 方法下，并且點(diǎn)擊"Save script", 這樣所有的cnblogs的會話都會顯示紅色.

if (oSession.HostnameIs("")) { oSession["ui-color"] = "red"; }

Fiddler Script中修改Cookie
Cookie其實就是request 中的一個header,注意:FiddlerScript不能直接刪除或者編輯單獨(dú)的一個cookie， 你需要用replace方法或者正則表達(dá)式的方法去操作cookie的string

static function OnBeforeRequest(oSession: Session) { if (oSession.HostnameIs('') && oSession.uriContains('pagewithCookie') && oSession.oRequest.headers.Contains("Cookie")) { var sCookie = oSession.oRequest["Cookie"]; // 用replace方法或者正則表達(dá)式的方法去操作cookie的string sCookie = sCookie.Replace("cookieName=", "ignoreme="); oSession.oRequest["Cookie"] = sCookie; }

刪除所有的cookie

oSession.oRequest.headers.Remove("Cookie");

新建cookie

oSession.oRequest.headers.Add("Cookie", "username=testname;testpassword=P@ssword1");

Fiddler Script中修改Request 中的body

static function OnBeforeRequest(oSession: Session) { if(oSession.uriContains("")) { // 獲取Request 中的body字符串 var strBody=oSession.GetRequestBodyAsString(); // 用正則表達(dá)式或者replace方法去修改string strBody=strBody.replace("1111","2222"); // 彈個對話框檢查下修改后的body FiddlerObject.alert(strBody); // 將修改后的body，重新寫回Request中 oSession.utilSetRequestBody(strBody); } }

VS插件：https://visualstudiogallery.msdn.microsoft.com/872d27ee-38c7-4a97-98dc-0d8a431cc2ed

6.3 三方插件

.NET可以開發(fā)

插件管理

7. 瀏覽器抓包方式 7.1 IE

7.2 Firefox

7.3 Chrome

7.4 VS

我們在用visual stuido 開發(fā)ASP.NET網(wǎng)站的時候也需要用Fiddler來分析HTTP， 默認(rèn)的時候Fiddler是不能嗅探到localhost的網(wǎng)站。

在localhost后面加個點(diǎn)號，F(xiàn)iddler就能嗅探到。

例如：原本ASP.NET的地址是 :2391/Default.aspx， 加個點(diǎn)號后，變成 :2391/Default.aspx 就可以了

8. 移動端抓包

Fiddler不但能截獲各種瀏覽器發(fā)出的HTTP請求, 也可以截獲各種智能手機(jī)發(fā)出的HTTP/HTTPS請求。

Fiddler能捕獲IOS,Andriod,WinPhone,設(shè)備發(fā)出的請求，同理，也可以截獲IPad, MacBook的等設(shè)備發(fā)出的HTTP/HTTPS。

前提條件是：安裝Fiddler的機(jī)器，跟Iphone 在同一個網(wǎng)絡(luò)里， 否則IPhone不能把HTTP發(fā)送到Fiddler的機(jī)器上來。

具體操作步驟如下：

Fiddler設(shè)置
打開Fiddler, Tools-> Fiddler Options。（配置完后記得要重啟Fiddler）.

選中"Allow remote computers to connect". 是允許別的機(jī)器把HTTP/HTTPS請求發(fā)送到Fiddler上來

獲取Fiddler所在機(jī)器的IP

安裝Fiddler證書
這一步是為了讓Fiddler能捕獲HTTPS請求。 如果你只需要截獲HTTP請求， 可以忽略這一步

首先要知道Fiddler所在的機(jī)器的IP地址：　假如我安裝了Fiddler的機(jī)器的IP地址是:192.168.1.104
打開IPhone 的Safari, 訪問 :8888， 點(diǎn)"FiddlerRoot certificate" 然后安裝證書

打開IPhone, 找到你的網(wǎng)絡(luò)連接， 打開HTTP代理， 輸入Fiddler所在機(jī)器的IP地址(比如:192.168.1.104) 以及Fiddler的端口號8888

9. 推薦書籍

《Fiddler調(diào)試權(quán)威指南》是Fiddler的開發(fā)者Eric Lawrence編寫的一本權(quán)威的參考指南。全書分為10章和4個附錄，從認(rèn)識Fiddler開始，介紹了基本技巧和概念、配置選項、Inspectors、擴(kuò)展、數(shù)據(jù)流導(dǎo)入導(dǎo)出、FiddlerScript和FiddlerCore等主題；附錄部分還給出了故障排除和命令行等有用的參考信息。

《Fiddler調(diào)試權(quán)威指南》適合Web開發(fā)人員和Web測試人員閱讀參考，也適合想要學(xué)習(xí)和掌握Fiddler的讀者閱讀。通過《Fiddler調(diào)試權(quán)威指南》，你將學(xué)會如何利用Fiddler調(diào)試Web相關(guān)的應(yīng)用，掌握如何調(diào)試HTTPS數(shù)據(jù)流，學(xué)會如何在流行的設(shè)備上使用Fiddler，甚至掌握更多高級的擴(kuò)展功能。

10. 其他抓包工具

同類的工具有 : HttpWatch, Firebug,Chrome自帶調(diào)試工具，WireShark

11. 總結(jié) 通過以上的介紹，你應(yīng)該已經(jīng)發(fā)現(xiàn)fiddler其它強(qiáng)大的功能。fiddler絕對是開發(fā)利器。

  本文關(guān)鍵詞：Fiddler調(diào)試權(quán)威指南，由筆耕文化傳播整理發(fā)布。

本文編號：248318