Fiddler_官方網(wǎng)站
Fiddler_官方文檔
Fiddler_官方視頻
Fiddler_官方插件
1、Filddler簡(jiǎn)介
Fiddler是最強(qiáng)大最好用的Web調(diào)試工具之一，它能記錄所有客戶端和服務(wù)器的http和https請(qǐng)求，允許你監(jiān)視，設(shè)置斷點(diǎn)，甚至修改輸入輸出數(shù)據(jù)，F(xiàn)iddler包含了一個(gè)強(qiáng)大的基于事件腳本的子系統(tǒng)，并且能使用.net語(yǔ)言進(jìn)行擴(kuò)展。
2、Filddler工作原理
Fiddler是以代理WEB服務(wù)器的形式工作的,瀏覽器與服務(wù)器之間通過(guò)建立TCP連接以HTTP協(xié)議進(jìn)行通信，瀏覽器默認(rèn)通過(guò)自己發(fā)送HTTP請(qǐng)求到服務(wù)器，它使用代理地址:127.0.0.1, 端口:8888. 當(dāng)Fiddler開(kāi)啟會(huì)自動(dòng)設(shè)置代理， 退出的時(shí)候它會(huì)自動(dòng)注銷代理，這樣就不會(huì)影響別的程序。不過(guò)如果Fiddler非正常退出，這時(shí)候因?yàn)镕iddler沒(méi)有自動(dòng)注銷，會(huì)造成網(wǎng)頁(yè)無(wú)法訪問(wèn)。解決的辦法是重新啟動(dòng)下Fiddler.
3、移動(dòng)端抓包配置
前提條件是：安裝Fiddler的機(jī)器，跟移動(dòng)設(shè)備在同一個(gè)網(wǎng)絡(luò)里， 否則移動(dòng)設(shè)備不能把HTTP發(fā)送到Fiddler的機(jī)器上來(lái)。
具體操作步驟如下：
Fiddler設(shè)置打開(kāi)Fiddler, Tools-> Fiddler Options。（配置完后記得要重啟Fiddler）.
選中"Allow remote computers to connect". 是允許別的機(jī)器把HTTP/HTTPS請(qǐng)求發(fā)送到Fiddler上來(lái)
配置fiddler.png
移動(dòng)設(shè)備Fiddler配置
Android手機(jī)為例：
獲取當(dāng)前電腦IP:window+R——cmd——ipconfig
獲取電腦IP.png
移動(dòng)端配置1.png
移動(dòng)端配置2.png
4、界面介紹
4.1 Fiddler主界面
4.2 工具面板
工具欄說(shuō)明：說(shuō)明注釋、重新請(qǐng)求、刪除會(huì)話、繼續(xù)執(zhí)行、流模式/緩沖模式、解碼、保留會(huì)話、監(jiān)控指定進(jìn)程、尋找、保存會(huì)話、切圖、計(jì)時(shí)、打開(kāi)瀏覽器、清除IE緩存、編碼/解碼工具、彈出控制監(jiān)控面板、MSDN、幫助。
兩種模式：
1、 緩沖模式（Buffering Mode）： Fiddler直到HTTP響應(yīng)完成時(shí)才將數(shù)據(jù)返回給應(yīng)用程序?？梢钥刂祈憫?yīng)，修改響應(yīng)數(shù)據(jù)。但是時(shí)序圖有時(shí)候會(huì)出現(xiàn)異常
2、流模式（Streaming Mode）： Fiddler會(huì)即時(shí)將HTTP響應(yīng)的數(shù)據(jù)返回給應(yīng)用程序。更接近真實(shí)瀏覽器的性能。時(shí)序圖更準(zhǔn)確。但是不能控制響應(yīng)。
4.3會(huì)話面板
4.4 監(jiān)控面板
統(tǒng)計(jì)報(bào)表
(1) 請(qǐng)求總數(shù)、請(qǐng)求包大小、響應(yīng)包大??；
(2) 請(qǐng)求起始時(shí)間、響應(yīng)結(jié)束時(shí)間、握手時(shí)間、等待時(shí)間、路由時(shí)間、TCP/IP傳輸時(shí)間；
(3) HTTP狀態(tài)碼統(tǒng)計(jì)；
(4) 返回的各種類型數(shù)據(jù)的大小統(tǒng)計(jì)以及餅圖展現(xiàn)。
時(shí)間軸
每個(gè)網(wǎng)絡(luò)請(qǐng)求都會(huì)經(jīng)歷域名解析、建立連接、發(fā)送請(qǐng)求、接受數(shù)據(jù)等階段。把多個(gè)請(qǐng)求以時(shí)間作為 X 軸，用圖表的形式展現(xiàn)出來(lái)，就形成了瀑布圖。在Fiddler 中，只要在左側(cè)選中一些請(qǐng)求，右側(cè)選擇Timeline標(biāo)簽，就可以看到這些請(qǐng)求的瀑布圖
1）綠色的請(qǐng)求表示這是一個(gè)“有條件的請(qǐng)求”。HTTP 協(xié)議定義了 5 個(gè)條件請(qǐng)求頭部，最常見(jiàn)的兩個(gè)是“If-Modified-Since”和“If-None-Match”。服務(wù)器根據(jù)這兩個(gè)頭部來(lái)驗(yàn)證本地緩存是否過(guò)期，如果過(guò)期則正常返回資源的最新版本；否則僅返回 304 Not Modified，瀏覽器繼續(xù)使用本地緩存。包含條件請(qǐng)求頭部的請(qǐng)求用綠色顯示，否則用黑色。
2）有陰影線的請(qǐng)求是緩沖模式下的請(qǐng)求，實(shí)心的是流模式下的請(qǐng)求。Fiddler 提供了緩沖（Buffering）和流（Streaming）兩種抓包模式：緩沖模式下，F(xiàn)iddler 會(huì)在響應(yīng)完成時(shí)才將數(shù)據(jù)返回給應(yīng)用程序（通常是瀏覽器），這種模式下可以控制響應(yīng)，方便地修改響應(yīng)內(nèi)容；流模式下，F(xiàn)iddler 會(huì)實(shí)時(shí)返回響應(yīng)數(shù)據(jù)給瀏覽器，但沒(méi)辦法控制響應(yīng)。一般使用流模式，瀑布圖會(huì)更真實(shí)一些。這兩種模式可以通過(guò) Fiddler 的工具欄選擇。特別的，通過(guò) Fiddler 的“AutoResponder”功能返回的響應(yīng)，只能是緩沖模式。
3）請(qǐng)求條的不同顏色對(duì)應(yīng)著不同類型的響應(yīng)，根據(jù)響應(yīng)頭的 MIME Type 來(lái)歸類。如淺綠色表示圖片類型的響應(yīng)；深綠色是 JavaScript；紫色是 CSS；其它都是藍(lán)色。
4）請(qǐng)求中的黑色豎線，表示的是瀏覽器收到服務(wù)端響應(yīng)的第一個(gè)字節(jié)這一時(shí)刻。這個(gè)時(shí)間受 DNS 解析、建立連接、發(fā)送請(qǐng)求、等待服務(wù)端響應(yīng)等步驟的影響。
5）請(qǐng)求條后面的圖標(biāo)表示響應(yīng)的某些特征。如軟盤圖標(biāo)表示這個(gè)響應(yīng)正文從本地獲得，也就是說(shuō)服務(wù)端返回了 304；閃電表示這是 Fiddler 的“AutoResponder”的響應(yīng)；向下的箭頭表示響應(yīng)是 302，需要重定向；紅色感嘆號(hào)說(shuō)明這個(gè)請(qǐng)求有錯(cuò)誤發(fā)生（狀態(tài)碼是 4XX 或 5XX）。特別的，如果請(qǐng)求條后面有一個(gè)紅色的X，說(shuō)明服務(wù)端響應(yīng)完這個(gè)請(qǐng)求之后，斷開(kāi)了連接。出現(xiàn)這種情況一般有兩種可能：HTTP/1.0 的響應(yīng)中沒(méi)有 Connection: Keep-Alive；或者是 HTTP/1.1 的響應(yīng)中包含了 Connection: close。使用持久連接可以省去建立連接的開(kāi)銷，也可以減小 TCP 慢啟動(dòng)和其它擁塞控制機(jī)制帶來(lái)的影響，總之是好處多多。
6）請(qǐng)求前面的紅色圓圈表示這個(gè)連接是新建的，綠色表示是復(fù)用的。上面的圓圈表示的是瀏覽器到 Fiddler 的連接，下面的圓圈是 Fiddler 到服務(wù)端的連接。
4.5 狀態(tài)面板
控制臺(tái)
Fiddler的左下角有一個(gè)命令行工具叫做QuickExec,允許你直接輸入命令。
help 打開(kāi)官方的使用頁(yè)面介紹，所有的命令都會(huì)列出來(lái)
cls 清屏 (Ctrl+x 也可以清屏)
select 選擇會(huì)話的命令
?.png 用來(lái)選擇png后綴的圖片
bpu 截獲request
bpafter 截獲response
5、HTTP協(xié)議簡(jiǎn)介
5.1、HTTP消息的結(jié)構(gòu)
5.1.1、Request
先看Request 消息的結(jié)構(gòu), Request 消息分為3部分，第一部分叫Request line, 第二部分叫Request header, 第三部分是body. header和body之間有個(gè)空行。第一行中的Method表示請(qǐng)求方法,比如"POST","GET", Path-to-resoure表示請(qǐng)求的資源， Http/version-number 表示HTTP協(xié)議的版本號(hào),當(dāng)使用的是"GET" 方法的時(shí)候， body是為空的。
5.1.2、Response
5.2 狀態(tài)碼
Response 消息中的第一行叫做狀態(tài)行，由HTTP協(xié)議版本號(hào)， 狀態(tài)碼， 狀態(tài)消息 三部分組成。
狀態(tài)碼用來(lái)告訴HTTP客戶端,HTTP服務(wù)器是否產(chǎn)生了預(yù)期的Response.
HTTP/1.1中定義了5類狀態(tài)碼， 狀態(tài)碼由三位數(shù)字組成，第一個(gè)數(shù)字定義了響應(yīng)的類別
1XX —— 提示信息，表示請(qǐng)求已被成功接收，繼續(xù)處理
2XX —— 成功，表示請(qǐng)求已被成功接收，理解，接受
3XX —— 重定向，要完成請(qǐng)求必須進(jìn)行更進(jìn)一步的處理
4XX —— 客戶端錯(cuò)誤，請(qǐng)求有語(yǔ)法錯(cuò)誤或請(qǐng)求無(wú)法實(shí)現(xiàn)
5XX —— 服務(wù)器端錯(cuò)誤，服務(wù)器未能實(shí)現(xiàn)合法的請(qǐng)求
常見(jiàn)響應(yīng)碼說(shuō)明：
200：響應(yīng)成功，這表明該請(qǐng)求被成功地完成，所請(qǐng)求的資源發(fā)送回客戶端
302：重定向，新的URL會(huì)在response 中的Location中返回，瀏覽器將會(huì)自動(dòng)使用新的URL發(fā)出新的Request
304：代表上次的文檔已經(jīng)被緩存了， 還可以繼續(xù)使用，例如打開(kāi)博客園首頁(yè), 發(fā)現(xiàn)很多Response 的status code 都是304
[提示： 如果你不想使用本地緩存可以用Ctrl+F5 強(qiáng)制刷新頁(yè)面]
400 ： 客戶端請(qǐng)求與語(yǔ)法錯(cuò)誤，不能被服務(wù)器所理解
403：服務(wù)器收到請(qǐng)求，但是拒絕提供服務(wù)
404 ：找不到網(wǎng)頁(yè)，請(qǐng)求的資源不存在
500 ： 服務(wù)器發(fā)生了不可預(yù)期的錯(cuò)誤
503 ：服務(wù)器當(dāng)前不能處理客戶端的請(qǐng)求，一段時(shí)間后可能恢復(fù)正常
6、 常用功能
6.1 監(jiān)聽(tīng)HTTPS
6.2 HOST切換
6.3 模擬各類場(chǎng)景
通過(guò)GZIP壓縮，測(cè)試性能
模擬Agent測(cè)試，查看服務(wù)端是否對(duì)不同客戶端定制響應(yīng)
模擬慢速網(wǎng)絡(luò)，測(cè)試頁(yè)面的容錯(cuò)性
禁用緩存，方便調(diào)試一些靜態(tài)文件或測(cè)試服務(wù)端響應(yīng)情況
低網(wǎng)速模擬有時(shí)出于兼容性考慮或者對(duì)某處進(jìn)行性能優(yōu)化，在低網(wǎng)速下往往能較快發(fā)現(xiàn)問(wèn)題所在也容易發(fā)現(xiàn)性能瓶頸，可惜其他調(diào)試工具沒(méi)能提供低網(wǎng)速環(huán)境，而強(qiáng)大的Fiddler考慮到了這一點(diǎn)，能夠進(jìn)行低網(wǎng)速模擬設(shè)置Rules > Performance > Stimulate Modem Speeds。
6.4 Compare（對(duì)比文本）
6.5 Composer（構(gòu)造器）
請(qǐng)求構(gòu)造顧名思義就是我們可以模擬請(qǐng)求，也就是說(shuō)我們可以借助Fiddler的Composer 在不改動(dòng)開(kāi)發(fā)環(huán)境實(shí)際代碼的情況下修改請(qǐng)求中的參數(shù)值并且方便的重新調(diào)用一次該請(qǐng)求，然后相比較2次請(qǐng)求響應(yīng)有何具體不同。任何一個(gè)請(qǐng)求參數(shù)只要是合法的取值再次調(diào)用后都會(huì)有相應(yīng)的響應(yīng)，那么你想要的任意一個(gè)合法請(qǐng)求組合自然也能夠按照你的意愿構(gòu)造出來(lái)，然后再次調(diào)用以及查看返回?cái)?shù)據(jù)。
6.6 Filters(過(guò)濾監(jiān)控)
對(duì)一個(gè)重新載入的頁(yè)面進(jìn)行抓包，如果包的條目過(guò)多而你需要關(guān)注的就那么幾項(xiàng)的話，可以使用Fiddler的過(guò)濾器Filters進(jìn)行抓包，那么抓包時(shí)只會(huì)抓取你希望抓到的那些包。切換到Filters標(biāo)簽勾選Use filter，以便激活過(guò)濾器，這樣下面的各種過(guò)濾方式就可以進(jìn)行選擇了。
6.7 AutoResponder(請(qǐng)求重定向)
所謂請(qǐng)求無(wú)非就是需要調(diào)用到的一些資源(包括JS、CSS和圖片等)，所謂重定向就是將頁(yè)面原本需要調(diào)用的資源指向其他資源(你能夠控制的資源或者可以引用到的資源)。
你可以將前臺(tái)服務(wù)器的諸多或者某個(gè)資源在本地做個(gè)副本，如果正常網(wǎng)絡(luò)訪問(wèn)環(huán)境下該資源出現(xiàn)了BUG而導(dǎo)致開(kāi)發(fā)環(huán)境崩潰時(shí)，可以先將這個(gè)資源的請(qǐng)求重定向到本地副本，這樣就可以繼續(xù)進(jìn)行開(kāi)發(fā)調(diào)試你的頁(yè)面，從而大量節(jié)省資源維護(hù)的等待時(shí)間。
你也可以將多人同時(shí)維護(hù)的某個(gè)JS文件復(fù)制一份出來(lái)在本地，當(dāng)你的開(kāi)發(fā)調(diào)試收到他人調(diào)試代碼干擾時(shí)，可以將這個(gè)JS的調(diào)用重定向到本地?zé)o干擾的JS文件，進(jìn)行無(wú)干擾開(kāi)發(fā)，功能開(kāi)發(fā)完成并調(diào)試OK之后再將你的代碼小心合入到開(kāi)發(fā)環(huán)境中，這樣就可以避免受到他人干擾專心搞你的模塊開(kāi)發(fā)，也就是說(shuō)能夠?qū)S文件脫離開(kāi)發(fā)環(huán)境卻不影響線上調(diào)試。
你還可以將樣式文件或者圖片指向本地。
6.8 Fiddler中設(shè)置斷點(diǎn)修改Request和Response
Fiddler最強(qiáng)大的功能莫過(guò)于設(shè)置斷點(diǎn)了，設(shè)置好斷點(diǎn)后，你可以修改httpRequest的任何信息包括host, cookie或者表單中的數(shù)據(jù)。設(shè)置斷點(diǎn)有兩種方法：
第一種：打開(kāi)Fiddler 點(diǎn)擊Rules-> Automatic Breakpoint ->Before Requests(這種方法會(huì)中斷所有的會(huì)話)
如何消除命令呢？ 點(diǎn)擊Rules-> Automatic Breakpoint ->Disabled
第二種: 在命令行中輸入命令: bpu www.baidu.com (這種方法只會(huì)中斷www.baidu.com)
如何消除命令呢？ 在命令行中輸入命令 bpu
Fiddler中設(shè)置斷點(diǎn)修改Response跟斷點(diǎn)修改Request用法差不多。
參考文檔：http://www.cnblogs.com/FounderBox/p/4653588.html?utm_source=tuicool&utm_medium=referral
http://kb.cnblogs.com/page/130367/
