Fiddler的功能

1. 監(jiān)控HTTP流量
2. 查看截獲的請求內(nèi)容, 偽造請求
3. 測試網(wǎng)站性能(網(wǎng)站優(yōu)化)
4. 解密HTTPS回話
5. 三方插件

Fiddler使用

1. 流模式 (實時返回數(shù)據(jù)) 更接近瀏覽器本身的行為
2. 緩沖模式 (所有數(shù)據(jù)全部獲取之后才返回)

使用場景

1. 開發(fā)環(huán)境HOST配置
2. 前后端接口調(diào)試
3. 線上bugfix
4. 性能分析和優(yōu)化
   • fiddler會提供請求的實際圖, 清晰明了網(wǎng)站需要優(yōu)化的部分

fiddler 工具欄

1. 備注 短信信息圖標(biāo) 對捕捉到的回話添加備注

2. replay 回放按鈕 重新請求 R快捷鍵

3. X 清空監(jiān)控面板(ctrl+x)

4. GO 請求的時候設(shè)置斷點 讓斷點繼續(xù)往下走

   • 結(jié)合狀態(tài)欄
   • 設(shè)置斷點: webbrowser 右邊點擊一下(紅色) 箭頭朝上表示發(fā)送的時候 朝下表示響應(yīng)的時候
   • 點擊GO, 繼續(xù)往下執(zhí)行

5. stream模式切換 (默認(rèn)是緩沖模式)

   • 流模式和緩沖模式的切換

6. decode 解壓請求 Keep:all sessions 保持回話

   • 保存越多占用內(nèi)存越大

7. Any Process 過濾請求

   • 比如指向看到chrome的請求 點擊 鼠標(biāo)中心移動到chrome上捕獲一下

8. find 查找 對需要查找的進(jìn)行顏色高亮

9. save 對當(dāng)前的回話進(jìn)行保存

   • 鼠標(biāo)拖動 選中一塊區(qū)域
   • save 保存為sazz文件
   • file -> recent archives -> 選中文件加載進(jìn)來

10. 截圖 保存 5s之后進(jìn)行截圖

11. 計時器 點擊一下計時 再點擊一下顯示時間 再點擊清0

12. 快速打開瀏覽器

13. Clear Cache 清除IE瀏覽器的緩存

14. TextWizard 編碼解碼

    • base64
    • url-encode/decode
    • html-encode/decode

15. TearOff 分離面板 右側(cè)面板分離

    
    
    fiddler工具欄.png

fiddler 狀態(tài)欄

image.png

1. 褐色區(qū)域控制臺 (輸入各種命令)

   • 輸入help 查看常用命令

2. cature 控制fiddler是否工作

   • 點擊一下 fiddler就不工作了
   • 是否讓fiddler工作

3. Web Browsers 過濾回話來源

   • WebBrowsers 只查看瀏覽器的請求
   • 或者查看來自于其他來源

4. 記錄當(dāng)前回話的數(shù)量和回話的地址

5. 選中某一會話后: 訪問的url地址

fiddler 監(jiān)控面板

1. statistics 數(shù)據(jù)統(tǒng)計

   • 請求性能上的指標(biāo)(分析優(yōu)化web性能)
   • 關(guān)注RTT數(shù)據(jù): 往返時間 請求發(fā)送到響應(yīng)結(jié)束

2. inspectors 對請求解包

   • 查看請求和響應(yīng)的詳細(xì)內(nèi)容

     
     
     image.png

3. AutoResponder 文件代理

   • 截獲文件
   • 將該請求文件拖到右側(cè)面板中
   • 右側(cè)底部 rule editor 第二欄控制請求響應(yīng)狀態(tài)碼
   • 或者選擇find a file 選擇本地的一個文件
     
     AutoResponseder.png

4. composer 前后端的接口聯(lián)調(diào)

   • 將請求拖入
   • 查看請求的參數(shù)

   • 修改請求參數(shù)進(jìn)行請求調(diào)整 execute進(jìn)行偽造請求執(zhí)行

     
     
     前后端聯(lián)調(diào) 請求偽造

5. log 日志面板

6. timeline

   • 相當(dāng)于瀏覽器中的http watch
   • 選中一塊區(qū)域的請求 查看timeline, 進(jìn)行網(wǎng)站性能分析

   • 性能優(yōu)化的關(guān)鍵點

     
     
     Timeline面板分析

Fiddler 文件 文件夾代理

1. HOST配置
   • 需求: 讓遠(yuǎn)程文件指向本地
   • Tools->Hosts->enabled激活功能
   • 本地ip 域名地址 添加到文件中
     • 192.168.123.1 www.baidu.com 本地服務(wù)器 遠(yuǎn)程服務(wù)器 , 然后保存文件
     • 禁用host 1. enabled去掉 save 2.關(guān)閉Fiddler軟件禁用

   • 上述: 將一個域名下的所有文件進(jìn)行映射到一個IP地址下

     
     
     本地文件代理

2. 文件替換(只想映射一個文件)

   • HOST是所有文件都進(jìn)行映射
   • autoResponder 場景 定義線上場景bug 進(jìn)行文件替換
     • 線上某一個文件除了問題的時候
     • 將該文件映射到本地, 修改看是否有問題
   • 左側(cè)選中文件拖到AutoResponder中 (步驟)
     • Exact 精準(zhǔn)匹配 也支持正則表達(dá)式
     • find a file
     • 替換規(guī)則 然后保存save
     • 還可以替換成一些響應(yīng)嗎

3. Fiddler請求模擬, 前后端接口調(diào)試

   • Composer 面板中 GET請求:
     • 輸入請求網(wǎng)址和請求參數(shù)
     • Execute
   • POST請求:
     • 請求參數(shù)放在RequestBody中
     • id=confidence&name=zhangsan&age=20
   • 配置ReuestHeader
     • 按照key:value的形式進(jìn)行模擬偽造

4. Fiddler網(wǎng)路限速

   • 關(guān)注事件: onBeforeRequest

     //發(fā)送請求的時候限速3s
     oSession('request-trickle-delay') = "3000"
     
     // 響應(yīng)延遲 模擬低速
     oSession('response-trickle-delay') = "3000"
     

限速追蹤

Fiddler插件 插件官網(wǎng)

1. Fiddler 代碼格式化插件 (JavaScript Formatter)

   • 鼠標(biāo)右擊左側(cè)欄中的回話 -> Make Javascipt Pretty -> 右側(cè)響應(yīng)SystaxView

   • TrafficDiffer 對比兩個不同的回話

     • differ 在右側(cè)面板中
     • 往里面的兩側(cè)中各拖入一個請求回話
     • 進(jìn)行對比分析 (對于優(yōu)化, 對比兩個序列)

2. Fiddler http代理插件

   • 第三方插件: Willow
     • 快速管理host文件
     • 進(jìn)行可視化管理
     • 可視化限速