入行這些年的一個(gè)真實(shí)經(jīng)歷前端同學(xué)信誓旦旦說(shuō)頁(yè)面沒(méi)發(fā)請(qǐng)求后端同學(xué)說(shuō)接口根本沒(méi)收到我跑到工位上一看兩邊都能理直氣壯誰(shuí)也說(shuō)服不了誰(shuí)。最后我打開(kāi)Fiddler抓包工具把手機(jī)、瀏覽器流量掛上代理十分鐘內(nèi)就發(fā)現(xiàn)是測(cè)試環(huán)境域名被緩存劫持到了舊網(wǎng)關(guān)請(qǐng)求壓根沒(méi)到后端。這種場(chǎng)景你大概率也遇到過(guò)——程序員的日常一半時(shí)間在寫(xiě)代碼另一半時(shí)間在證明“不是我的鍋”。Fiddler抓包工具就是把這個(gè)“證明”過(guò)程變得可視化、可操作、可復(fù)現(xiàn)的工具。無(wú)論你是前端、后端、測(cè)試還是運(yùn)維只要你的工作和 HTTP/HTTPS 接口沾邊Fiddler 都能幫你看到瀏覽器和手機(jī) App 背后最真實(shí)的流量。它能看請(qǐng)求頭、響應(yīng)體、狀態(tài)碼、耗時(shí)、Cookie、重定向鏈能斷點(diǎn)篡改數(shù)據(jù)、能 Mock 接口、能保存會(huì)話(huà)做回歸對(duì)比。這篇文章不打算給你羅列菜單而是按我實(shí)際使用的路徑把從安裝到進(jìn)階的流程、原理和踩坑經(jīng)驗(yàn)一次性講透讓你能照著操作也能在出問(wèn)題時(shí)知道去哪個(gè)設(shè)置里找原因。1. 從零跑通第一次抓包先弄清Fiddler在干什么1.1 代理是怎么一回事Fiddler 本質(zhì)上是一個(gè)本地代理服務(wù)器。你在瀏覽器或手機(jī)里設(shè)置代理地址為電腦 IP 加 8888 端口后所有HTTP/HTTPS請(qǐng)求都會(huì)先經(jīng)過(guò)Fiddler再由它轉(zhuǎn)發(fā)給目標(biāo)服務(wù)器。服務(wù)器返回的數(shù)據(jù)也會(huì)先回到Fiddler再交還給你。所以“抓包”并不是偷看而是讓流量主動(dòng)繞道經(jīng)過(guò)一個(gè)可以記錄和修改的中間點(diǎn)。這個(gè)機(jī)制的關(guān)鍵是“中間人”。你可以把它想象成快遞員正常情況下你的包裹直接由商家發(fā)到你手上中間人模式下包裹先送到中轉(zhuǎn)站中轉(zhuǎn)站拆開(kāi)檢查、登記、甚至換掉里面的商品再重新封好發(fā)給你。Fiddler 就是那個(gè)中轉(zhuǎn)站。它拆包的依據(jù)就是你的代理設(shè)置這個(gè)設(shè)置只對(duì)當(dāng)前配置的客戶(hù)端生效并不會(huì)影響其他設(shè)備。理解了這一點(diǎn)排查問(wèn)題就順了。比如網(wǎng)頁(yè)能打開(kāi)但Fiddler看不到任何會(huì)話(huà)先別懷疑軟件壞了99%的情況是代理沒(méi)有生效。Chrome 等瀏覽器如果要走系統(tǒng)代理需要確認(rèn)啟動(dòng)參數(shù)沒(méi)有被改或者插件強(qiáng)制了直連手機(jī)端則要確認(rèn)代理 IP 和端口填對(duì)了并且電腦防火墻放行了 8888。這些都是新手最容易卡住的地方。1.2 安裝與初始配置安裝 Fiddler 沒(méi)什么門(mén)檻一路默認(rèn)即可。我第一次裝完就急著抓 HTTPS結(jié)果發(fā)現(xiàn)全是“Tunnel to ...”明文字段一概看不到后來(lái)才知道還差兩步開(kāi)啟解密開(kāi)關(guān)和安裝證書(shū)。在你拿到一個(gè)舊版本時(shí)這兩個(gè)入口通常藏在 Tools Options HTTPS 里勾選“Capture HTTPS CONNECTs”和“Decrypt HTTPS traffic”然后按提示安裝根證書(shū)。初始配置里還有一個(gè)高頻坑默認(rèn)只捕獲瀏覽器流量不捕獲系統(tǒng)服務(wù)或其他進(jìn)程。新版入口可能在“WinConfig”或“System Proxy”相關(guān)位置你要確認(rèn)“Capture Traffic”處于開(kāi)啟狀態(tài)同時(shí)把 System Proxy 打開(kāi)否則代理沒(méi)掛到系統(tǒng)上什么都看不到。建議安裝完先做一次最小驗(yàn)證打開(kāi) Fiddler重啟瀏覽器訪(fǎng)問(wèn)任意網(wǎng)站看會(huì)話(huà)列表有沒(méi)有出現(xiàn)記錄。有記錄說(shuō)明代理鏈路已經(jīng)通了后面再逐步增加 HTTPS、手機(jī)端等能力。注意安裝證書(shū)后操作系統(tǒng)會(huì)信任 Fiddler 生成的根證書(shū)。不用時(shí)建議關(guān)閉解密開(kāi)關(guān)或移除證書(shū)避免在公用環(huán)境留下不必要的信任風(fēng)險(xiǎn)。1.3 第一個(gè)抓包實(shí)例觀察請(qǐng)求從哪里來(lái)到哪里去跑通代理之后我建議你先別急著看細(xì)節(jié)而是用 Fiddler 自帶的功能看一遍“請(qǐng)求生命周期”。隨便訪(fǎng)問(wèn)一個(gè)測(cè)試站點(diǎn)點(diǎn)中會(huì)話(huà)列表里的一條請(qǐng)求右邊 Inspector 面板里能看到請(qǐng)求行、請(qǐng)求頭、請(qǐng)求體再點(diǎn)響應(yīng)區(qū)域能看到狀態(tài)行、響應(yīng)頭、響應(yīng)體。這里最關(guān)鍵的不是看懂每個(gè)字段而是建立“一對(duì)多”的感覺(jué)——你訪(fǎng)問(wèn)一個(gè)頁(yè)面往往會(huì)產(chǎn)生幾十個(gè)請(qǐng)求真正想要的 HTML 只是其中一條其他是圖片、腳本、樣式、統(tǒng)計(jì)上報(bào)。你可以立即體驗(yàn)過(guò)濾的必要性。在左下角 QuickExec 輸入框輸入?ts就只顯示 URL 里帶“ts”的請(qǐng)求輸入302只顯示 302 狀態(tài)碼輸入host:example.com只看某個(gè)域名的流量。這些過(guò)濾不是高深技術(shù)但它們決定了你能不能快速鎖定目標(biāo)。我見(jiàn)過(guò)很多新人把幾屏請(qǐng)求從頭翻到尾十分鐘找不到接口我過(guò)去敲一個(gè)?api/列表瞬間干凈。工具的熟練程度很多時(shí)候就體現(xiàn)在這些不起眼的操作上。2. 看懂會(huì)話(huà)流識(shí)破每一次請(qǐng)求的“底細(xì)”2.1 會(huì)話(huà)列表字段的潛臺(tái)詞Fiddler 的會(huì)話(huà)列表Web Sessions默認(rèn)顯示 Result、Protocol、Host、URL、Body、Caching、Content-Type 等字段。很多人只看 URL 和 Result其實(shí)前幾列的信息量被嚴(yán)重低估。Protocol 是 HTTP/1.1 還是 HTTP/2直接決定你后面分析連接復(fù)用和隊(duì)頭阻塞的方向。Caching 列的no-cache說(shuō)明資源每次都要回源校驗(yàn)private說(shuō)明只能本地私有緩存這對(duì)排查“頁(yè)面更新了但客戶(hù)端還是顯示舊數(shù)據(jù)”至關(guān)重要。狀態(tài)碼也是很有講究的。200 不是唯一正常的答案304 表示緩存有效服務(wù)器沒(méi)有重新返回內(nèi)容這通常不是錯(cuò)誤302 后面一定還有一個(gè)跳轉(zhuǎn)后的請(qǐng)求如果你只看到 302 沒(méi)看到后續(xù)可能是 Location 頭被攔截或客戶(hù)端沒(méi)有跟隨跳轉(zhuǎn)。404、500 大家都會(huì)看但容易被忽略的是 401 和 403前者是沒(méi)登錄后者是登錄了但沒(méi)權(quán)限排查時(shí)思路完全不同。我自己的習(xí)慣是點(diǎn)中一個(gè)會(huì)話(huà)按F12打開(kāi) Inspector然后從頭到尾讀一遍請(qǐng)求頭和響應(yīng)頭。大部分問(wèn)題藏在細(xì)節(jié)里Host 是不是預(yù)期域名Content-Type 是不是表單Origin 和 Referer 是否被服務(wù)端校驗(yàn)Cookie 傳遞是否完整Set-Cookie 的 Domain 和 Secure 標(biāo)志是否設(shè)置正確。這些字段單個(gè)看都認(rèn)識(shí)組合在一起才構(gòu)成完整的請(qǐng)求語(yǔ)境。2.2 請(qǐng)求與響應(yīng)在Inspectors里的對(duì)應(yīng)關(guān)系右側(cè) Inspector 上半部分是請(qǐng)求下半部分是響應(yīng)默認(rèn)以分類(lèi)視圖顯示但更推薦你用 Raw 視圖。Raw 視圖能看到完整的原始報(bào)文包括首部順序和不可見(jiàn)字符比如請(qǐng)求體末尾沒(méi)有換行符、響應(yīng)頭里有多余的空格這類(lèi)問(wèn)題只在原始報(bào)文里能發(fā)現(xiàn)。具體操作是選中會(huì)話(huà)點(diǎn)擊右側(cè)上方的“Raw”標(biāo)簽?zāi)隳芸吹筋?lèi)似下面的結(jié)構(gòu)GET /api/users?a1 HTTP/1.1 Host: example.com User-Agent: Mozilla/5.0 Accept: */*下面空一行然后是請(qǐng)求體。響應(yīng)則顯示狀態(tài)行、響應(yīng)頭、空行、響應(yīng)體。這個(gè)結(jié)構(gòu)是 HTTP 協(xié)議的基礎(chǔ)Fiddler 只不過(guò)把它可視化。我常讓同事做一個(gè)練習(xí)不看 Fiddler 的分類(lèi)視圖只看 Raw 報(bào)文嘗試說(shuō)清楚這個(gè)請(qǐng)求的 Content-Length 和實(shí)際請(qǐng)求體長(zhǎng)度是否一致。這個(gè)練習(xí)做完再看抓包數(shù)據(jù)就不再發(fā)怵了。2.3 狀態(tài)碼與耗時(shí)快速定位異常的三個(gè)指標(biāo)除了狀態(tài)碼你還應(yīng)該盯三個(gè)時(shí)間指標(biāo)DNS 解析時(shí)間、TCP 連接時(shí)間、請(qǐng)求響應(yīng)總時(shí)長(zhǎng)。Fiddler 在 Statistics 面板會(huì)給出性能數(shù)據(jù)比如“Request count”“Total bytes sent”“Duration”。定位慢接口時(shí)先看總時(shí)長(zhǎng)然后在時(shí)間線(xiàn)Timeline里看是哪個(gè)階段拖了后腿。如果 DNS 就花了 3 秒那和接口本身沒(méi)關(guān)系是本地 DNS 配置的問(wèn)題如果 TTFB 很長(zhǎng)但接收字節(jié)很快那就是服務(wù)端處理邏輯慢可以騰出手去查數(shù)據(jù)庫(kù)或者遠(yuǎn)程調(diào)用。典型場(chǎng)景是 WebSocket 連接無(wú)法建立。此時(shí)會(huì)話(huà)列表出現(xiàn)的是 101 狀態(tài)碼這不算錯(cuò)誤表示協(xié)議切換成功。如果抓包看到 101 之后馬上斷開(kāi)重點(diǎn)看響應(yīng)頭里的 Sec-WebSocket-Accept 是否正確、代理是否對(duì) Upgrade 頭做了攔截。Fiddler 默認(rèn)能處理這類(lèi)流量但如果你開(kāi)了某些過(guò)濾規(guī)則把頭部改了就容易破壞握手。3. HTTPS流量解密證書(shū)的安裝與信任鏈邏輯3.1 為什么默認(rèn)抓不到HTTPS明文HTTPS 的“S”代表安全套接層它讓傳輸內(nèi)容加密第三方即使截獲數(shù)據(jù)包也讀不出明文。Fiddler 想看到明文必須把自己變成客戶(hù)端信任的“合法”服務(wù)器。做法是Fiddler 生成一個(gè)根證書(shū)客戶(hù)端安裝并信任這個(gè)根證書(shū)后Fiddler 再為每個(gè)訪(fǎng)問(wèn)域名臨時(shí)簽發(fā)一張子證書(shū)從而完成對(duì)目標(biāo)服務(wù)器的“李代桃僵”。你可能擔(dān)心這是不是有風(fēng)險(xiǎn)。公平地說(shuō)任何中間人代理方案都有信任風(fēng)險(xiǎn)Fiddler 只是在調(diào)試場(chǎng)景下讓你主動(dòng)選擇信任它。個(gè)人測(cè)試自己的應(yīng)用完全沒(méi)問(wèn)題前提是你清楚自己在做什么并且不要在他人不知情的情況下截取其設(shè)備流量。這里設(shè)置邊界很重要安裝證書(shū)的設(shè)備必須是你的設(shè)備目標(biāo)系統(tǒng)必須是你有權(quán)限調(diào)試的系統(tǒng)。安全邊界抓包工具不能用來(lái)獲取別人賬號(hào)信息、繞過(guò)他人授權(quán)或入侵不屬于你的系統(tǒng)。它只是一個(gè)調(diào)試工具用途應(yīng)當(dāng)在合法授權(quán)范圍內(nèi)。3.2 電腦端證書(shū)安裝與信任第一次開(kāi)啟解密時(shí)Fiddler 會(huì)在“HTTPS”設(shè)置頁(yè)生成DO_NOT_TRUST_FiddlerRoot這樣的根證書(shū)。在電腦上安裝時(shí)務(wù)必通過(guò)系統(tǒng)證書(shū)管理入口導(dǎo)入到“受信任的根證書(shū)頒發(fā)機(jī)構(gòu)”不要只導(dǎo)入到“個(gè)人”證書(shū)。裝錯(cuò)位置的典型癥狀是瀏覽器打開(kāi)提示證書(shū)錯(cuò)誤但 Fiddler 會(huì)話(huà)里又確實(shí)有流量。因?yàn)橹虚g人證書(shū)不被信任客戶(hù)端就會(huì)在 TLS 握手階段拒絕連接。安裝完成后建議先重啟 Fiddler 和瀏覽器再訪(fǎng)問(wèn)一個(gè)啟用 HTTPS 的站點(diǎn)。如果看到 URL 前面帶鎖會(huì)話(huà)列表里也不再是Tunnel to而是具體的GET請(qǐng)求說(shuō)明解密成功。若仍然只能看到 CONNECT 隧道請(qǐng)依次檢查解密開(kāi)關(guān)是否勾選證書(shū)是否在受信任根列表瀏覽器是否啟用了“安全 DNS”或“跳過(guò)本地代理”等干擾設(shè)置。3.3 移動(dòng)端證書(shū)安裝與授權(quán)設(shè)置手機(jī)端抓包比電腦端麻煩但邏輯相同手機(jī)要連電腦的代理同時(shí)要安裝并信任 Fiddler 的根證書(shū)。證書(shū)傳遞一般有兩種方式一是通過(guò)手機(jī)瀏覽器訪(fǎng)問(wèn)http://電腦IP:8888下載證書(shū)二是把FiddlerRoot.cer通過(guò)文件傳輸工具傳到手機(jī)再點(diǎn)擊安裝。安裝后還有一步容易漏不同系統(tǒng)的信任機(jī)制不一樣有些需要在“證書(shū)信任設(shè)置”里為 Fiddler 根證書(shū)開(kāi)啟完全信任有些需要把它加入系統(tǒng)證書(shū)存儲(chǔ)區(qū)。如果你只做了安裝沒(méi)有信任Chrome 類(lèi)瀏覽器可能仍然拒絕連接原生 App 則可能直接忽略證書(shū)。我見(jiàn)過(guò)很多人卡在“證書(shū)裝了但 App 依然超時(shí)”這一步其實(shí)就是沒(méi)去“信任證書(shū)”設(shè)置里手動(dòng)打開(kāi)開(kāi)關(guān)。還有一點(diǎn)移動(dòng)端 App 可能使用了證書(shū)綁定Certificate Pinning也就是客戶(hù)端內(nèi)置固定了服務(wù)器證書(shū)指紋。這種情況下即使安裝了根證書(shū)App 也不會(huì)認(rèn) Fiddler 動(dòng)態(tài)簽發(fā)的證書(shū)表現(xiàn)為頁(yè)面直接無(wú)法打開(kāi)或者報(bào)證書(shū)錯(cuò)誤。這并不是你配置錯(cuò)了而是應(yīng)用刻意防代理。常規(guī)調(diào)試遇到這種情況需要優(yōu)先確認(rèn)自己是否有權(quán)修改該應(yīng)用或該設(shè)備否則不要輕易嘗試?yán)@過(guò)。3.4 解密規(guī)則的開(kāi)啟與核對(duì)默認(rèn)情況下Fiddler 可以對(duì)所有 HTTPS 會(huì)話(huà)解密。為了性能和管理方便你可以在解密設(shè)置里添加例外規(guī)則比如只解密example.com或者排除所有指向某個(gè) IP 的流量。規(guī)則寫(xiě)的是通配符路徑用錯(cuò)了會(huì)影響匹配范圍我見(jiàn)過(guò)有人寫(xiě)*facebook*結(jié)果該域名下的所有子域都被解密列表刷到卡頓。每次改完解密規(guī)則記得清空一次會(huì)話(huà)列表CtrlX再重新驗(yàn)證。因?yàn)榕f會(huì)話(huà)里已經(jīng)記錄了未解密或已解密的報(bào)文不清理的話(huà)你會(huì)誤以為規(guī)則沒(méi)生效。另外一個(gè)高頻操作是“記住客服端證書(shū)”如果你在做雙向 TLS 驗(yàn)證的調(diào)試需要額外配置客戶(hù)端證書(shū)這個(gè)功能在解密選項(xiàng)里很少人用但遇到銀行類(lèi)接口調(diào)試時(shí)就是剛需。4. 斷點(diǎn)與篡改讓流量“中途停車(chē)”改數(shù)據(jù)4.1 斷點(diǎn)機(jī)制的觸發(fā)原理Fiddler 的斷點(diǎn)分為“請(qǐng)求前斷點(diǎn)”和“響應(yīng)前斷點(diǎn)”。請(qǐng)求前斷點(diǎn)發(fā)生在客戶(hù)端請(qǐng)求發(fā)出后、Fiddler 轉(zhuǎn)發(fā)到服務(wù)器前此時(shí)你可以修改請(qǐng)求頭、請(qǐng)求體、URL 參數(shù)響應(yīng)前斷點(diǎn)發(fā)生在服務(wù)器響應(yīng)已返回、Fiddler 交還給客戶(hù)端之前此時(shí)你可以修改響應(yīng)狀態(tài)碼、響應(yīng)頭和響應(yīng)體。這兩類(lèi)斷點(diǎn)相互獨(dú)立可以同時(shí)開(kāi)啟。最簡(jiǎn)單的開(kāi)啟方式是在 Fiddler 菜單選擇 Rules Automatic Breakpoints勾選“Before Requests”或“After Responses”。更靈活的方式是結(jié)合 QuickExec 命令比如輸入bpu example.com只有匹配該地址的請(qǐng)求才斷點(diǎn)輸入bpa響應(yīng)斷點(diǎn)bps狀態(tài)碼斷點(diǎn)。這種精準(zhǔn)斷點(diǎn)非常適合只攔截一條接口其他流量正常放行。4.2 修改請(qǐng)求頭與請(qǐng)求體模擬不同客戶(hù)端修改請(qǐng)求頭最常用的場(chǎng)景是偽裝 User-Agent 或改造參數(shù)版本。比如你測(cè)試現(xiàn)網(wǎng)環(huán)境沒(méi)有 Android 類(lèi)客戶(hù)端入口但服務(wù)端邏輯區(qū)分端別你就可以把抓到的請(qǐng)求復(fù)制到 Composer修改 User-Agent 后重放觀察返回差異。操作路徑是右鍵會(huì)話(huà) Add to Composer然后在底部的 Composer 面板里編輯頭部。注意 Fiddler 的 Composer 默認(rèn)可能帶Content-Length你修改請(qǐng)求體之后要手動(dòng)更新長(zhǎng)度或讓 Fiddler 自動(dòng)重算否則服務(wù)器會(huì)因長(zhǎng)度不匹配而拒絕請(qǐng)求。請(qǐng)求體的修改比頭部更簡(jiǎn)單直接在 WebForms 或 Raw 面板里改字段再“Breakpoint”放行。這里有個(gè)細(xì)節(jié)如果你修改的是 JSON 格式 body建議在 Text 視圖里改改完確認(rèn)一下 JSON 合法。曾經(jīng)有人把響應(yīng)里的status從success改成success多打了一個(gè)空格導(dǎo)致前端 JSON.parse 直接拋異常而他還以為是前后端 bug。4.3 修改響應(yīng)體制造前端臨界場(chǎng)景前端調(diào)試空狀態(tài)、錯(cuò)誤狀態(tài)、超長(zhǎng)列表時(shí)最討厭的就是等后端造數(shù)據(jù)。響應(yīng)前斷點(diǎn)可以讓你直接把后端返回改掉。比如你想模擬一個(gè) 500 錯(cuò)誤就在響應(yīng)前斷點(diǎn)點(diǎn)中會(huì)話(huà)修改狀態(tài)行為 500再把響應(yīng)體換成自定義錯(cuò)誤 JSON然后放行?？蛻?hù)端看到的就和真實(shí)故障一模一樣。我更常用的場(chǎng)景是超時(shí)和無(wú)響應(yīng)開(kāi)啟響應(yīng)前斷點(diǎn)后不點(diǎn)擊“放行”而是把會(huì)話(huà)一直掛在那里觀察前端是否會(huì)走超時(shí)邏輯。這比單純改狀態(tài)碼更貼近真實(shí)弱網(wǎng)環(huán)境。還有一種玩法是修改響應(yīng)頭里的 Cache-Control把no-cache改成max-age3600驗(yàn)證前端命中緩存后是不是不再發(fā)請(qǐng)求。這些操作雖然簡(jiǎn)單但能讓后端還沒(méi)開(kāi)發(fā)完成時(shí)前端就能按約定字段開(kāi)發(fā)界面。4.4 斷點(diǎn)模式下容易翻車(chē)的地方斷點(diǎn)最坑人的點(diǎn)是“忘了放行”。開(kāi)了一堆自動(dòng)斷點(diǎn)后你在頁(yè)面上點(diǎn)了十幾次刷新每次都停在斷點(diǎn)狀態(tài)然后你去看別的代碼幾分鐘后回來(lái)發(fā)現(xiàn) Fiddler 假死原因是會(huì)話(huà)積壓過(guò)多。解決方法是養(yǎng)成習(xí)慣用ShiftF11取消所有請(qǐng)求前斷點(diǎn)用AltF11取消所有響應(yīng)后斷點(diǎn)或者直接重啟 Fiddler。生產(chǎn)環(huán)境特別不建議開(kāi)著全局?jǐn)帱c(diǎn)很容易把一個(gè)正常業(yè)務(wù)卡成“服務(wù)癱瘓”。我曾經(jīng)在聯(lián)調(diào)環(huán)境下忘記關(guān)閉響應(yīng)斷點(diǎn)導(dǎo)致整個(gè)測(cè)試團(tuán)隊(duì)大面積超時(shí)自那以后我改完數(shù)據(jù)一定第一時(shí)間關(guān)掉 Breakpoint 開(kāi)關(guān)。還有一點(diǎn)修改響應(yīng)體后Fiddler 會(huì)自動(dòng)重新計(jì)算 Content-Length但如果你直接改的是壓縮后的響應(yīng)體例如 gzip修改內(nèi)容會(huì)亂碼。正確做法是先把響應(yīng)頭里的Content-Encoding: gzip移除讓 Fiddler 以明文處理修改完再按需重新壓縮。這個(gè)細(xì)節(jié)容易被忽視也是“我改了響應(yīng)怎么企業(yè)微信返回亂碼”的常見(jiàn)原因。5. 移動(dòng)端與跨網(wǎng)絡(luò)抓包真機(jī)調(diào)試的那些配置細(xì)節(jié)5.1 同一局域網(wǎng)下的代理設(shè)置手機(jī)與電腦必須處于同一局域網(wǎng)并且電腦防火墻要允許 8888 端口對(duì)外監(jiān)聽(tīng)。Fiddler 默認(rèn)監(jiān)聽(tīng)所有網(wǎng)絡(luò)接口但你需要在設(shè)置里確認(rèn)“Allow remote computers to connect”是勾選狀態(tài)否則手機(jī)連代理會(huì)立刻失敗。電腦的局域網(wǎng) IP 獲取方式不同系統(tǒng)也有差異但核心是確保 IP 正確。在手機(jī) Wi-Fi 設(shè)置里找到“代理”選擇手動(dòng)填寫(xiě)電腦 IP 和端口 8888。此時(shí)打開(kāi)手機(jī)任意網(wǎng)頁(yè)電腦上應(yīng)該馬上出現(xiàn)新增會(huì)話(huà)。如果不出現(xiàn)用瀏覽器訪(fǎng)問(wèn)代理 IP 和端口能打開(kāi) Fiddler 自帶的證書(shū)下載頁(yè)說(shuō)明代理層通了打不開(kāi)則多半是防火墻或局域網(wǎng)隔離策略攔截。5.2 不同手機(jī)系統(tǒng)的證書(shū)信任差異手機(jī)裝完根證書(shū)后“信任”這一步在兩類(lèi)系統(tǒng)上思路不同。一類(lèi)系統(tǒng)要求用戶(hù)在證書(shū)詳情里手動(dòng)開(kāi)啟高級(jí)信任開(kāi)關(guān)另一類(lèi)系統(tǒng)需要額外導(dǎo)入為系統(tǒng)級(jí)證書(shū)普通用戶(hù)模式導(dǎo)入的是用戶(hù)證書(shū)對(duì)部分 App 默認(rèn)不受信。如果你只是調(diào)試瀏覽器流量用戶(hù)證書(shū)基本夠用但調(diào)試一些安全等級(jí)較高的 App你會(huì)發(fā)現(xiàn)請(qǐng)求直接報(bào)證書(shū)錯(cuò)誤。遇到這種情況先別想歪路子。正確做法第一步是確認(rèn)應(yīng)用是否允許用戶(hù)證書(shū)第二步是看應(yīng)用是否開(kāi)啟代理檢測(cè)。很多 App 會(huì)對(duì) HTTP 代理敏感檢測(cè)到系統(tǒng)代理后直接拒絕訪(fǎng)問(wèn)。此時(shí)你可以嘗試改用透明代理或者把流量轉(zhuǎn)發(fā)到端口繞開(kāi)系統(tǒng)代理檢測(cè)。但這些手段都只限于調(diào)試自己負(fù)責(zé)的應(yīng)用不能用來(lái)跳過(guò)別人服務(wù)的防護(hù)機(jī)制。最后不要為了方便而在生產(chǎn)環(huán)境長(zhǎng)期關(guān)閉驗(yàn)證。5.3 抓包工具連不上網(wǎng)常見(jiàn)原因排查順序手機(jī)連上 Fiddler 后發(fā)現(xiàn)所有請(qǐng)求都超時(shí)我按以下順序排查檢查 Fiddler 是否開(kāi)啟“Allow remote computers”沒(méi)開(kāi)的話(huà)手機(jī)代理直接被拒。電腦和手機(jī) ping 一下同網(wǎng)段不通就移過(guò)去相連的網(wǎng)絡(luò)別在兩級(jí)路由器下折騰。關(guān)掉電腦上的殺毒軟件防火墻或者單獨(dú)放行 Fiddler 進(jìn)程。在手機(jī)瀏覽器下載證書(shū)頁(yè)面能打開(kāi)說(shuō)明 HTTP 層通打不開(kāi)說(shuō)明代理被系統(tǒng)攔截。抓取 HTTPS 解密失敗時(shí)重新確認(rèn)證書(shū)安裝與信任步驟。最容易被忽略的是電腦上有多個(gè)網(wǎng)絡(luò)適配器Fiddler 監(jiān)聽(tīng)的是有線(xiàn)網(wǎng)卡的 IP而手機(jī)連接的是無(wú)線(xiàn)網(wǎng)卡的 IP兩者不在同一網(wǎng)段。你在命令行ipconfig看到的可能是無(wú)線(xiàn) IP但 Fiddler 綁定的是有線(xiàn)。解決方式是直接給 Fiddler 監(jiān)聽(tīng)地址綁定成0.0.0.0所有接口都監(jiān)聽(tīng)手機(jī)配 IP 時(shí)用電腦當(dāng)前連接路由的那個(gè) IP。5.4 安全邊界只抓自己的設(shè)備流量抓包工具本身是中性技術(shù)就像一把螺絲刀可以用來(lái)修設(shè)備也可以用來(lái)拆設(shè)備。作為從業(yè)者我給自己立了三條規(guī)則第一只抓自己擁有或有明確授權(quán)的設(shè)備流量第二不把解密能力用于收集他人密碼、Cookie、賬號(hào)信息第三調(diào)試結(jié)束后及時(shí)移除代理配置和根證書(shū)尤其是公用電腦和公用測(cè)試機(jī)。這不僅是合規(guī)問(wèn)題也是職業(yè)底線(xiàn)。公司里調(diào)試生產(chǎn)環(huán)境也要先確認(rèn)是否有相關(guān)授權(quán)和監(jiān)控要求。Fiddler 的日志會(huì)保存所有流量包括明文密碼和 Token因此保存的 .saz 文件必須妥善處置不要隨手放到公開(kāi)共享目錄。我記得有次一個(gè)同事把帶 token 的會(huì)話(huà)文件傳到了公共網(wǎng)盤(pán)結(jié)果第二天 token 被刷爆整個(gè)項(xiàng)目組加班換密鑰。這個(gè)教訓(xùn)值得每個(gè)用抓包工具的人記住。6. 從調(diào)試到自動(dòng)化Composer、AutoResponder和腳本擴(kuò)展6.1 Composer手工構(gòu)造請(qǐng)求當(dāng)你已經(jīng)清楚一個(gè)接口所有參數(shù)后可以直接用 Composer 構(gòu)造請(qǐng)求而不必總是重復(fù)打開(kāi)頁(yè)面觸發(fā)。把已有的請(qǐng)求拖進(jìn) Composer你可以改成別的 URL、改請(qǐng)求方法、改 header、改 body然后點(diǎn) Execute 發(fā)送。這個(gè)能力在做接口回歸、給后端做冒煙測(cè)試時(shí)非常高效。需要注意的是 Composer 發(fā)送的請(qǐng)求默認(rèn)會(huì)走當(dāng)前代理也就是會(huì)出現(xiàn)在同一個(gè)會(huì)話(huà)列表里所以你能看到它的完整響應(yīng)。它還支持輸入原始 HTTP 報(bào)文很多人在做自定義協(xié)議調(diào)試時(shí)都是先把報(bào)文頭寫(xiě)好再用 Composer 里的“Raw”標(biāo)簽直接粘貼執(zhí)行。這里有個(gè)小技巧CtrlR切換 Inspectors 時(shí)Focus 在 Composer 的 URL 框可直接寫(xiě) URL回車(chē)就能發(fā)請(qǐng)求。6.2 AutoResponder實(shí)現(xiàn)“假接口”與Mock環(huán)境AutoResponder 是前端開(kāi)發(fā)最?lèi)?ài)的功能。它允許你把某個(gè) URL 的響應(yīng)替換成本地文件、另一個(gè) URL 或者一個(gè)自定義字符串。配置好后頁(yè)面請(qǐng)求到達(dá) Fiddler 時(shí)不轉(zhuǎn)發(fā)到服務(wù)器而是直接返回你指定的內(nèi)容。用這個(gè)功能你可以在后端接口未完成時(shí)就完成前端聯(lián)調(diào)也可以把耗時(shí)接口臨時(shí)替換成固定返回讓測(cè)試環(huán)境擺脫依賴(lài)。我常用它造三種場(chǎng)景一是“先顯示 Loading再返回成功數(shù)據(jù)”二是“接口異常時(shí)返回 500 和錯(cuò)誤提示”三是“圖片請(qǐng)求全部替換成本地占位圖”。每一種都只需要簡(jiǎn)單的規(guī)則和文件路徑關(guān)鍵是把匹配規(guī)則寫(xiě)準(zhǔn)確。規(guī)則支持正則初學(xué)者可以用通配符比如regex:.*\.png$匹配所有 png 圖片。但要注意規(guī)則列表是有先后順序的越靠前優(yōu)先級(jí)越高。我踩過(guò)坑寫(xiě)了一條/api/的規(guī)則結(jié)果把a(bǔ)pi/login和api/user全返回了同一個(gè) JSON調(diào)試了好一會(huì)兒才發(fā)現(xiàn)是規(guī)則樹(shù)邏輯問(wèn)題。6.3 FiddlerScript改動(dòng)響應(yīng)的小玩法FiddlerScript 是 Fiddler 的腳本機(jī)制你可以把它理解成“插件鉤子”在事件函數(shù)里寫(xiě)代碼對(duì)經(jīng)過(guò)的會(huì)話(huà)做自動(dòng)化處理。雖然很多人覺(jué)得腳本有門(mén)檻但只要你會(huì)一點(diǎn)點(diǎn)函數(shù)規(guī)則就能做出很實(shí)用的工具。最經(jīng)典的例子是自動(dòng)修改某個(gè)接口的響應(yīng) header在OnBeforeResponse函數(shù)里判斷 URL然后直接給 header 增加字段。我寫(xiě)過(guò)一個(gè)小腳本專(zhuān)門(mén)給靜態(tài)資源加Cache-Control: no-cache避免開(kāi)發(fā)時(shí)反復(fù)清緩存。還寫(xiě)過(guò)在OnBeforeRequest里自動(dòng)加Authorization頭的腳本省去每次手動(dòng)填 Token 的麻煩。FiddlerScript 使用的是類(lèi)似語(yǔ)法和事件模型初次上手不要求寫(xiě)復(fù)雜邏輯從改一個(gè) header 開(kāi)始慢慢就能擴(kuò)展成自己的調(diào)試助手。6.4 會(huì)話(huà)保存與回歸對(duì)比抓包不只是在出問(wèn)題時(shí)用也應(yīng)該沉淀成團(tuán)隊(duì)資產(chǎn)。Fiddler 可以把當(dāng)前所有會(huì)話(huà)保存成 .saz 文件保存后重新打開(kāi)會(huì)話(huà)列表、響應(yīng)內(nèi)容、時(shí)間戳全都保留。我習(xí)慣在項(xiàng)目每個(gè)版本發(fā)布前把關(guān)鍵流程抓一份 .saz 存到版本檔案里下次測(cè)試如果發(fā)現(xiàn)接口行為變了直接拿新舊兩份會(huì)話(huà)做對(duì)比立刻能看出是請(qǐng)求參數(shù)變了還是響應(yīng)結(jié)構(gòu)變了。對(duì)比時(shí)可以用 Fiddler 自帶的對(duì)比功能或?qū)С鑫谋竞笥脜f(xié)作工具比對(duì)。推薦先把感興趣的會(huì)話(huà)右鍵導(dǎo)出為文本再用文本對(duì)比工具查看差異。這個(gè)流程比口頭溝通“好像返回不一樣”可靠得多。另外保存會(huì)話(huà)時(shí)注意去掉安全性敏感字段如 Cookie、Authorization、Token 等可以用腳本在導(dǎo)出前清洗一遍。最后再分享一點(diǎn)個(gè)人經(jīng)驗(yàn)抓包不是越全越好而是越“聚焦”越好。我在處理線(xiàn)上問(wèn)題時(shí)第一步永遠(yuǎn)是開(kāi)host:過(guò)濾只保留目標(biāo)域名第二步才開(kāi) HTTPS 解密第三步根據(jù)需求開(kāi)斷點(diǎn)。這樣做能讓會(huì)話(huà)列表保持清爽不會(huì)在三千條請(qǐng)求里迷路。Fiddler 的快捷鍵和命令很多但你先記住CtrlX清空列表、CtrlF查找響應(yīng)內(nèi)容、AltF11取消斷點(diǎn)這三個(gè)足夠覆蓋 90% 的日常操作。工具終究是工具真正發(fā)揮價(jià)值的關(guān)鍵是你能不能把眼前這條流量理解成一條完整的業(yè)務(wù)故事。