什么是HTTP

HTTP 全稱(chēng)超?文本傳輸協(xié)議，也就是HyperTextTransferProtocol。 其中我們常見(jiàn)的文本，圖片，視頻這些東西都可以用超文本進(jìn)行表示，而我?？吹呢埰?，也屬于超文本，所以大家不要再說(shuō)我偷偷看貓片了，我只是在看超文本。HTTP只是定義了一套傳輸超文本的規則，只要符合了這一套規則，不管你是用iphone，還是用老爺機，都可以實(shí)現貓片的傳輸。

七層網(wǎng)絡(luò )

大概了解了HTTP后，給大家看看它在它們家族里的地位。HTTP位于應用層，跟它類(lèi)似的協(xié)議還有常見(jiàn)的FTP協(xié)議，常見(jiàn)的某影天堂的下載鏈接曾經(jīng)經(jīng)常是以FTP開(kāi)頭的。

HTTP報文格式

有點(diǎn)抽象？不知道說(shuō)的啥？那實(shí)操一下，用wireshark抓包看一下貓片里的請求報文和響應報文具體長(cháng)什么樣子吧

請求報文

GET/cmaskboss/164203142_30_1.enhance.webmaskHTTP/1.1Host: upos-sz-staticks3.bilivideo.comConnection: keep-aliveUser-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.150 Safari/537.36Accept: */*Origin: https://www.bilibili.comSec-Fetch-Site: cross-siteSec-Fetch-Mode: corsSec-Fetch-Dest: emptyReferer: https://www.bilibili.com/Accept-Encoding: identityAccept-Language: zh-CN,zh;q=0.9Range: bytes=0-16

復制代碼

這上面第一行的GET 就是請求方法，/cmaskboss/164203142_30_1.enhance.webmask則是URL, 而HTTP/1.1則是協(xié)議版本。接下來(lái)從Host開(kāi)始到最后一行Range，都是Headers頭。

響應報文

HTTP/1.1206PartialContentContent-Type:application/octet-streamContent-Length:17Connection:keep-aliveServer:TengineETag:"92086de1e6d1d4791fb950a0ac7e30ba"Date:Sat,30Jan202109:31:31GMTLast-Modified:Sun,04Oct202001:54:28GMTExpires:Mon,01Mar202109:31:31GMTAge:1018695Content-Range:bytes0-16/353225Accept-Ranges:bytesX-Application-Context:applicationx-kss-request-id:75bcbfa8ab194e3c825e89c81a912692x-kss-BucketOwner:MjAwMDAyMDEwNw==X-Info-StorageClass:-Content-MD5:kght4ebR1HkfuVCgrH4wug==X-Cache-Status:HITfromKS-CLOUD-JH-MP-01-03X-Cache-Status:HITfromKS-CLOUD-TJ-UN-14-13X-Cache-Status:HITfromKS-CLOUD-LF-UN-11-25Access-Control-Allow-Origin:https://www.bilibili.comAccess-Control-Allow-Headers:Origin,X-Requested-With,Content-Type,Accept,rangeX-Cdn-Request-ID:7e2c783ca7d392624118593ec1dc66bc復制代碼

類(lèi)似請求報文，HTTP/1.1是協(xié)議版本，206是狀態(tài)碼，Partial Content則是狀態(tài)描述符。接下來(lái)從Content-Type開(kāi)始到最后一行X-Cdn-Request-ID都是Headers信息。

報文信息解讀

其實(shí)上面的抓包信息，在瀏覽器里按F12就能看到，之所以要用wireshark可能只是裝X效果比較好吧。按下F12看到的響應數據就跟下圖展示的那樣。

1.請求數據

2.響應數據

3.Request URL

URL是什么

URL 代表著(zhù)是統一資源定位符（Uniform Resource Locator）。作用是為了告訴使用者 某個(gè)資源在 Web 上的地址。這個(gè)資源可以是一個(gè) HTML 頁(yè)面，一個(gè) CSS 文檔，一幅圖像或一個(gè)貓片等等。上面我們請求貓片的URL就是https://upos-sz-staticks3.bilivideo.com/cmaskboss/164203142_30_1.enhance.webmask這里面細分，又可以分為好幾個(gè)部分。

協(xié)議部分

表示該URL的協(xié)議部分為http還是https，會(huì )用//為分隔符。上面的URL表示網(wǎng)頁(yè)用的是HTTPS協(xié)議，而上面提到的X影天堂用的則是ftp協(xié)議的下載鏈接。

域名部分

域名是upos-sz-staticks3.bilivideo.com，在發(fā)送請求前，會(huì )向DNS服務(wù)器解析IP，如果已經(jīng)知道ip，還可以跳過(guò)DNS解析那一步，直接把IP當做域名部分使用。

端口部分

域名后面有些時(shí)候會(huì )帶有端口，和域名之間用:分隔，端口不是一個(gè)URL的必須的部分。當網(wǎng)址為http://時(shí)，默認端口為80

當網(wǎng)址為https://時(shí)，默認端口為443，以上兩種都可以省略端口號。上面的URL其實(shí)省略了443端口號。

虛擬目錄

從域名的第一個(gè)/開(kāi)始到最后一個(gè)/為止，是虛擬目錄的部分。虛擬目錄也不是URL必須的部分，本例中的虛擬目錄是/cmaskboss/

文件名部分

從域名最后一個(gè)/開(kāi)始到?為止，是文件名部分；如果沒(méi)有?，則是從域名最后一個(gè)/開(kāi)始到為止，是文件名部分；如果沒(méi)有?和，那么就從域名的最后一個(gè)/從開(kāi)始到結束，都是文件名部分。本例中的文件名是164203142_30_1.enhance.webmask，文件名也不是一個(gè)URL的必須部分。

URL 和 URI 的區別

URL:Uniform Resource Locator統一資源定位符；URI: Uniform Resource Identifier統一資源標識符；

其實(shí)一直有個(gè)誤解，很多人以為URI是URL的子集，其實(shí)應該反過(guò)來(lái)。URL是URI的子集才對。簡(jiǎn)單解釋下。 假設"賣(mài)客"(URI)是一種資源，而"在迪麗亦巴的懷里"表明了一個(gè)位置。如果你想要找到（locate）賣(mài)客，那么你可以到"在迪麗亦巴懷里"找到賣(mài)客，而"在迪麗亦巴懷里的/賣(mài)客"才是我們常說(shuō)的URL。而"在迪麗亦巴懷里的/賣(mài)客"（URL）顯然是"賣(mài)客"（URI）的子集，畢竟，"賣(mài)客"還可能是"在牛亦菲懷里的/賣(mài)客"（其他URL）。

4.Request Method

HTTP 定義了一組請求方法，以表明要對給定資源執行的操作。指示針對給定資源要執行的期望動(dòng)作.。雖然他們也可以是名詞，但這些請求方法有時(shí)被稱(chēng)為HTTP動(dòng)詞.。每一個(gè)請求方法都實(shí)現了不同的語(yǔ)義。

這次請求B站貓片的請求里用的是GET，意味著(zhù)獲取。但其實(shí)HTTP定義了多種請求方法，來(lái)滿(mǎn)足各種需求。除了Get，還有幾個(gè)POST、HEAD、OPTIONS、PUT、DELETE、TRACE 和 CONNECT。

常見(jiàn)的各個(gè)請求方法的具體功能如下：

GET

請求指定的頁(yè)面信息，并返回消息主體(body) 頭信息(header)。

HEAD：

HEAD和GET本質(zhì)是一樣的，區別在于HEAD只返回頭信息(header)，不返回消息主體(body)。大家不要以為它沒(méi)用，它跟GET和POST一樣，在http/1.0的時(shí)候就存在了，實(shí)屬三元老之一了。主要用途

如果想要判斷某個(gè)資源是否存在，雖然用GET也能做到，但這里用HEAD還省下拿body的消耗，返回狀態(tài)碼200就是有404就是無(wú)如果請求的是一個(gè)比較大的資源，比如一個(gè)超大視頻和文件，你只想知道它到底有多大，而不需要整個(gè)下載下來(lái)，這時(shí)候使用HEAD請求，返回的headers會(huì )帶有文件的大?。╟ontent-lenght）。

POST

向服務(wù)器提交數據。這個(gè)方法用途廣泛，幾乎目前所有的提交操作都是靠這個(gè)完成。POST跟GET最常用，但最大的區別在于，POST每次調用都可能會(huì )修改數據，是非冪等的，而GET類(lèi)似于只讀，是冪等的。

PUT：

這個(gè)方法比較少見(jiàn)。在HTTP規范中POST是非等冪的，多次調用會(huì )產(chǎn)生不同的結果。比如：創(chuàng )建一個(gè)用戶(hù),由于網(wǎng)絡(luò )原因或是其他原因多創(chuàng )建了幾次,那么將會(huì )有多個(gè)用戶(hù)被創(chuàng )建。而PUT id/xiaobai 則會(huì )創(chuàng )建一個(gè)id為 xiaobai 的用戶(hù)，多次調用還是會(huì )創(chuàng )建的結果是一樣的，所以PUT是等冪的。但是一般為了避免造成心智負擔，實(shí)戰中也會(huì )使用POST替代PUT。

DELETE：

刪除某一個(gè)資源?；旧线@個(gè)也很少見(jiàn)，一般實(shí)戰中如果是刪除操作，也是使用POST來(lái)替代。

OPTIONS：

options是什么

它用于獲取當前URL所支持的方法。若請求成功，則它會(huì )在HTTP響應頭部中帶上給各種Allow的頭，表明某個(gè)請求在對應的服務(wù)器中都支持哪種請求方法。比如下圖：

這里面需要關(guān)注的點(diǎn)有兩個(gè)

Request Header里的關(guān)鍵字段Response Header里的關(guān)鍵字段

Options堪稱(chēng)是網(wǎng)絡(luò )協(xié)議中的老實(shí)人，就好像老實(shí)人剛談了個(gè)女朋友，每次牽手前都要問(wèn)下人家 我可以牽你的手嗎？， 我可以抱你嗎？，得到了答應后才會(huì )下手。差點(diǎn)被這老實(shí)人氣質(zhì)感動(dòng)得留下了不爭氣的淚水。

什么時(shí)候需要使用options

在跨域（記住這個(gè)詞，待會(huì )解釋?zhuān)┑那闆r下，瀏覽器發(fā)起復雜請求前會(huì )自動(dòng)發(fā)起 options 請求?？缬蚬蚕順藴室幏兑?，對那些可能對服務(wù)器數據產(chǎn)生副作用的 HTTP 請求方法（特別是 GET 以外的 HTTP 請求，或者搭配某些 MIME 類(lèi)型的 POST 請求），瀏覽器必須首先使用 options 方法發(fā)起一個(gè)預檢請求，從而獲知服務(wù)端是否允許該跨域請求。服務(wù)器確認允許之后，才發(fā)起實(shí)際的 HTTP 請求。

這里提到了兩個(gè)關(guān)鍵詞：

跨域復雜請求

什么是簡(jiǎn)單請求和復雜請求。

某些請求不會(huì )觸發(fā) CORS 預檢請求，這樣的請求一般稱(chēng)為"簡(jiǎn)單請求"，而會(huì )觸發(fā)預檢的請求則為"復雜請求"。

簡(jiǎn)單請求請求方法為GET、HEAD、POST只有以下Headers字段AcceptAccept-LanguageContent-LanguageContent-TypeDPR/Downlink/Save-Data/Viewport-Width/Width(這些不常見(jiàn)，放在一起)Content-Type只有以下三種application/x-www-form-urlencodedmultipart/form-datatext/plain請求中的任意 XMLHttpRequestUpload 對象均沒(méi)有注冊任何事件監聽(tīng)器；請求中沒(méi)有使用 ReadableStream 對象。復雜請求不滿(mǎn)足簡(jiǎn)單請求的，都是復雜請求

由此可見(jiàn)，因為上述請求在獲取B站資源的請求Headers里帶有Access-Control-Request-Headers: range, 而range正好不在簡(jiǎn)單請求的條件2中提到的Headers范圍里，因此屬于復雜請求，于是觸發(fā)預檢options請求。

什么是跨域

剛剛提到了一個(gè)詞叫跨域，那什么是跨域呢？在了解跨域之前，首先要了解一個(gè)概念：同源。所謂同源是指，域名、協(xié)議、端口均相同。

不明白沒(méi)關(guān)系，舉個(gè)例子。

需要特別注意的是，localhost和127.0.0.1雖然都指向本機，但也不屬于同源。

而非同源之間網(wǎng)頁(yè)調用就是我們所說(shuō)的跨域。在瀏覽器同源策略限制下，向不同源發(fā)送XHR請求，瀏覽器認為該請求不受信任，禁止請求，具體表現為請求后不正常響應。

options帶來(lái)什么問(wèn)題

由此可見(jiàn)，復雜請求的條件其實(shí)非常容易滿(mǎn)足，而一旦滿(mǎn)足復雜請求的條件，則瀏覽器便會(huì )發(fā)送2次請求（一次預檢options，一次復雜請求），這一次options就一來(lái)一回（一個(gè)RTT），顯然會(huì )導致延遲和不必要的網(wǎng)絡(luò )資源浪費，高并發(fā)情況下則可能為服務(wù)器帶來(lái)嚴重的性能消耗。

如何優(yōu)化options

每次復雜請求前都會(huì )調用一次options，這其實(shí)非常沒(méi)有必要。因為大部分時(shí)候相同的請求，短時(shí)間內獲得的結果是不會(huì )變的，是否可以通過(guò)瀏覽器緩存省掉這一次查詢(xún)？

Access-Control-Max-Age就是優(yōu)化這個(gè)流程中使用的一個(gè)Header。它的作用是當你每次請求options方法時(shí)，服務(wù)端返回調用支持的方法（Access-Control-Allow-Methods ）和Headers（Access-Control-Allow-Headers）有哪些，同時(shí)告訴你，它在接下來(lái)Access-Control-Max-Age時(shí)間（單位是秒）里都支持，則這段時(shí)間內，不再需要使用options進(jìn)行請求。特別注意的是，當Access-Control-Max-Age的值為-1時(shí)，表示禁用緩存，每一次請求都需要發(fā)送預檢請求，即用OPTIONS請求進(jìn)行檢測。

5.Status Code

狀態(tài)碼是什么

HTTP Status Code是常說(shuō)的HTTP狀態(tài)碼。當用戶(hù)訪(fǎng)問(wèn)一個(gè)網(wǎng)頁(yè)時(shí)，瀏覽器會(huì )向網(wǎng)頁(yè)所在服務(wù)器發(fā)出請求。服務(wù)器則會(huì )根據請求作出響應，而狀態(tài)碼則是響應的一部分，代表著(zhù)本次請求的結果。所有狀態(tài)碼的第一個(gè)數字代表了響應的大概含義，組合上第二第三個(gè)數字則可以表示更具體的原因。如果請求失敗了，通過(guò)這個(gè)狀態(tài)碼，大概初步判斷出這次請求失敗的原因。以下是五類(lèi)狀態(tài)碼的含義。

狀態(tài)碼流程

可以根據以下流程圖了解下各類(lèi)狀態(tài)碼間的關(guān)系。

2xx和3xx之間的流程關(guān)系4xx的狀態(tài)流程5xx的狀態(tài)流程

常見(jiàn)狀態(tài)碼介紹

200 OK

這是最常見(jiàn)的狀態(tài)碼。代表請求已成功，數據也正常返回。而B(niǎo)站貓片里雖然響應成功了，但卻不是200，而是206，是為什么呢，接下去繼續看看。

206 Partial Content

這個(gè)狀態(tài)碼在上面B站請求的響應結果。服務(wù)器已經(jīng)成功處理了部分 GET 請求。類(lèi)似于B站看視頻或者迅雷這類(lèi)的 HTTP下載工具都是使用此類(lèi)響應實(shí)現斷點(diǎn)續傳或者將一個(gè)大文檔分解為多個(gè)下載段同時(shí)下載。

307 Temporary Redirect內部重定向。重定向的意思是，當你輸入一個(gè)網(wǎng)址的時(shí)候，瀏覽器會(huì )自動(dòng)幫你跳轉到另外一個(gè)網(wǎng)址上。比如，當你在瀏覽器輸入框輸入http://www.baidu.com/時(shí)。由于使用http并不安全，百度會(huì )自動(dòng)幫你跳轉到它對應的https網(wǎng)頁(yè)上。而此時(shí)，需要重定向的地址，會(huì )通過(guò)Response Headers的Location返回404 Not Found請求失敗，請求所希望得到的資源未被在服務(wù)器上發(fā)現。出現這個(gè)錯誤的最有可能的原因是服務(wù)器端沒(méi)有這個(gè)頁(yè)面，或者是Request Method與注冊URL的Method不一致，比如我有一個(gè)URL在服務(wù)端注冊的Request Method 為POST，但調用的時(shí)候卻錯誤用了GET，則也會(huì )出現404錯誤。499 Client has closed connection網(wǎng)絡(luò )請求過(guò)程中，由于服務(wù)端處理時(shí)間過(guò)長(cháng)，客戶(hù)端超時(shí)。一般常見(jiàn)于，后端服務(wù)器處理時(shí)間過(guò)長(cháng)，而客戶(hù)端也設置了一個(gè)超時(shí)等待時(shí)間，客戶(hù)端等得不耐煩了，主動(dòng)關(guān)掉連接時(shí)報出。502 Bad Gateway服務(wù)器方面無(wú)法給予正常的響應。一般常見(jiàn)于服務(wù)器崩潰后，nginx 無(wú)法正常收到服務(wù)端的響應，給客戶(hù)端返回502狀態(tài)碼。504 Gateway Timeout網(wǎng)絡(luò )請求過(guò)程中，由于服務(wù)端處理時(shí)間過(guò)長(cháng)，網(wǎng)關(guān)超時(shí)。一般常見(jiàn)于，后端服務(wù)器邏輯處理時(shí)間過(guò)長(cháng)，甚至長(cháng)于 nginx設置的最長(cháng)等待時(shí)間時(shí)報錯。它跟 499 狀態(tài)碼非常像，區別在于499 表示的是客戶(hù)端超時(shí)，504是網(wǎng)關(guān)超時(shí)。如果是499超時(shí)，可以考慮修改客戶(hù)端的代碼調整超時(shí)時(shí)間，如果是504，則考慮調整nginx的超時(shí)配置。

6. Headers

Content-Length

Content-Length是HTTP的消息長(cháng)度, 用十進(jìn)制數字表示。Content-Length首部指出報文中消息的當前實(shí)際字節大小。如果消息文本進(jìn)行了gzip壓縮的話(huà)，Content-Length指的就是壓縮后的大小而不是原始大小。

正常情況下Content-Length是不需要手動(dòng)去設置的，大部分語(yǔ)言的網(wǎng)絡(luò )庫都會(huì )自動(dòng)封裝好，但是如果在一些特殊情況下，出現Content-Length與實(shí)際要發(fā)送的消息大小不一致，就會(huì )出現一些問(wèn)題。

如果Content-Length