>>>

（1）請求重定向至本地檔案

　　由於我們早期的一些老舊頁面，沒有託管在我們的Gitlab上，而是直接存放在FTP，所以修改就沒那麼方便。有時修改這些頁面的js或者css，就用了Fiddler的這個線上除錯功能，挺實用的。

　　開啟你要除錯的頁面，如圖左側，你會看到有各種請求，然後右側工具欄切換到AutoResponder選項。

　　選中你要除錯的檔案（一般是JS，CSS），然後拖拽到如圖位置

　　找到 Find a file選項，選擇你要用於線上除錯的本地檔案，然後點save儲存，就可以在本地除錯線上的頁面了。例如在本地檔案寫個alert語句，重新重新整理頁面，線上應該能看到效果了。

（2）捕獲https請求

　　fiddler預設是不抓取https請求的，所以需要我們再做一些設定。

　　選單欄選擇 Tools->Options->Https，然後再點選Actions按鈕，選擇Export Fiddler Root Certificate to Desktop把證書匯出到本地。

　　然後安裝證書，以Chrome瀏覽器為例，在chrome://settings/找到管理證書的地方，匯入此前下載在本地的證書。至此，重新重新整理頁面應該可以看到HTTPS請求了。

（3）　修改介面返回的資料

　 　Fiddler設定斷點有2種方式，一種是全域性斷點，將中斷所有請求，Rules-> Automatic Breakpoint -> Before Requests(或 After Requests)。另一種是區域性的，可以設定自己想要攔截的請求，在左下角的輸入框輸入相應的命令即可。推薦使用這種方式。

　　 Before Requests， 是指在請求傳送到伺服器之前斷點。對應的命令是 bpu xxx(xxx是你請求的地址，如某個介面)。After Requests， 是指客戶端傳送請求之後，伺服器返回給客戶端之前斷點。對應的命令是 bpafter xxx 。我們把東西攔截下來就是為了篡改裡面的內容，以達到我們的目的。除錯介面就是這樣的，我們可能需要修改某些欄位返回的值，來看看我們前端頁面的展示情 況，不同的返回值頁面樣式可能不同。

　　前段時間做了一個抽獎的專題，順便拿來說明一下。點選"抽獎按鈕"請求A介面，檢視使用者剩 餘抽獎的次數，如果抽獎次數大於0（會有個抽獎的互動，轉圈什麼的，否則提示沒有抽獎機會），然後自動呼叫B介面抽獎（彈窗提示抽中的獎品）。製作過程 中，我用自己的賬號登入之後抽獎，抽完之後次數就不夠用了，那就滿足不了調B介面的要求了，然後看不到抽獎的互動效果和顯示結果，那我要怎麼製作和除錯 啊？雖然也可以在程式碼裡設定，比如把某個變數強制設為true，或者寫死某個欄位的值等等，然後讓程式按照你想要的邏輯去跑，但是感覺不太好。那怎麼辦 呢？我總不能每次都和後端同學說，啊，我的賬號抽獎次數又用完了，麻煩你幫我在後臺改下資料，讓我可以無限抽；咦，我IP也達到上限了，也抽不了，你再幫 我配置一下，不限IP吧；呀，可以返回固定的這個值嗎，讓我抽中這個獎品，我看看前端頁面展示對不對？...此時後端同學內心可能是崩潰的。這樣的做法溝 通成本就有點高了。

　 　這種情況下Fiddler就登場了，我們自己修改返回的資料達到除錯頁面的目的...就用bpafter這個命令吧，也就是說我想在伺服器返回資料到客 戶端前，攔截下來修改。左下角輸入框輸入命令:bpafter xxx(xxx是你請求的介面，可以不帶協議頭)，然後回車。

　　點選"抽獎按鈕"，請求抽獎記錄介面，此時你可以開啟瀏覽器控 制臺看下介面，一直是沒資料返回的，因為在fiddler打了斷點。看到了嗎，選中的介面左側有個紅色圖示，它表示響應在斷點處被暫停。再看截圖右下方處 就是介面返回的資料，其中有個欄位draw_times表示剩餘抽獎次數，現在是為0，為0的話就不能調抽獎介面抽獎了，可以在這裡改成1，進入抽獎的邏 輯。改完之後，點選Run to Completion執行，然後控制檯就可以看到介面有返回值了。

　 　上面的邏輯通了之後，就會自動調抽獎介面，進行抽獎，同樣是可以修改抽獎介面返回的資料，你需要抽中哪個獎品，修改一下獎品欄位返回的值就行了，然後頁 面就會如預期的一樣展示相應的內容...最後除錯完記得輸入bpafter清除斷點，不然每當請求介面還會一直打斷點。

　　最後

　　BTW，由於Fiddler本身就是一個代理工具，在使用過程中，可能會出現網路問題，關閉或者點選左下角的Capturing就行了。

轉載於:https://my.oschina.net/outcat/blog/1835886