背景
前面寫了一篇關(guān)于Browsersync的文章，但是Browsersync只能調(diào)試本地代碼寒亥，如果要是調(diào)試已經(jīng)上線或者已經(jīng)發(fā)布到測試服務器的代碼就不行了。想必做前端的小伙伴都會遇到這個問題吧荧关。下面就給大家介紹一個工具fiddler以及它的一個插件Stave溉奕。
介紹
先介紹一下fiddler是干啥的，用官網(wǎng)的一句話說就是任何瀏覽器忍啤，系統(tǒng)或平臺的免費網(wǎng)絡(luò)調(diào)試代理加勤。支持任何瀏覽器，任何系統(tǒng)同波，任何平臺鳄梅。主要特征有：
Web調(diào)試
解密HTTPS流量和解壓縮Web會話；分析會話數(shù)據(jù)未檩；調(diào)試流量
性能測試
HTTP/HTTPS流量記錄
Web會話操作
可以對會話設(shè)置斷點戴尸，也可以修改HTTP請求≡┙疲可以將把文件請求映射到本地文件校赤。
安全測試
Stave是Fiddler的一個擴展插件，能夠讓Fiddler把文件請求映射到本地目錄筒溃。之前調(diào)試單個文件的時候一般使用Fiddler自帶的AutoResponder功能，不過AutoResponder每條自動響應規(guī)則只能對應一個本地文件沾乘， 在文件數(shù)目較多的時候怜奖，使用起來很不方便。
安裝
Fiddler下載地址
Stave下載地址
先安裝Fiddler再安裝Stave,安裝很簡單翅阵，在這里就不寫了歪玲。
ps:如果重啟之后沒有看到Stave迁央，可能是stave安裝后的路徑不對。請在C盤下找到Stave.dll滥崩，然后放到fiddler安裝路徑的Scripts文件下岖圈。然后重啟Fiddler就可以了。
Stave安裝好之后重啟一下Fiddler,就可以在Fiddler的有側(cè)看到Stave的tab頁钙皮，點開之后如下圖：
使用
在Stave空白區(qū)域右鍵-添加蜂科，然后填寫規(guī)則。第一行填寫的是你要調(diào)試的服務器路徑短条，第二行是你本地對應的文件目錄导匣。剩下的其他選項可以默認就行。點擊確定之后就可以愉快的使用了茸时。如果你要是在手機上訪問的話贡定，記得給手機設(shè)置代理就行（服務器地址就是你電腦的Ip地址，端口8888可都。手機和電腦要在同一個局域網(wǎng)內(nèi)）
