Fiddler調式使用(一)深刻研究php
閱讀目錄css
Fiddler的基本概念:html
Fiddler是一款基於windows系統的代理服務器軟件,本地運行的程序,好比web瀏覽器及其餘客戶端的應用程序,能夠把http和https請求發送給Fiddler,Fiddler一般把這些請求轉發給web服務器,服務器將這些請求的響應返回給Fiddler,Fiddler再把響應轉發給客戶端。web
Fiddler 是以代理web服務器的形式工做的,它使用代理地址:127.0.0.1, 端口:8888. 當Fiddler會自動設置代理, 退出的時候它會自動註銷代理,這樣就不會影響別的程序。若是Fiddler非正常退出,這時候由於Fiddler沒有自動註銷,會形成網頁沒法訪問。解決的辦法是從新啓動下Fiddler便可。windows
安裝Fiddler瀏覽器
安裝Fiddler以前須要安裝.net framework, 我目前的安裝的是Fiddler4,因此我下載安裝的是.net framework4,以下所示:服務器
安裝Fiddler和安裝通常的軟件沒有什麼區別,這裏就不介紹~~;網絡
瞭解下Fiddler用戶界面session
我這邊是Fiddler4的界面以下:工具
在fiddler中web session界面中捕獲到http請求以下所示:
Web session列表蘭中包含了一些信息以下:
理解不一樣圖標和顏色的含義(下面是常見的):
web session的經常使用的快捷鍵
CTRL+A: 選中全部的session;
ESC: 取消選中全部的session;
CTRL+I 反向選中;若是session已選中,則取消,不然選中;
CTRL+X 刪除全部的session;
Delete: 刪除選中的session;
Shift+Delete 刪除全部未選中的session
R 從新執行當前請求
SHIFT+R 屢次重複執行當前請求
U: 無條件從新執行當前請求,發送不包含If-Modified-Since 和 If-None-Match的請求頭
SHIFT+U 無條件地屢次重複執行當前請求。
ALT+Enter 查看當前session的屬性;
Insert:切換是否用紅色粗體標記選中的session
M 給選中的session添加描述;
瞭解web Session上下文菜單
咱們來點擊session一項後,右鍵菜單,會出現以下所示:
AutoScroll Session List選項用於決定Fiddler是否會自動把新增的session添加到web session列表中。
咱們先來了解下 Copy菜單項的一些session信息以下:
Just Url: 把選中的session的url列表拷貝到剪貼板,每行一個url。以下咱們定位到session中,
當咱們進行粘貼的時候,看到是一個url地址;以下所示:
http://www.telerik.com/UpdateCheck.aspx?isBeta=False
上面能夠看到,咱們還可使用快捷鍵ctrl+u 實現;
This column: 拷貝選中session菜單所在列的文本;以下:
到咱們拷貝完成的時候,進行粘貼的時候,能夠看到以下文本:
HTTP
Terse summary:把選中的session的簡要說明覆制到剪貼板中,簡要說明中包括請求方法,url,響應的狀態碼及狀態信息,若是響應是HTTP/3xx重定向,文本中也會包括響應頭中Location字段的內容;以下所示:
當咱們進行粘貼的時候,能夠看到以下信息:
GET http://www.telerik.com/UpdateCheck.aspx?isBeta=False
200 OK (text/plain)
固然如上也可使用快捷鍵;
Headers only 把session的請求頭複製到剪貼板中,既能夠以純文本格式,也能夠以HTML格式複製。以下:
粘貼以下:
GET http://www.telerik.com/UpdateCheck.aspx?isBeta=False HTTP/1.1
User-Agent: Fiddler/4.5.1.2 (.NET 4.0.30319.1026; WinNT 6.1.7601 SP1; zh-CN; 2xx86)
Pragma: no-cache
Accept-Language: zh-CN
Referer: http://fiddler2.com/client/4.5.1.2
Host: www.telerik.com
Accept-Encoding: gzip, deflate
Connection: Close
HTTP/1.1 200 OK
Cache-Control: private
Content-Type: text/plain; charset=utf-8
Content-Encoding: gzip
Vary: Accept-Encoding
Server: Microsoft-IIS/7.5
Set-Cookie: sid=jELer5vxx0gyb7Fw53nCXaobR7BcBb+Ortlpxuq2IuvsiQP1UoSgUO2DLC4HoxbgEq5YLfg959JRyKoL5ZX33nBVHffCk3UQDBWH5XAPRIGiSo9kJOvdHF6iP/UdEvLLyWb43itzcIaZNksXDEnidrB3lVo=; expires=Wed, 02-Jul-2025 01:56:29 GMT; path=/
Access-Control-Allow-Origin: http://converter.telerik.com
Date: Sun, 05 Jul 2015 01:56:29 GMT
Content-Length: 447
Connection: close
Session: 把整個session列表複製到剪貼板中,支持以純文本和HTML這兩種格式進行復制。以下:
粘貼結果以下:
GET http://www.telerik.com/UpdateCheck.aspx?isBeta=False HTTP/1.1
User-Agent: Fiddler/4.5.1.2 (.NET 4.0.30319.1026; WinNT 6.1.7601 SP1; zh-CN; 2xx86)
Pragma: no-cache
Accept-Language: zh-CN
Referer: http://fiddler2.com/client/4.5.1.2
Host: www.telerik.com
Accept-Encoding: gzip, deflate
Connection: Close
HTTP/1.1 200 OK
Cache-Control: private
Content-Type: text/plain; charset=utf-8
Content-Encoding: gzip
Vary: Accept-Encoding
Server: Microsoft-IIS/7.5
Set-Cookie: sid=jELer5vxx0gyb7Fw53nCXaobR7BcBb+Ortlpxuq2IuvsiQP1UoSgUO2DLC4HoxbgEq5YLfg959JRyKoL5ZX33nBVHffCk3UQDBWH5XAPRIGiSo9kJOvdHF6iP/UdEvLLyWb43itzcIaZNksXDEnidrB3lVo=; expires=Wed, 02-Jul-2025 01:56:29 GMT; path=/
Access-Control-Allow-Origin: http://converter.telerik.com
Date: Sun, 05 Jul 2015 01:56:29 GMT
Content-Length: 447
Connection: close
?
?`I?%&/m?{J?J??t??`$?@??????iG#)?*??eVe]f@????{???{???;?N'????\fdl??J??!????~|?"????o??????o???w?{??>??wwog????$=[???2O_f?y??d?v]?i?XUu??g?f?O?n????Z7?d}q^???#
~'????=?_?????I??o???k???z?.?u??
7}???6[?7? }?-[|:o???w'eu???xZ-???uwU5msw????????W??n????v???F???????q?{~????_????q?f????i??????-?eZ??-}:????GOsB?X^?WE;O? ???I??U?]fE?M?|?'??^????M?u?PV?*?'D?4?.???b????4g?YkF?(?S????w???
Response DataURI :響應信息的DataURI
截圖以下:
信息以下:
data:text/plain;base64,H4sIAAAAAAAEAO29B2AcSZYlJi9tynt/SvVK1+B0oQiAYBMk2JBAEOzBiM3mkuwdaUcjKasqgcplVmVdZhZAzO2dvPfee++999577733ujudTif33/8/XGZkAWz2zkrayZ4hgKrIHz9+fB8/IvZ/4+T+b5zs/sbJ3m+c7I/vj3fHe+n3Pr27d3dvZ/f+93/jJD1brOrqMk9fZtO3eZueZKt2XedpsVhVdeu+n6Vny2aVT9uqbujTn8zqolo36WR9cV68y+kjA34n/d7+3T36Xwh/lr6pqrJJj9Jvf/n6zWv64vV6hS7Sl3X10wQ3fb3K6jZb0jf0Cn2RLVsPfDpv29Wju3cnZXXRjNu8zOvi7XhaLe6eF7MZ/XV3VTVtc3f3/vbO/vbeg7tX86zdbraX+dV2sdzWRtv72/e3iRi/cfJ7fvf0+cmXX5z+nr9x8maep6/zabWcpaezoi2qZVqdpy19Oqmqt+lHT3NC46JYXqRXRTtPnwmoj9KiSZfVVZpdZkWZTcp8/Bsnz/OsXqaLigiYTap1y1BW2SqvJ0TeNKMunr76Yvu8zvM0Z+hZa0amKOJTjOv/AeF3j4a5AQAA
Full Summary 把web session列表中顯示的信息複製到剪貼板。以下:
信息以下:
# Result Protocol Host URL Body Caching Content-Type Process Comments Custom
1 200 HTTP www.telerik.com /UpdateCheck.aspx?isBeta=False 447 private text/plain; charset=utf-8 fiddler:6500
Save子菜單中包含了用於把流量保存到文件中的一些選項;以下所示:
Selected Sessions中的In ArchiveZip 選項是把 Web Session列表中選中的session保存到SAZ文件中;以下所示:
Selected Sessions中的 As Text是把選中的全部session一塊兒保存到一個文本文件中;以下:
Selected Sessions中的As Text(Headers only) 把選中session的請求頭和響應頭一塊兒保存到一個文本文件中;下面還有不少選項,我這邊就不一一介紹,等用到某一項的時候,咱們再來介紹;
Fiddler如何捕獲firefox中的會話
Fiddler啓動時默認是IE代理設置127.0.0.1:8888,其餘瀏覽器須要手動設置;
Firefox手動設置以下:工具 –》選項 –》高級 –》網絡 –》設置
便可生效;不過上面的設置比較麻煩,咱們能夠安裝一個插件,以下:
Firefox中安裝FiddlerHook插件
當咱們安裝好fiddler後,就已經安裝好了FiddlerHook插件了,咱們須要去firefox中啓用這個插件;工具—》附加組件—》擴展—》fiddlerHook啓用
啓用便可!!而後咱們須要在firefox中進行設置便可;
咱們再來看一下Firefox手動設置以下:工具 –》選項 –》高級 –》網絡 –》設置
咱們能夠再來安裝一個hostAdmin插件便可方便查看。
Fiddler如何捕獲Https會話
默認下,Fiddler不會捕獲HTTPS會話,須要你設置下, 打開Fiddler Tool->Fiddler Options->HTTPS tab
彈出框後一直點擊Yes便可;
Fiddler的HTTP統計視圖(能夠優化請求和頁面)
Fiddler的統計選項卡中顯示了當前Session的基本信息,在選項卡的最上方顯示的是文本信息,最下方是個餅圖,按MIME類型顯示流量。使用Statistics頁籤,用戶能夠經過選擇多個會話來得來這幾個會話的總的信息統計,好比多個請求和傳輸的字節數。
選擇第一個請求和最後一個請求,可得到整個頁面加載所消耗的整體時間。從條形圖表中還能夠分別出哪些請求耗時最多,從而對頁面的訪問進行訪問速度優化。
以下所示:
餅圖以下:
統計選項卡的一些信息含義以下解釋:
Request Count: 選中的session數;
Unique Hosts: 流量流向的獨立目標主機數。若是全部選中的流量都發送到相同的服務器上,則不會顯示該字段。
Bytes sent: HTTP請求頭和請求體中向外發送的字節總數。後面括號中分別給出了頭和body各自的字節數。
Bytes received: HTTP請求頭和請求體中接收到的全部字節數。在所有計數後面的括號中給出了請求頭和請求體各自的字節數。
Requests started at: Fiddler接收到的第一個請求的第一個字節的時間點。
Responses completed at: Fiddler發送到客戶端的最後一個響應的最後一個字節的時間點。
Sequence(clock) duration: 第一個請求開始到最後一個響應結束之間的 「時鐘時間」。
Aggregate session duration: 全部選中的session從請求到響應之間的時間的和。
DNS Lookup time: 全部選中的session解析DNS所花費的時間的總和。
TCP/IP Connect duration: 全部選中session創建TCP/IP鏈接所花費的時間總和。
HTTPS Handshake duration: 全部選中session在HTTPS握手上所花費的時間總和。
Response Codes: 選中session中各個HTTP響應碼的計數。
Response Bytes by content-type: 選中session中響應的各個Content-Type的字節數。
Estimated Performance: 選中的流量在不一樣語種(local)地區和鏈接方式下所需時間的初步估計。
移動開發如何使用fiddler調式代碼
1. 首先電腦和手機要使用同一個無線網。
2. 配置Fiddler,點擊 Tools --> Fiddler Options
3. 手機端的配置,我這邊是Android手機(IOS也同樣),點擊設置進去,選擇無線網,以下:
點擊代理設置進去後,以下:
接下來能夠看看個人ip地址以下:
如上設置後,咱們就可使用手機訪問網頁後,可使用fiddler來監控請求或者替換js或者css文件了;
注意:有時候我訪問的頁面提示 「代理服務器鏈接失敗」,那麼這種狀況下,頗有多是防火牆或者一些360相似的殺毒軟件,咱們能夠在防火牆下設置爲fiddler經過,以下所示:
4. 修改HOST
如上設置咱們能夠監聽頁面請求了,可是若是我想要監聽本地的服務器端的代碼,就訪問不了(我本地使用的服務器是php環境),好比上我在本地作demo,若是一切好的話,我上傳到服務器端去,首先咱們須要啓動php服務器;啓動好後,咱們來使用本機的ip來訪問下;以下所示:
1. 咱們須要在fiddler裏面修改配置,Tools –》 HOSTS,以下:
點擊保存按鈕後,咱們接着再訪問頁面,就能夠訪問了,以下:
頁面能夠訪問後,有時候咱們想替換下js或者css文件,咱們就可使用右側的tab選項欄中的AutoResponder了,以下:
在最下面的能夠替換一些js或者css文件便可了;這裏就很少介紹了~
如上是目前總結的一些基本fiddler基本知識點, 在接下來的業餘時間會多去總結Fiddler相關調式方面的知識點~ 若是總結的很差的話,但願你們多多指教~~
總結:Fiddler基本知識點總結如上一些,在接下來的時間會全面總結Fiddler相關的含義,咱們平時用到的Fiddler一些方面,可是咱們還須要多去理解其餘各個方面的含義,爲之後使用代理http請求或者優化頁面有更好的理解,所以我以爲有必要的多去學習下Fiddler知識點~ 因此Fiddler一直會有下文總結的~~