fiddler使用教程視訊（fiddler使用方法）

Fiddler是什麼？

Fiddler是一個http協議除錯代理工具，它能夠記錄客戶端和伺服器之間的所有 HTTP請求，可以針對特定的HTTP請求，分析請求資料、設定斷點、除錯web應用、修改請求的資料，甚至可以修改伺服器返回的資料，功能非常強大，是web除錯的利器。

Fiddler的主要功能

  1. 截獲從瀏覽器或者客戶端軟體向伺服器傳送的http/https請求
  2. 修改客戶端請求或服務端響應
  3. 建立自動響應規則
  4. 模擬弱網場景
  5. 提供第三方擴充套件外掛，測試網站效能

Fiddler工作原理

Fiddler是以代理WEB伺服器的形式工作的，瀏覽器/客戶端與伺服器之間通過建立TCP連線以HTTP協議進行通訊，它使用代理地址:127.0.0.1，埠:8888

啟動fiddler後，預設配置代理為8888,具體配置如下：

並且啟動fiddler後，會自動配置計算機的代理。

主要功能介面介紹

1、備註：新增之後在會話欄的Comment列中顯示備註內容

2、Replay：再次傳送對應請求【常用】

3、清除會話面板

4、Go：斷點除錯，點選go，執行下一步

5、Stream：代理模式。預設：緩衝模式。點選進行切換。

a.流模式streaming：將客戶端的請求資料實時的傳給服務端，更接近於瀏覽器本身的真實行為。

b.緩衝模式buffering：將客戶端的請求資料緩衝起來，等資料寫完之後再傳給服務端。

6、Decode：解壓請求。解壓http請求裡面的東西，幫助檢視響應內容【常用】

7、 Keep：保持會話的數目

8、Any Process：捕獲請求，只看需要的請求。將“靶心”投向需要的請求

9、Find：查詢請求，可以高亮所查詢的請求【常用】

10、Save：儲存會話

11、截圖，預設5秒後截圖（電腦全屏）

12、計時器

13、Browse：點選會話，再點選Browse，啟動瀏覽器傳送此請求，快速啟動瀏覽器

14、Clear Cache：清空瀏覽器快取

15、TextWizard：編碼、解碼文字內容，一般包含中文的請求都需要解碼才能看到，所以複製url到TextWizard，然後選擇URLDecode【常用】

16、TearOff：浮窗

刪除

清除所有對話

清除載入圖片的請求

清除使用http connect方法的請求

清除狀態碼非200的請求

清除非瀏覽器發出的請求

清除已響應請求且未標記的請求

清除響應body一樣的請求，只保留一個

列表會話圖示

Fiddler功能面板

1、statistics：請求的效能指標；全世界範圍的效能測試；

RTP：一個請求的從傳送出去到返回的時間；

Show chart可以看出圖表的示例；

2、inspectors:對請求和響應解包檢查

  • header：請求頭資訊。UA,cookie,傳送請求來源。
  • textView:以text方法檢視資料；
  • imageview:可以看到返回的圖片（如果有圖片返回的話）
  • webforms:以form表單方式檢視請求的資訊；
  • cookies：請求攜帶的cookie；
  • response header：響應報文的標頭檔案
  • raw：檢視原始資料，此方式檢視顯示最全,及顯示HTTP的原始報文
  • json：以json方式檢視資料
  • xml：以xml方式檢視資料

3、autoresponder: 檔案代理：可以使用fiddler來自定義請求返回的檔案。

當我們線上的出現bug的時候，可以使用線上返回 的檔案在本地做一個修改，看看bug是否解除。

4、composer：前後端介面聯調：可以將條目拖到composer然後進行模擬執行；偽造請求。不寫js實現跟伺服器互動。類似postman。

5、log : 使用fiddler的日誌；

6、filters：過濾功能，可以很好幫助只顯示我們關心的請求或者隱藏掉不關心的請求。

7、timeline: 網站效能分析，一個網站的請求多個網站請求進行，選中檢視timeline檢視請求詳情。

Statistics資料統計面板，效能分析

重點：主要關注RTT，體現一個請求從傳送到返回響應的時間

  1. 反映一個請求的效能指標，其中主要關注RTT
  2. 會展示全世界範圍的請求平均資料
  3. show chart按鈕，從餅狀圖中分別出哪些資源的請求耗時最多，從而對頁面的訪問進行訪問速度優化

Inspectors 檢視請求與響應

Headers：檢視Header

WebForms：用表格的形式檢視body的值和請求引數的值

TextView/WebView：以文字/web瀏覽器檢視資料

Cookies：檢視header中cookie的值

Raw：檢視完整的原始報文結構

JSON/XML：以JSON/XML格式檢視資料

Filters過濾器

(1) User Filters啟用

(2) Action

Action：

  • Run Filterset now執行過濾器
  • Load Filterset匯入過濾規則
  • Save Filterset儲存過濾器到本地

過濾監控會話，篩選和標記會話，或進行一些輕量級的修改；fiddler預設會檢查http頭中設定的host，標記或隱藏部分會話，選擇隱藏的時候，fiddler仍然會代理通訊的主機，只是將對應會話隱藏在監控面板

備註：文字框內輸入需要標記或過濾的域名，多個域名使用”;”分號分割

Composer 構造器

Fiddler Composer的功能就是用來建立HTTP Request 然後傳送。你可以自定義一個Request, 也可以手寫一個Request，你甚至可以在Web會話列表中拖拽一個已有的Request，來建立一個新的HTTP Request。

簡單來說，Composer可以用來介面測試，支援前後端介面連調，支援多種型別的請求，如GET、POST。其中，POST請求的引數寫在request body中、一般協議選擇HTTP1.1。

Composer使用操作如下：

  1. 將左側監控面板中截獲到的請求，拖到composer面板中
  2. 修改parsed框Request Body（post請求需要修改，get請求不需要修改）中的值
  3. 點選右上角【Execute】按鈕，即可按照修改後的請求頭和引數值重新發起一次請求，重新發起的請求在左側監控面板中可檢視，修改後的請求內容在右側history中有記錄

Fiddler Composer的優勢

  • 能從"Web會話列表"中，拖拽一個先前捕獲到的Request，可以進行篡改資料；
  • 傳送Request後，可以設定斷點，繼續修改Request；
  • 支援在Request中上傳檔案；
  • 支援重複傳送多次Request。

Composer的實操

timeline網站效能分析

選中多個請求，進行網站效能分析

  1. Y軸：傳送的請求列表
  2. 進度條為多線條型，則為緩衝模式；進度條為平滑的柱狀，則為流模式
  3. 綠色圓圈：連線被重用；紅色圓圈：新建立的連線
  4. 頂部圓圈：客戶端連線到fiddler，下部圓圈：fiddler連線到目標伺服器
  5. 灰色箭頭圖示/紅色！圖示/綠色閃電圖示：伺服器返回一個錯誤程式碼（3XX，4XX，5XX）
  6. 結尾處的紅色X:意味著伺服器傳送了一個連線，連線被關閉或為private型別