一般在windows系統上瀏覽器開發者工具打開都是按F12快捷鍵,按F12快捷鍵打開谷歌瀏覽器如下圖所示,下面來分別解釋一下各個功能
一、第一個功能:定位的作用,點擊一下這個圖標,將鼠標放在任意頁面上的位置,就可以查看到右邊的源碼
二、第二個功能:是用於屏幕適配的,也就是說谷歌瀏覽器可以模擬各個型號的手機打開wap頁面,如果需要增加手機型號,點擊下拉菜單的Edit
打開如下圖增加手機型號頁面,如增加小米Mix3,填寫完後點擊save按扭
這樣就增加了小米Mix3型號了
三、第三個功能,Elements:查看頁面的HTML元素,能夠也就是查看源碼,我們可以看到佈局,可以看到用到的樣式,還有用到的鏈接等等,並且手動修改任一元素的屬性和樣式且能實時在瀏覽器裏面得到反饋;
四、第四個功能,console:這個就是一個web控制檯,記錄開發者開發過程中的日誌信息,且可以作爲與JS進行交互的命令行Shell;
五、第五個功能,sources:這個是顯示資源文件的,並且可以斷點調試JS;
(1)上圖中第一個紅框,是用來選擇資源的,當網頁被加載的時候向服務器端請求出來的文件包括.html .ccs .js這樣的文件;
(2)上圖中第二個紅框,是用來調試js代碼的地方,當我們需要調試程序的時候打一個斷電,然後通過上圖紅框3這個工具欄進行調試,也就是打一個斷電然後刷新頁面程序會調到你打斷點的地方,然後通過上圖紅框4來查看程序中變量的值什麼的;
(3)上圖中第三個紅框,第一個按扭是停止狀態的按鈕就是表示程序是否停止(在debug時),後面的是程序繼續跳過方法,跳過下一個語句,調到上一個語句。
1、 如果要搜索某個文件,用Ctrl+P,就能快速搜索到需要的文件
2、要搜索源碼,快捷鍵是:Ctrl + Shift + F
3、快捷鍵Ctrl + G,輸入行號,會跳轉到你輸入的行號所在的行
4、當編輯一個文件的時候,你可以按住Ctrl在你要編輯的地方點擊鼠標,可以設置多個插入符,這樣可以一次在多個地方編輯
六、第六個功能,Network:從發起網頁頁面請求Request後分析HTTP請求後得到的各個請求資源信息(包括狀態、資源類型、大小、所用時間等),可以根據這個進行網絡性能優化;
如上圖就是用於抓包的頁面,此頁面中第二行、第三行的圖標與各個勾選框的作用
1、第一個圖標,點擊這個圖標的作用是:表示當前的請求不被清空(但是這裏的請求是不跳轉頁面的請求,當跳轉到新的頁面,那麼請求也會被清空);
2、第二個圖標,點擊這個圖標的作用是:清空請求;
3、第三個圖標,點擊這個圖標的作用是:捕獲屏幕。默認是關閉狀態,點擊後圖標變成藍色,會記錄頁面在不同時間下的快照,如下圖所示
4、第四個圖標,作用是:是否開啓過濾選項,點擊這個圖標,圖標變成藍色,並且顯示下圖中紅框中的菜單
5、第五個圖標,作用是:是否使用更大的區域顯示請求記錄,點擊這個圖標後,下圖紅框中區域變大
6、第六個圖標,作用是:是否顯示overview概括,Overview是顯示獲取到資源的時間軸信息,點擊這個圖標,圖標變成藍色,並且顯示下圖紅框中的內容
7、第七個勾選框,勾選了該選項後,會對網絡請求按表單名稱進行分組;
8、第八個勾選框,勾選了該選項後,刷新頁面後,也不會刪除跳轉前頁面的請求,如百度首頁,當在百度首頁點擊右上角新聞,頁面跳轉到新聞頁面,當沒有勾選該選項後,刷新新聞頁面,跳轉前的百度首頁請求數據消失不見了,當勾選該選項後,就算刷新新聞頁面,跳轉前的百度首頁請求數據還存在,如下圖所示
9、第九個勾選框,作用是:緩存開關
10、第十個勾選框,作用是:網絡連接開關,勾選該選項後,網絡斷開;
11、第十一個搜索框,作用是:輸入關鍵字可以模糊查詢到請求的URL;
12、第十二個勾選框,作用是:勾選該選項可支持正則匹配;
13、第十三個勾選框,作用是:勾選該選項後隱藏鏈接的域名,即不顯示全部鏈接;
14、最後這些勾選框的作用如下:
All---所有數據;
XHR---一般是ajax調用的json文件;
JS---Javascript文件
CSS---CSS文件
Img---圖片文件
Media---媒體文件
Font---字體文件
Doc---一般是當前網頁的HTML文件
WS---WebSocket的縮寫,是 HTML5 開始提供的一種在單個 TCP 連接上進行全雙工通訊的協議;
Manifest---是一個簡單的文本文件,列舉出了瀏覽器用於離線訪問而緩存的資源;
Other:其他文件
15、一般在數據區谷歌瀏覽器默認爲下圖中紅框中幾個字段,如果需要查看其它數據,可以在Name字段後點擊鼠標右鍵
會出現如下圖所示下拉框,根據需要勾選上你所要查看的數據
Name---請求的文件;
Status--- HTTP狀態碼;
Type---請求文件的類型;
Initiator---標記請求是由哪個對象或進程發起的(請求源);
Parser: 請求由Chrome的HTML解析器時發起的;
Redirect:請求是由HTTP頁面重定向發起的;
Script:請求是由Script腳本發起的;
Other:請求是由其他進程發起的,比如用戶點擊一個鏈接跳轉到另一個頁面或者在地址欄輸入URL地址;
Size---從服務器下載的文件和請求的資源大小。如果是從緩存中取得的資源則該列會顯示(from cache);
Time---請求或下載的時間,從發起Request到獲取到Response所用的總時間;
Timeline--- 顯示所有網絡請求的可視化瀑布流(時間狀態軸),點擊時間軸,可以查看該請求的詳細信息,點擊列頭則可以根據指定的字段可以排序;
Waterfall---加載時間詳情;
Method---請求方式;
16、查看資源的發起者(請求源)和依賴源
按住Shift
並且把光標移到資源名稱上,可以查看該資源是由哪個對象或進程發起的(請求源)和對該資源的請求過程中引發了哪些資源(依賴資源);
如下圖,在該資源的上方第一個標記爲綠色的資源就是紅框中資源的發起者(請求源)
如下圖,紅框中資源的下方標記爲紅色的資源是該資源的依賴源
17、下圖紅框中,顯示總的請求數、數據傳輸量、加載時間信息
DOMContentLoaded事件:在頁面上DOM完全加載並解析完畢之後觸發,不會等待CSS、圖片、子框架加載完成,
它在Overview上用一條藍色豎線標記,所以在這邊也是以藍色文字顯示確切的時間;
load事件:在頁面上所有DOM、CSS、JS、圖片完全加載完畢之後觸發,它在Overview和Requests Table上用
一條紅色豎線標記,在這邊也是以紅色文字顯示確切的時間;
18、點擊某個資源的Name可以查看該資源的詳細信息,選擇不同的資源所顯示的各個tab頁也不一樣,常見的各個tab頁如下圖紅框所示
各個tab頁所表達的作用如下:
Headers---該資源的HTTP頭信息
Preview---根據你所選擇的資源類型(JSON、圖片、文本)顯示相應的預覽
Response---顯示HTTP的響應信息
Cookies---顯示資源HTTP的請求和響應過程中的緩存信息
Timing---顯示資源在整個請求生命週期過程中各部分花費的時間,可能會涉及到如下過程的時間花費情況:
(1)、Queuing: 排隊的時間花費,可能由於該請求被渲染引擎認爲是優先級比較低的資源(圖片)、服務器不可用、超過瀏覽器的併發請求的最大連接數(Chrome的最大併發連接數爲6);
(2)、Stalled:從HTTP連接建立到請求能夠被髮出送出去(真正傳輸數據)之間的時間花費,包含用於處理代理的時間,如果有已經建立好的連接,這個時間還包括等待已建立連接被複用的時間;
(3)、Proxy Negotiation :與代理服務器連接的時間花費;
(4)、DNS Lookup: 執行DNS查詢的時間,網頁上每一個新的域名都要經過一個DNS查詢,第二次訪問瀏覽器有緩存的話,則這個時間爲0;
(5)、Initial Connection / Connecting :建立連接的時間花費,包含了TCP握手及重試時間;
(6)、SSL: 完成SSL握手的時間花費;
(7)、Request sent: 發起請求的時間;
(8)、Waiting (Time to first byte (TTFB)): 是最初的網絡請求被髮起到從服務器接收到第一個字節這段時間,它包含了TCP連接時間,發送HTTP請求時間和獲得響應消息第一個字節的時間,如果TTFB這個部分的時間花費如果超過200ms,則應該考慮對網絡進行性能優化了;
(9)、Content Download :獲取Response響應數據的時間花費
19、http請求的八種方式
首先需要了解一下HTTP協議,什麼是HTTP協議?HTTP是基於TCP/IP的關於數據如何在萬維網中如何通信的協議。
HTTP1.0定義了三種請求方法: GET, POST 和 HEAD方法
HTTP1.1新增了五種請求方法:OPTIONS, PUT, DELETE, TRACE 和 CONNECT
現在常用的就是HTTP1.1
HTTP八種請求方式各自的作用:
方法 | 作用 | 請求過程 |
GET | 1、通過URL請求數據,請求的參數也放在URL中,所以不安全; 2、GET方式請求的數據有字節限制,限制URL的長度; 3、GET請求數據時,將請求頭與數據一起發送給服務器,服務器處理後,返回給瀏覽器200 OK並返回處理後的數據; 4、GET請求參數會被完整保留在瀏覽器歷史記錄裏; 5、GET只接受ASCII字符的請求參數,如果數據是英文字母/數字,原樣發送,如果是空格,轉換爲+,如果是中文/其他字符,則直接把字符串用BASE64加密,得出如: %E4%BD%A0%E5%A5%BD,其中%XX中的XX爲該符號以16進製表示的ASCII; 6、GET產生一個TCP數據包 ,所以時間消耗比較少; |
1.瀏覽器請求TCP連接(第一次握手) 2.服務器答應進行TCP連接(第二次握手) 3.瀏覽器確認,併發送GET請求頭和數據(第三次握手,這個報文比較小,所以HTTP會在此時進行第一次數據發送) 4.服務器返回200 OK響應 |
POST | 1、POST請求的參數放在請求體中,相對於GET安全一些; 2、POST請求的數據沒有限制; 3、POST請求數據時,瀏覽器先發送請求頭,服務器返回給瀏覽器100(100的意思是繼續),然後瀏覽器再發送數據給服務器,服務器處理後,再返回給瀏覽器200 OK並返回處理後的數據; 4、POST的請求參數不會被保留在瀏覽器的歷史記錄中; 5、POST對請求參數的類型不限制; 6、POST產生兩個TCP數據包,所以時間消耗要比GET多; |
1.瀏覽器請求TCP連接(第一次握手); 2.服務器答應進行TCP連接(第二次握手); 3.瀏覽器確認,併發送POSTt請求頭(第三次握手,這個報文比較小,所以HTTP會在此時進行第一次數據發送); 4.服務器返回100 continue響應; 5.瀏覽器開始發送數據; 6.服務器返回200 OK響應; |
HEAD | HEAD就像GET,只不過服務端接受到HEAD請求後只返回響應頭,而不會發送響應內容。當我們只需要查看某個頁面的狀態的時候,使用HEAD是非常高效的,因爲在傳輸的過程中省去了頁面內容 | |
PUT | 這個方法比較少見。HTML表單也不支持這個。本質上來講,PUT和POST極爲相似,都是向服務器發送數據,但它們之間有一個重要區別,PUT通常指定了資源的存放位置,而POST則沒有,POST的數據存放位置由服務器自己決定。 舉個例子:如一個用於提交博文的URL,/addBlog。如果用PUT,則提交的URL會是像這樣的”/addBlog/abc123”,其中abc123就是這個博文的地址。而如果用POST,則這個地址會在提交後由服務器告知客戶端。目前大部分博客都是這樣的。顯然,PUT和POST用途是不一樣的。具體用哪個還取決於當前的業務場景。 |
|
DELETE | 請求服務器刪除由請求URI 所標識的資源 DELETE請求一般返回3種碼 200(OK)——刪除成功,同時返回已經刪除的資源; 202(Accepted)——刪除請求已經接受,但沒有被立即執行(資源也許已經被轉移到了待刪除區域); 204(No Content)——刪除請求已經被執行,但是沒有返回資源(也許是請求刪除不存在的資源造成的) |
|
TRACE | 響應接受到的請求,那麼客戶端可以看到中間服務器做出了什麼改變或添加 | |
CONNECT | 將鏈接請求轉化爲透明的TCP/IP通道,通常通過未加密的HTTP代理來促進SSL加密通信 | |
OPTIONS | 請求查詢服務器的性能,或者查詢與資源相關的選項和需求,它用於獲取當前URL所支持的方法。若請求成功,則它會在HTTP頭中包含一個名爲“Allow”的頭,值是所支持的方法,如“GET, POST” |
20、http請求與響應
1)、發起http的請求由:請求行、請求頭部、空行、請求數據四個部分組成;
而請求行又分爲三個部分:請求方法、請求地址和協議版本;
(1)、請求方法:就是上面所說的http請求的八種方法,GET、POST、HEAD、OPTIONS、 PUT、 DELETE、TRACE、CONNECT方法;
(2)、請求地址:
URL:統一資源定位符,是一種自願位置的抽象唯一識別方法。
組成:<協議>://<主機>:<端口>/<路徑>
端口和路徑有時可以省略(HTTP默認端口號是80)
(3)、協議版本:
協議版本的格式爲:HTTP/主版本號.次版本號,常用的有HTTP/1.0和HTTP/1.1
HTTP請求的7個步驟
1.、建立TCP鏈接
2、瀏覽器發送請求(GET/sample/hello.jsp HTTP/1.1)
3、瀏覽器發送請求頭(request header)
4、服務器發送應答(HTTP/1.1 200 OK)
5、服務器發送應答頭(response header)
6、服務器發送數據
7、服務器關閉TCP連接
2) 響應http的請求由:狀態行、響應頭部、空行、響應數據四個部分組成;
21、Headers頭各個字段的作用
Headers包括四個部分:
1)、General:常規信息
2)、Response Headers:響應頭
3)、Request Headers:請求頭
4)、Query String Parameters:請求數據
1)、General:常規信息
(1)、 Request URL :請求的url
(2)、Request Method : 請求的方法,一般是GET、POST
(3)、Status Code:HTTP 狀態碼,200 OK表示請求成功
200 OK //客戶端請求成功
400 Bad Request //客戶端請求有語法錯誤,不能被服務器所理解
401 Unauthorized //請求未經授權,這個狀態代碼必須和WWW-Authenticate報頭域一起使用
403 Forbidden //服務器收到請求,但是拒絕提供服務
404 Not Found //請求資源不存在,eg:輸入了錯誤的URL
500 Internal Server Error //服務器發生不可預期的錯誤
503 Server Unavailable //服務器當前不能處理客戶端的請求,一段時間後可能恢復正常
(4)、Remote Address:請求的遠程IP地址
(5)、Referrer Policy:在頁面引入圖片、JS等資源,或者從一個頁面跳到另一個頁面,都會產生新的HTTP請求,瀏覽器一般都會給這些請求頭加上表示來源的Referrer字段;
新的Referrer Policy規定了五種Referrer策略:No Referrer、No Referrer When Downgrade、Origin Only、Origin When Cross-origin和Unsafe URL。
No Referrer:任何情況下都不發送Referrer信息;
No Referrer When Downgrade:僅當發生協議降級(如HTTPS頁面引入HTTP資源,從HTTPS頁面跳到HTTP等)時不發送Referrer信息,這個規則是現在大部分瀏覽器默認所採用的;
Origin Only:發送只包含host部分的Referrer,啓用這個規則,無論是否發生協議降級,無論是本站鏈接還是站外鏈接,都會發送Referrer信息,但是隻包含協議+ host部分(不包含具體的路徑及參數等信息);
Origin When Cross-origin:僅在發生跨域訪問時發送只包含host的Referrer,同域下還是完整的。它與Origin Only的區別是多判斷了是否Cross-origin。需要注意的是協議、域名和端口都一致,纔會被瀏覽器認爲是同域
Unsafe URL:無論是否發生協議降級,無論是本站鏈接還是站外鏈接,統統都發送Referrer信息,正如其名,這是最寬鬆而最不安全的策略
2)、Response Headers:響應頭
3)、Request Headers:請求頭
下面的表格中是解釋請求頭各個字段的作用:
請求頭 | 作用 | 常用格式 | 狀態 |
Host | 請求發送給哪那一個服務器,以及服務器的端口號。如果所請求的端口是對應的服務的標準端口(80),則端口號可以省略。 | Host: www.itbilu.com:80 Host: www.itbilu.com |
固定 |
Connection | 一般情況下,一旦web服務器向瀏覽器發送了請求數據,他就要關閉TCP連接,然後如果瀏覽器或者服務器在其頭信息加入了Connection:keep-alive,則TCP連接在發送後仍將保持打開狀態,於是,瀏覽器可以繼續通過相同的連接發送請求,保持連接節省了爲每個請求建立新連接所需要的時間,還節約了網絡帶寬 | Connection: keep-alive Connection: Upgrade |
固定 |
User-Agent | 瀏覽器的版本信息,通過這個信息可以獲取是哪種瀏覽器類型,支持的插件和.net版本等信息。 User-Agent是Http協議中的一部分,屬於頭域的組成部分,User Agent也簡稱UA,是一種向訪問網站提供你所使用的瀏覽器類型、操作系統及版本、CPU 類型、瀏覽器渲染引擎、瀏覽器語言、瀏覽器插件等信息的標識,UA字符串在每次瀏覽器 HTTP 請求時發送到服務器 |
Mozilla/5.0 (平臺) 引擎版本 瀏覽器版本號 瀏覽器UA字串的標準格式爲: 瀏覽器標識 (操作系統標識; 加密等級標識; 瀏覽器語言) 渲染引擎標識 版本信息 |
固定 |
Accept | 瀏覽器能接受的資源類型 1、Accept: text/plain/html,代表瀏覽器可以接受服務器返回的類型爲text/html,也就是我們常說的html文檔,如果服務器無法返回text/html類型的數據,服務器應該返回一個406錯誤(non acceptable); 2、Accept: */*,代表瀏覽器可以處理所有類型(一般瀏覽器發給服務器都是發這個) |
固定 | |
Referer | 當瀏覽器向web服務器發送請求的時候,一般會帶上Referer,告訴服務器我是從哪個頁面鏈接過來的,服務器籍此可以獲得一些信息用於處理,Referer常用於網站的訪問統計; Referer其實是Referrer這個單詞,但RFC製作標準時給拼錯了,後來也就將錯就錯使用Referer了。 |
Referer: http://itbilu.com/nodejs | 固定 |
Accept-Charset | 瀏覽器可以接受的字符編碼集 | Accept-Charset: utf-8 | 固定 |
Accept-Encoding | 表示瀏覽器能接受服務器返回內容壓縮編碼的方法,通常指定壓縮方法,是否支持壓縮,支持什麼壓縮方法(gzip,deflate),(注意:這不是隻字符編碼) |
Accept-Encoding: gzip, deflate gzip:GNU壓縮格式 deflate:是一種同時使用了LZ77和哈弗曼編碼的無損壓縮格式 compress:UNIX系統的標準壓縮格式identity:不進行壓縮 |
固定 |
Accept-Language | 表示瀏覽器支持的語言,它可以通過逗號分割來攜帶多國語言。 | Accept-Language: zh-CN,zh;q=0.8 第一個會是首選的語言,其它語言會攜帶一個“q”值,來表示用戶對該語言的喜好程度(0~1) |
固定 |
Accept-Ranges | 可以請求網頁實體的一個或者多個子範圍字段 | Accept-Ranges: bytes | 臨時 |
Accept-Datetime | 可接受的按照時間來表示的響應內容版本 | Accept-Datetime: Sat, 26 Dec 2015 17:30:00 GMT | 臨時 |
Authorization | 用於表示HTTP協議中需要認證資源的認證信息 | Authorization: Basic OSdjJGRpbjpvcGVuIANlc2SdDE== | 固定 |
Cache-Control | 用來指定當前請求的數據,是否使用緩存機制。 在HTTP/1.1版本中,它和Pragma作用是相同的。 Cache-Control:Public 可以被任何緩存所緩存 Cache-Control:Private 內容只緩存到私有緩存中 Cache-Control:no-cache 所有內容都不會被緩存 |
Cache-Control:no-cache | 固定 |
Cookie | 是瀏覽器向服務器發送和當前網站關聯的Cookie,這樣在服務器端也能讀取到瀏覽器端的Cookie了 | Cookie: $Version=1; Skin=new; | 固定:標準 |
Content-Length | 發送給HTTP服務器數據的長度,即請求消息正文的長度,以8進製表示的請求體的長度 | Content-Length: 348 | 固定 |
Content-Type | 在Http協議消息頭中,使用Content-Type來表示具體請求中的媒體類型信息 | 1、常見的媒體格式類型如下: text/html : HTML格式 text/plain :純文本格式 text/xml : XML格式 image/gif :gif圖片格式 image/jpeg :jpg圖片格式 image/png:png圖片格式 2、以application開頭的媒體格式類型: application/xhtml+xml :XHTML格式 application/xml : XML數據格式 application/atom+xml :Atom XML聚合格式 application/json: JSON數據格式 application/pdf:pdf格式 application/msword: Word文檔格式 application/octet-stream :二進制流數據(如常見的文件下載) application/x-www-form-urlencoded : <form encType=””>中默認的encType,form表單數據被編碼爲key/value格式發送到服務器(表單默認的提交數據的格式) 3、另外一種常見的媒體格式是上傳文件之時使用的: multipart/form-data : 需要在表單中進行文件上傳時,就需要使用該格式 |
固定 |
Date | 請求發送的日期和時間 | Date: Dec, 26 Dec 2015 17:30:00 GMT | 固定 |
Expect | 表示客戶端要求服務器做出特定的行爲 | Expect: 100-continue | 固定 |
From | 發起此請求的用戶的郵件地址 | From: [email protected] | 固定 |
If-Match | 僅當客戶端提供的實體與服務器上對應的實體相匹配時,才進行對應的操作。主要用於像 PUT 這樣的方法中,僅當從用戶上次更新某個資源後,該資源未被修改的情況下,才更新該資源。 | If-Match: "9jd00cdj34pss9ejqiw39d82f20d0ikd" | 固定 |
If-Modified-Since | 把瀏覽器端緩存頁面的最後修改時間(If-Modified-Since: Sat, 28 Nov 2009 06:38:19 GMT)發送給服務器,服務器會把這個時間與服務器上實際文件的最後修改時間進行對比。如果時間一致,那麼返回“304 Not Modified”,客戶端就直接使用本地緩存文件。如果時間不一致,就會返回200和新的文件內容。客戶端接到之後,會丟棄舊文件,把新文件緩存起來,並顯示在瀏覽器中。 |
If-Modified-Since: Dec, 26 Dec 2015 17:30:00 GMT | 固定 |
If-None-Match | If-None-Match和ETag一起工作,工作原理是在HTTP Response中添加ETag信息。 當用戶再次請求該資源時,將在HTTP Request 中加入If-None-Match信息(ETag的值)。如果服務器驗證資源的ETag沒有改變(該資源沒有更新),將返回一個304狀態告訴客戶端使用本地緩存文件。否則將返回200狀態和新的資源和Etag. 使用這樣的機制將提高網站的性能 | If-None-Match: "9jd00cdj34pss9ejqiw39d82f20d0ikd" | 固定 |
If-Range | 如果實體未改變,服務器發送客戶端丟失的部分,否則發送整個實體。參數也爲Etag | If-Range: "9jd00cdj34pss9ejqiw39d82f20d0ikd" | 固定 |
If-Unmodified-Since | 僅當該實體自某個特定時間以來未被修改的情況下,才發送迴應。 | If-Unmodified-Since: Dec, 26 Dec 2015 17:30:00 GMT | 固定 |
Max-Forwards | 限制該消息可被代理及網關轉發的次數。 | Max-Forwards: 10 | 固定 |
Origin | 發起一個針對跨域資源共享的請求(該請求要求服務器在響應中加入一個Access-Control-Allow-Origin的消息頭,表示訪問控制所允許的來源)。 | Origin: http://www.itbilu.com | 固定: 標準 |
Pragma | 防止頁面被緩存,在HTTP/1.1版本中,它和Cache-Control:no-cache作用是相同的。 Pargma只有一個用法, 例如: Pragma: no-cache。 注意:在HTTP/1.0版本中,只實現了Pragema:no-cache, 沒有實現Cache-Control |
Pragma: no-cache | 固定 |
Proxy-Authorization | 用於向代理進行認證的認證信息。 | Proxy-Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ== | 固定 |
Range | 表示請求某個實體的一部分,字節偏移以0開始。 | Range: bytes=500-999 | 固定 |
TE | 瀏覽器預期接受的傳輸時的編碼方式:可使用迴應協議頭Transfer-Encoding中的值(還可以使用"trailers"表示數據傳輸時的分塊方式)用來表示瀏覽器希望在最後一個大小爲0的塊之後還接收到一些額外的字段。 | TE: trailers,deflate;q=0.5 | 固定 |
Upgrade | 向服務器指定某種傳輸協議以便服務器進行轉換(如果支持) | Upgrade: HTTP/2.0, SHTTP/1.3, IRC/6.9, RTA/x11 | 固定 |
Via | 告訴服務器,這個請求是由哪些代理髮出的。 | Via: 1.0 fred, 1.1 itbilu.com.com (Apache/1.1) | 固定 |
Warning | 一個一般性的警告,表示在實體內容體中可能存在錯誤。 | Warning: 199 Miscellaneous warning | 固 |
Timeline:記錄並分析在網站的生命週期內所發生的各類事件,以此可以提高網頁的運行時間的性能。
Profiles:如果你需要Timeline所能提供的更多信息時,可以嘗試一下Profiles,比如記錄JS CPU執行時間細節、顯示JS對象和相關的DOM節點的內存消耗、記錄內存的分配細節。
Application:記錄網站加載的所有資源信息,包括存儲數據(Local Storage、Session Storage、IndexedDB、Web SQL、Cookies)、緩存數據、字體、圖片、腳本、樣式表等。
Security:判斷當前網頁是否安全。
Audits:對當前網頁進行網絡利用情況、網頁性能方面的診斷,並給出一些優化建議。比如列出所有沒有用到的CSS文件等
(1)General