Fiddler可以幫您記錄,調(diào)試Microsoft Internet Explorer與Web應(yīng)用程序的交互,找到Web程序運(yùn)行性能的瓶頸,還有如查看向Web服務(wù)器發(fā)送cookies的內(nèi)容,下載內(nèi)容的大小等功能。
說多一點(diǎn)是,F(xiàn)iddler站在用戶與Web服務(wù)器的中間,由它轉(zhuǎn)發(fā)請(qǐng)求與響應(yīng),因此Fiddler作為一個(gè)可檢視,可定制的工具,能讓您了解交互過程細(xì)節(jié),有利于解決Web程序的交互問題。如下列示意圖:
Internet Explorer <-> WinINET? (由Fiddler運(yùn)行時(shí)自動(dòng)注冊(cè)) <-> Fiddler <-> Web Server
Fiddler可以用于:
性能測(cè)試。如查看頁面的大小
調(diào)試。在會(huì)話選項(xiàng)中,可暫停,編輯HTTP通訊
Fiddler不僅可用于Microsoft Internet Explorer,其它瀏覽器,如Mozilla Firefox,Opera等也適用。軟件界面友好,精于HTTP,可能比NetMon易用,還可用.NET進(jìn)行擴(kuò)展。官方站點(diǎn)上,還有視頻教學(xué)。
這個(gè)工具我已經(jīng)使用比較長時(shí)間了,對(duì)我的幫助也挺大,今天我翻譯的微軟的文章,讓更多的朋友都來了解這個(gè)不錯(cuò)的工具,也是我第一次翻譯文章,不恰當(dāng)之處請(qǐng)大家大家多多指正。
介紹:
你是不是曾經(jīng)疑惑過你的web程序和IE是如何交互的?你是不是遇到過一些奇怪的而你又無法解決的性能瓶頸?你是不是對(duì)那些發(fā)送給服務(wù)器端的cookie 和那些你下載下來的被標(biāo)記為可緩存的內(nèi)容感到好奇?
Fiddler官方網(wǎng)站及下載地址:http://www.fiddlertool.com/Fiddler/dev/
微軟的Fiddler能夠幫助你回答以上的問題,不但如此,它還是一個(gè)http調(diào)試代理,它能 夠記錄所有的你電腦和互聯(lián)網(wǎng)之間的http通訊,F(xiàn)iddler 可以也可以讓你檢查所有的http通訊,設(shè)置斷點(diǎn),以及Fiddle 所有的“進(jìn)出”的數(shù)據(jù)(指cookie,html,js,css等文件,這些都可以讓你胡亂修改的意思)。 Fiddler 要比其他的網(wǎng)絡(luò)調(diào)試器要更加簡單,因?yàn)樗鼉H僅暴露http通訊還有提供一個(gè)用戶友好的格式。
Fiddler 包含一個(gè)簡單卻功能強(qiáng)大的基于JScript .NET 事件腳本子系統(tǒng),他非常靈活性非常棒,可以支持眾多的http調(diào)試任務(wù)。Fiddler 是用C#寫出來的。
。。。。。接下來是一大段廢話,關(guān)于如何安裝的,只要一路next,就可以了。這段話我就跳過,直接切入正題了。
Running Fiddler
當(dāng)你啟動(dòng)了Fiddler,程序?qū)?huì)把自己作為一個(gè)微軟互聯(lián)網(wǎng)服務(wù)的系統(tǒng)代理中去。你可以通過檢查代理設(shè)置對(duì)話框來驗(yàn)證Fiddler是被正確地截取了web請(qǐng)求。操作是這樣的:點(diǎn)擊IE設(shè)置,工具,局域網(wǎng)設(shè)置,最后點(diǎn)擊高級(jí)。
作為系統(tǒng)代理,所有的來自微軟互聯(lián)網(wǎng)服務(wù)(WinInet)的http請(qǐng)求再到達(dá)目標(biāo)Web服務(wù)器的之前都會(huì)經(jīng)過Fiddle,同樣的,所有的Http響應(yīng)都會(huì)在返回客戶端之前流經(jīng)Fiddler。這樣,就能明白Fiddler很多作用了吧!
當(dāng)你關(guān)閉Fiddler的時(shí)候,它就會(huì)自動(dòng)從系統(tǒng)注冊(cè)表中移出,換句話說,當(dāng)你關(guān)閉了Fiddler后,不會(huì)占著茅坑不拉屎。
下面,是一個(gè)Fillder的用戶界面,大家可以參考參考其功能。
用Fiddler來做性能測(cè)試 HTTP統(tǒng)計(jì)視圖通過顯示所有的Http通訊,F(xiàn)iddler可以輕松的演示哪些用來生成一個(gè)頁面,通過統(tǒng)計(jì)頁 面(就是Fiddler左邊的那個(gè)大框)用戶可以很輕松的使用多選,來得到一個(gè)WEB頁面的“總重量”(頁面文件以及相關(guān)js,css等)你也可以很輕松 得看到你請(qǐng)求的某個(gè)頁面,總共請(qǐng)求了多少次,以及多少字節(jié)被轉(zhuǎn)化了。
另外,通過暴露HTTP頭,用戶可以看見哪些頁面被允許在客戶端或者是代理端進(jìn)行緩存。如果要是一個(gè)響應(yīng)沒有包含Cache-Control 頭,那么他就不會(huì)被緩存在客戶端。
用Fiddler來調(diào)試
Fiddler支持?jǐn)帱c(diǎn)調(diào)試概念,當(dāng)你在軟件的菜單—rules—automatic breakpoints選項(xiàng)選擇beforerequest,或者當(dāng)這些請(qǐng)求或響應(yīng)屬性能夠跟目標(biāo)的標(biāo)準(zhǔn)相匹配,F(xiàn)iddler就能夠暫停Http通訊, 情切允許修改請(qǐng)求和響應(yīng)。這種功能對(duì)于安全測(cè)試是非常有用的,當(dāng)然也可以用來做一般的功能測(cè)試,因?yàn)樗械拇a路徑都可以用來演習(xí)。
Session檢查用戶可以在BuilderPage項(xiàng)種來以手工的方式來創(chuàng)建一個(gè)HTTP請(qǐng)求(即在 Fiddler右側(cè)的tab的第三個(gè),RequestBUILDER),或者可以使用拖拽操作從Session列表中來移動(dòng)一個(gè)已經(jīng)存在的請(qǐng)求到 builder page 來再次執(zhí)行這個(gè)請(qǐng)求。。。
Fiddler 擴(kuò)展Fiddler可以使用 .net framework來對(duì)它進(jìn)行擴(kuò)展。有2種為Fiddler擴(kuò)展準(zhǔn)備的基本機(jī)制:
自定義規(guī)則,和規(guī)則檢查。
使用腳本化的規(guī)則來擴(kuò)展Fiddler
Fiddler支持JScript .NET引擎,它可以允許用戶自動(dòng)地修改Http請(qǐng)求和響應(yīng)。這個(gè)引擎能夠在可視化界面修改在FiddlerUI中的Session,可以從列表中提取你感興趣的錯(cuò)誤,也可以移除你不感興趣的Session。
以下的示例代碼演示當(dāng)cookie被加載的時(shí)候把界面變成紫色。
static function OnBeforeRequest(oSession:Fiddler.Session){ if (oSession.oRequest.headers.Exists("Cookie")){ oSession["ui-color"] = "purple"; oSession["ui-bold"] = "cookie"; }}
通過加入Inspectors來擴(kuò)展Fiddler用戶可以加入一個(gè)Inspector插件對(duì)象,來使用.net下的任何語言來編寫Fiddler擴(kuò)展。RequestInspectors 和 ResponseInspectors提供一個(gè)格式規(guī)范的,或者是被指定的(用戶自定義)Http請(qǐng)求和響應(yīng)視圖。
默認(rèn)安裝中,F(xiàn)iddler加入了一下的Inspectors:
Request Inspectors
[RW] Headers—Shows request headers and status.
[RW] TextView—Shows the request body in a text box. (原始的請(qǐng)求body視圖)
[RW] HexView—Shows the request body in a hexadecimal view. (body的16進(jìn)制視圖)
[RO] XML—Shows the request body as an XML DOM in a tree view.(以XML方式展示請(qǐng)求)
Response Inspectors
[RW] Transformer—Removes GZip, DEFLATE, and CHUNKED encodings for easier debugging.
[RW] Headers—Shows response headers and status.
[RW] TextView—Shows the response body in a text box.
[RW] HexView—Shows the response body in a hexadecimal view. (16進(jìn)制視圖)
[RO] ImageView—Shows the response body as an Image. Supports all .NET image formats.
[RO] XML—Shows the response body as an XML DOM in a tree view.
[RO] Privacy—Explains the P3P statement in the response headers, if present.(如果在響應(yīng)頭中有關(guān)于隱私策略的說明就展示出來)
學(xué)習(xí)如何通過Fiddler建立一個(gè)速度更快的網(wǎng)站。在這篇文章中,我們將使用Fiddler去探究HTTP的性能,緩存,以及壓縮。
如果你要是沒有安裝和配置過Fiddler, 請(qǐng)從文章的第一篇開始。
HTTP性能總覽毫無疑問用戶都喜歡訪問速度快的網(wǎng)站。用戶是非常的不耐煩,除非你的網(wǎng)站是沒有競爭對(duì)手,換句 話就是處于壟斷地位的。如果你的訪問者來自世界各地,那你就必須要保證你的網(wǎng)站在執(zhí)行效率方面要非常好,甚至要更加標(biāo)準(zhǔn)。作為一個(gè)國際化的網(wǎng)絡(luò)連接點(diǎn),通 常要受到來自兩個(gè)方面的壓力:高訪問量以及低帶寬。
在第一次至關(guān)重要的訪問中,用戶必須要下載每一個(gè)內(nèi)容片斷,來生成頁面,包括JS,CSS,Images,HTML,如果你的頁面太難加載(包括IIS接到請(qǐng)求執(zhí)行并返回給客戶端HTML),訪問者也許就會(huì)離開你的頁面!
通過暴露所有的HTTP通訊,F(xiàn)iddler很容易得向你展示哪些文件經(jīng)常被用于生成一個(gè)頁面,
Shift+click 可以在Fiddler左邊框的會(huì)話列表中多選會(huì)話,來計(jì)算那些被選會(huì)話的“頁面總重量”。那些被轉(zhuǎn)換成字節(jié)的數(shù)量。
如果你想讓你的客戶在第一次訪問的時(shí)候就留下深刻的印象 ,那么最好的,也是唯一的途徑就是返回給客戶更少的文件。
1 使用更少的圖畫
2 將所有的CSS濃縮到一個(gè)CSS文件中
3 將所有的腳本濃縮到一個(gè)JS文件中
4 簡化你的頁面時(shí)間
5 使用HTTP壓縮
如果要是你已經(jīng)對(duì)用戶的第一次來訪的性能進(jìn)行了優(yōu)化,那么你可以通過Http 緩存的優(yōu)勢(shì)來使得你的網(wǎng)站訪問速度更快!
HTTP 緩存介紹
2種方式來提升你的web 應(yīng)用程序的速度:
減少請(qǐng)求和響應(yīng)的往返次數(shù)
減少請(qǐng)求和響應(yīng)的往返字節(jié)大小。
HTTP緩存是最好的減少客戶端服務(wù)器端往返次數(shù)的辦法。緩存提供了提供一種機(jī)制來保證客戶端 或者代理能夠存儲(chǔ)一些東西,而這些東西將會(huì)在稍后的HTTP 響應(yīng)中用到的。(即第一次請(qǐng)求了,到了客戶端,緩存起來,下次如果頁面還要這個(gè)JS文件或者CSS文件啥的,就不要到服務(wù)器端去取下來了,但是還是要去服 務(wù)器上去訪問一次,因?yàn)檎?qǐng)求要對(duì)比ETAG值,關(guān)于這個(gè)值,我將會(huì)在下次翻譯中介紹其作用)這樣,就不用讓文件再次跨越整個(gè)網(wǎng)絡(luò)了。
緩存相關(guān)的請(qǐng)求頭
為了提高性能,微軟的IE和其他的web客戶端總是想盡辦法來維持從遠(yuǎn)程服務(wù)器上下載下來的本地的緩存。
當(dāng)客戶端需要一個(gè)資源(html,css.js…),他們有3種可能的動(dòng)作:
1 發(fā)送一個(gè)一般的HTTP請(qǐng)求到遠(yuǎn)程服務(wù)器端,請(qǐng)求這個(gè)資源。
2 發(fā)送一個(gè)有條件的HTTP請(qǐng)求到服務(wù)器,條件就是如果它不同于本地的緩存版本。
3 如果緩存的拷貝可用,就使用本地的緩存資源。
當(dāng)發(fā)送一個(gè)請(qǐng)求,客戶也許會(huì)使用如下的幾個(gè)HEADER
Table 1. Client Cache Headers
Pragma: no-cacheThe client is unwilling to accept any cached responses from caches along the route and the origin server must be contacted for a fresh copy of the resource.
If-Modified-Since: datetimeThe server should return the requested resource only if the resource has been modified since the date-time provided by the client.
If-None-Match: etagvalueThe server should return the requested resource if the ETAG of the resource is different than the value provided by the client. An ETAG is a unique identifier representing a particular version of a file.
1 Pragma:no-cache 表明客戶端不愿意接受緩存請(qǐng)求,它需要的是最即時(shí)的資源。
2 If-Modified-Since: datetime 表明如果這個(gè)資源自從上次被客戶端請(qǐng)求,就已經(jīng)修改了,那么服務(wù)器就會(huì)返回給客戶端最新的。
3 If-None-Match: etagvalue 如果客戶端資源的ETAG值跟服務(wù)器端不一致了,那么服務(wù)器端返回最新的資源。ETAG就是一個(gè)唯一的ID,用來表示一個(gè)文件的一個(gè)特定的版本。
如果要是這些有條件的請(qǐng)求,也就是含有If-Modified-Since 或者 If-None-MatchHeader頭的請(qǐng)求,服務(wù)器將會(huì)以HTTP/304 Not Modified 來作為響應(yīng),那么客戶端就知道可以使用客戶端的緩存了。否則,服務(wù)器將會(huì)返回一個(gè)新的響應(yīng)并且客戶端就會(huì)拋棄過期的緩存資源。
你可以觀察2個(gè)連貫的請(qǐng)求,來請(qǐng)求同一個(gè)圖片,你會(huì)在Fiddler中發(fā)現(xiàn):在第一個(gè)本地緩存 版本中,服務(wù)器返回一個(gè)含有ETAG的文件,和一個(gè)含有最后修改日期的文件,在這個(gè)第一次的請(qǐng)求會(huì)話中,一個(gè)本地的緩存版本已經(jīng)可以使用了。這樣一來,一 個(gè)有條件的請(qǐng)求就被創(chuàng)建出來。然后你再次請(qǐng)求這個(gè)圖片的時(shí)候,他就就會(huì)響應(yīng)一個(gè)本地緩存的文件,當(dāng)然前提是第一次緩存的圖片的ETAG值或者If- Modified-Since 值跟服務(wù)器上匹配的話,服務(wù)器就響應(yīng)一個(gè)304給客戶端。
Session #1
GET /images/banner.jpg HTTP/1.1
Host: http://www.bayden.com/
HTTP/1.1 200 OK
Date: Tue, 08 Mar 2006 00:32:46 GMT
Content-Length: 6171
Content-Type: image/jpeg
ETag: "40c7f76e8d30c31:2fe20"
Last-Modified: Thu, 12 Jun 2003 02:50:50 GMT
Session #2
GET /images/banner.jpg HTTP/1.1
If-Modified-Since: Thu, 12 Jun 2003 02:50:50 GMT
If-None-Match: "40c7f76e8d30c31:2fe20"
Host: http://www.bayden.com/
HTTP/1.1 304 Not Modified
因?yàn)橐粋€(gè)HTTP304響應(yīng)僅僅包含頭,沒有body,所有它在穿越互聯(lián)網(wǎng)的時(shí)候要比攜帶了資源的快很多,盡管如此,HTTP/304響應(yīng)需要一個(gè)服務(wù)器的往返,但是通過細(xì)心的設(shè)置響應(yīng)頭,web程序員可以消除這種因素,甚至是有條件的請(qǐng)求。
緩存相關(guān)響應(yīng)頭
通常緩存機(jī)制是由響應(yīng)頭來控制的。HTTP規(guī)范描述了Header控制緩存,The optional Cache-Control,Expires(過期)。
Expires頭包含一個(gè)絕對(duì)的日期,當(dāng)超過此日期,它將不會(huì)被考慮更新了。
Table 2. Common Cache-Control Headers
ValueMeaning
publicThe response may be stored in any cache, including caches shared among many users.
privateThe response may only be stored in a private cache used by a single user.
no-cacheThe response should not be reused to satisfy future requests.
no-storeThe response should not be reused to satisfy future requests, and should not be written to disk. This is primarily used as a security measure for sensitive responses.
max-age=#secondsThe response may be reused to satisfy future requests within a certain number of seconds.
must-revalidateThe response may be reused to satisfy future requests, but the origin server should first be contacted to verify that the response is still fresh.
Cache-Control頭的參數(shù)設(shè)置:
Public 響應(yīng)會(huì)被緩存,并且在多用戶間共享。
Private 響應(yīng)只能夠作為私有的緩存,不能再用戶間共享。
No-cache 響應(yīng)不會(huì)被緩存
No-store 響應(yīng)不會(huì)被緩存,并且不會(huì)被寫入到客戶端的磁盤里,這也是基于安全考慮的某些敏感的響應(yīng)才會(huì)使用這個(gè)。
Max-age=#seconds 響應(yīng)將會(huì)某個(gè)指定的秒數(shù)內(nèi)緩存,一旦時(shí)間過了,就不會(huì)被緩存。
Must-revalidate 響應(yīng)會(huì)被重用來滿足接下來的請(qǐng)求,但是它必須到服務(wù)器端去驗(yàn)證它是不是仍然是最新的。
注意:
如果你要想在iis中配置緩存,請(qǐng)參閱溫軟的知識(shí)技術(shù)文章:
· How to Modify the Cache-Control HTTP Header When You Use IIS.
你可以學(xué)習(xí)更多關(guān)于在asp.net中使用緩存的知識(shí)文章:
· How To Cache in ASP.NET by Using Visual C# .NET.
如果你發(fā)現(xiàn)你經(jīng)常在你的網(wǎng)站上更新文件,但是并沒有更改文件名字,那你就必須要非常小心地設(shè)置 你的緩存生存時(shí)間。例如:如果你要一個(gè)thisyear.gif圖片文件顯示當(dāng)前的年份在網(wǎng)站上,你需要保證這個(gè)緩存過期時(shí)間不能超過一天,否則一個(gè)用戶 在12月31號(hào)訪問你的網(wǎng)站的時(shí)候,在1月1號(hào)就不能顯示正確的日期。
由于某些原因,服務(wù)器可能會(huì)設(shè)置:Progma:no-cache 頭,Cache-control:no-cache
Header中的參數(shù):Vary 是一個(gè)緩存信號(hào),Vary:User-Agent表示緩存當(dāng)前的響應(yīng),但是僅限于當(dāng)發(fā)送同樣的User-Agent 頭的時(shí)候。指令 Vary:* 就相當(dāng)于Cache-Control:no-Cache。
Vary就相當(dāng)于asp.net中的緩存的參數(shù)一樣,意思是根據(jù)什么來緩存,如果要是知道asp.net的緩存的使用方法,就很容易明白這個(gè)參數(shù)的意思。
使用HTTP會(huì)話列表,F(xiàn)iddler用戶可以看到在頁面里包含的HTTP緩存頭。
Fiddler 會(huì)話列表如果響應(yīng)不包含Expires或者Cache-Control,那么客戶端就會(huì)被迫作為一個(gè)有條件的請(qǐng)求,來保證所有的資源都是最新的。
有條件的請(qǐng)求和WinInetCache
IE通過Microsoft windows Internet Services來最大程度的利用緩存服務(wù)。WinInet允許用戶配置緩存的大小和行為,設(shè)置緩存進(jìn)行如下操作:
1 打開IE,
2 工具選項(xiàng),選擇Inrernet選項(xiàng),在一般子選項(xiàng)中,臨時(shí)文件夾內(nèi),點(diǎn)擊設(shè)置
下圖就是選村的四種設(shè)置:
標(biāo)記性能問題:
你可以使用Fiddler的自定義規(guī)則來標(biāo)記某些你需要的,比如如果某個(gè)響應(yīng)大于25KB,你可以把當(dāng)前的Session標(biāo)記為紅色,更加醒目。以下代碼都是在OnBeforeResponse事件中:
// Flag files over 25KB if (oSession.responseBodyBytes.length > 25000){ oSession["ui-color"] = "red"; oSession["ui-bold"] = "true"; oSession["ui-customcolumn"] = "Large file"; }同樣,你也可以標(biāo)記響應(yīng)并不指示緩存信息。 // Mark files which do not have caching informationif (!oSession.oResponse.headers.Exists("Expires") &&!oSession.oResponse.headers.Exists("Cache-Control")){ oSession["ui-color"] = "purple"; oSession["ui-bold"] = "true"; }介紹HTTP壓縮所有的目前流行的WEB服務(wù)器和瀏覽器都提供HTTP壓縮支持。HTTP壓縮可以非常顯著地降 低客戶端和服務(wù)器端的通訊量。節(jié)省超過50%的HTML,XML,CSS,JS等文件。一個(gè)瀏覽器發(fā)送一個(gè)信號(hào)給服務(wù)器,他可以介紹HTTP壓縮過的內(nèi) 容,并且會(huì)把客戶端所支持的壓縮類型放在請(qǐng)求的Header中,例如:考慮如下的請(qǐng)求:
GET / HTTP/1.1Accept: */*Accept-Language: en-usAccept-Encoding: gzip, deflateUser-Agent: Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.1; SV1; .NET CLR 1.1.4322)Host: search.msn.com這個(gè) Accept-Encoding 頭表明IE將愿意接受GZIP格式的和DEFLATE格式的壓縮響應(yīng)。
相應(yīng)的響應(yīng)如下:
HTTP/1.1 200 OKContent-Type: text/html; charset=utf-8Server: Microsoft-IIS/6.0 --Microsoft-HTTPAPI/1.0X-Powered-By: ASP.NETVary: Accept-EncodingContent-Encoding: gzipDate: Tue, 15 Feb 2006 09:14:36 GMTContent-Length: 1277Connection: closeCache-Control: private, max-age=3600 你可以使用Fiddler來解壓縮這些數(shù)據(jù)。實(shí)驗(yàn)表明,使用HTTP壓縮能大量減少數(shù)據(jù)往返, 一個(gè)普通的CSS文件甚至能減少80%!當(dāng)然壓縮是以犧牲CPU性能為代價(jià)的。特別是壓縮動(dòng)態(tài)文件,但是一般的權(quán)宜之策是壓縮例如JS,CSS等靜態(tài)文 件,因?yàn)樗麄冊(cè)诘谝淮螇嚎s后,就會(huì)被存儲(chǔ)在服務(wù)器上,如果要壓縮asp.net動(dòng)態(tài)文件,一定要有個(gè)權(quán)衡才行
聯(lián)系客服