fiddler(Fiddler是什么)

Fiddler是啥?

百度百科里是這樣介紹它的 - “Fiddler是一個web調試代理。它能夠記錄所有客戶端和服務器間的http請求,允許你監視,設置斷點,甚至修改輸入輸出數據,fiddler包含了一個強大的基于事件腳本的子系統,并且能夠使用.net框架語言擴展?！?/p>

所以無論你是從事什么開發,哪種語言,只要你想了解HTTP,這個工具就值得你去了解,而且更重要的一點,這個工具是免費的。

Fiddler就是以代理服務器的方式,監聽系統的網絡數據流動。

啟動Fiddler后,所發生的網絡數據流通過Fiddler進行中轉,就可以看到HTTP/HTTPS數據流的信息,我們就可以通過對這些信息加以分析。Fiddler還提供了清除IE緩存、請求構造器、文本轉換工具等等一系列工具,對前端開發工作很有價值。

Fiddler的安裝與下載:

Fiddler下載地址:http://www.fiddler2.com/fiddler2/

假如你是早期的XP版本的系統在安裝的過程中會提示你下載.net framework 2.0或以上版本 。安裝過程很簡單,就不介紹了。

Fiddler的使用界面和功能介紹:

監聽開關 - 只有兩種狀態,用的時候就開著,不用就讓丫休息。capturing表示捕捉狀態

監聽類型 - 四種狀態分別對應 監聽所有請求;監聽瀏覽器請求,監聽非瀏覽器請求,和全部隱藏(Hide All)

命令行 - 就不作介紹了,難者不會,會者不難。我就屬于前者,悲劇呀...

請求列表 - 請求列表的信息分別有 結果(Result),協議(Protocol),主機名(Host),網頁地址(URL),內容大小(Body),緩存(Caching),響應的HTTP內容類型(Content-Type),請求所運行的程序(Process),注釋(Comments),自定義(Custom)

請求相關信息 - 右邊這一大片都是數據流的相關信息的查看器,這些查看器提供很多查看形式,可以查看數據流的內容。

Fiddler請求列表的icon對應具體的數據類型和狀態,其含義是:

Fiddler請求相關信息對應的主要功能:

工具最右方的是請求相關信息的查看器,提供了數據多方面的查看方式。想了解?看圖片。

統計資料信息(Statistics)

強大的檢查器(Inspectors) - 功能很多,等待你慢慢挖掘。

時間軸(Timeline)

自動回復器(autoResponder) - 一會就是介紹它的具體使用方法

說說我在工作中為什么使用Fiddler,如何使用Fiddler。

前端工程師在工作中總會有那么一些要求,要求書寫的代碼具有優良的兼容性,要求考慮代碼的高性能,要求方法要面向對象,要求...前端工程師總是和瀏覽器兼容有很多不得不說的事。

條件1:在我們前端工程師開發的工作中,要調試服務器上某個HTML/CSS/JavaScript文件。一般情況下,我們都是將文件直接進行修改,然后重新發布再去做驗證,這樣就容易影響到測試環境或者生成環境的穩定性。更好的做法是,我們在本地開發環境中直接修改文件并進行驗證,然后發布到測試環境,這樣能保證測試環境的穩定,可是又比較繁瑣。

條件2:現在我的情況是需要調試上線產品的瀏覽器兼容性問題,且我沒有本地環境或者生成環境去測試。假如有Bug發生在Firefox或者Chrome這種有控制臺支持調試的瀏覽器下一切都好說,可是假如bug只發生在遨游,TT,世界之窗,搜狗...這種的沒有調試功能的瀏覽器下,而且你還碰見了我目前的情況,那么如果沒有Fiddler這種工具,只能說這就是一場災難。

Fiddler工具可以修改HTTP數據的特性,我們就非常便捷地基于生產環境修改并驗證,確認后再發布。

***步,先定位調試文件且下載。假設發現頁面中的某個文件有問題(HTML/CSS/JavaScript都行),那么我們需要做的是就把他先下載到本地(如果本地有這個本地那么可以跳過此步驟),下載到本地的文件偶爾會有亂碼的情況,建議你先清理瀏覽器緩存或者調整注冊表(Fiddler2中文亂碼問題)。使用細節如下:

第二步,Fiddler - autoResponder出場,開啟此功能。打開AutoResponder標簽設置?？梢钥吹浇缑嫔嫌腥齻€選擇框,***個的作用是開啟或禁用自動重定向功能,我們就可以在下面添加重定向規則了;第二個選擇框被勾上時,不匹配的請求可以通過,不影響那些沒滿足我們處理條件的請求。

第三步,創建重定向規則,將目標是這個js的HTTP請求重定向到本地文件。選中剛剛定位的文件,通過“Add…”按鈕增加規則,也可以直接拖動過來。

第四步,選擇本地剛剛保存的文件或者替換的文件,作為替換這個請求的內容。

第五步,你調試或者不調試,它就在那里 - 只會請求你本地的選擇的那個文件。所以,想怎么修改都隨便你了。刷新頁面,就可以看見這個alert了。

到此,相信大家對“Fiddler是什么”有了更深的了解,不妨來實際操作一番吧!這里是本站網站,更多相關內容可以進入相關頻道進行查詢,關注我們,繼續學習!