*** 此文轉載於：https://blog.csdn.net/WangTaoTao_/article/details/97488206 ***

*** 文章中彩圖源自：https://blog.csdn.net/u011318077 ***

*** 應用配置七層VS時，有些應用訪問異常，瞭解http通訊，方便做排錯 ***

一、瞭解下HTTP協議

HTTP協議（超文字傳輸協議）：是瀏覽器和Web伺服器之間進行資料通訊的格式，也就是說如果想要實現瀏覽器和Web伺服器之間的通訊就需要HTTP這個協議。並且HTTP協議是基於TCP協議的，傳送資料之前都需要建立連線。

接下來我們來介紹一下瀏覽器訪問Web伺服器的通訊過程：（重點）

1. 首先使用者在瀏覽器的位址列中輸入網址
2. 瀏覽器會通過DNS將輸入的域名解析成IP地址
3. 通過IP地址找到伺服器並建立連線
4. 然後瀏覽器向伺服器傳送HTTP請求資料
5. 服務區收到請求資料後在伺服器內部尋找資源
6. 找到資源後將HTTP響應資料返回給瀏覽器

二、普及一下URL （統一資源定位符）

URL就是網路資源的地址，簡稱也就是我們平時所說的網址。通過URL能夠找到網路中對應的資源資料。

URL的表現形式：
例如：https://www.csdn.com/WangTaoTao_.html

其中https://是協議部分 、www.csdn.com是域名部分 、 /WangTaoTao_.html是資源路徑部分

這裡的域名指的就是IP地址的別名，使用域名的原因就是為了方便記住某臺主機的IP地址。

三、檢視HTTP協議的通訊過程

使用谷歌瀏覽器開啟www.csdn.com介面，然後按快捷鍵crtl+shift+I / F12或者右擊任意處選擇’檢查’皆可調出開發者工具

開發者工具的效果圖：

開發者工具的標籤選項說明：
Elements（元素標籤）：用來檢視或者修改HTML中的內容等
Console（控制檯）：檢視錯誤資訊，列印除錯資訊，除錯js程式碼等
Sources（原始碼）：檢視靜態資原始檔，除錯JS程式碼等
Network（網路）：檢視網頁的http協議通訊過程等

開發者工具Network效果圖：

. 注：這裡的每項記錄都是請求+響應的一次過程

雙擊進入其中任何一個過程，可以看到這個過程裡的請求資訊和響應資訊。

• Headers選項總共有三部分組成:

1. General: 主要資訊
2. Response Headers: 響應頭
3. Request Headers: 請求頭

• Response選項是檢視響應體資訊的
響應體中存放的主要是伺服器返回給瀏覽器的資料

四、HTTP的請求報文

HTTP最常見的請求報文有兩種：
GET方式的請求報文（獲取Web伺服器的資料）
POST方式的請求報文（向Web伺服器提交資料）

HTTP GET請求報文效果圖：

GET請求報文的說明：

—請求行—
GET / HTTP/1.1 # GET 請求方式 請求資源路徑 HTTP協議版本
—請求頭—
Host: www.csdn.net # Web伺服器的主機地址和埠號，這裡埠號沒寫，預設是80
Connection: keep-alive #與伺服器保持長連線 close 代表保持短連線
Cache-Control: max-age=0 # 快取控制
Upgrade-Insecure-Requests: 1 #使用https請求
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.142 Safari/537.36 #使用者代理，就是客戶端資訊
Accept:text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,/;q=0.8,application/signed-exchange;v=b3 #可以接受的資料型別
Accept-Encoding: gzip, deflate, br #可以接受的壓縮格式
Accept-Language: zh-CN,zh;q=0.9 # 可以接受的語言 zh-CN簡體中文 q=0.9代表優先順序
Cookie: uuid_tt_dd=10_20345828700-1562254029050-135310;UserName=WangTaoTao_。。。; #登入使用者的身份標識
—空行—

注：GET方式一般沒有請求體，每一行後面都有一個\r\n換行字元，只是瀏覽器中看不到

HTTP POST請求報文效果圖：
POST方式下是有請求體的

POST請求報文的說明：

---- 請求行 ----
POST /xmweb?host=mail.wtt.cn&_t=1542884567319 HTTP/1.1 # POST請求方式 請求資源路徑 HTTP協議版本
---- 請求頭 ----
Host: mail.wtt.cn # 伺服器的主機地址和埠號,預設是80
Connection: keep-alive # 和服務端保持長連線
Content-Type: application/x-www-form-urlencoded # 告訴服務端請求的資料型別
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36 # 客戶端的名稱
---- 空行 ----
---- 請求體 ----
username=hello&pass=hello # 請求引數

#注：POST方式請求體，每一行後面也都有一個\r\n換行字元，只是瀏覽器中看不到

總結一下請求報文：

一個HTTP的GET方式請求報文由：請求行、請求頭、空行組成
POST方式的請求報文由：請求行、請求頭、空行和請求體組成
請求行都是由：請求方式、資源路徑、HTTP協議版本組成

五、HTTP的響應報文

1.HTTP響應報文效果圖：

響應報文的說明：

—響應行—
HTTP/1.1 200 OK # 協議版本 狀態碼 狀態說明
—響應頭—
Date: Fri, 26 Jul 2019 15:12:26 GMT # 伺服器的響應的時間
Content-Type: text/html; charset=UTF-8 # 傳送的內容型別
Transfer-Encoding: chunked # 傳送給瀏覽器的內容是不確定的長度，Content-length 表示固定長度
Connection: keep-alive #與客戶端瀏覽器保持長連線
Server: openresty # 伺服器的名字
Content-Encoding: gzip # 內容的壓縮格式
—空行—
—響應體—
響應體中的資料在Response中，也就是返回給瀏覽器的資料
注：每項資料的後面也都有\r\n

補充：HTTP狀態碼的介紹

HTTP 狀態碼是用於表示web伺服器響應狀態的3位數字程式碼。

狀態碼 說明
200 請求成功
307 重定向
400 錯誤的請求，請求地址或者引數有誤
404 請求資源在伺服器不存在
500 伺服器內部原始碼出現錯誤
5XX 有可能是反爬蟲

總結一下HTTP響應報文：

一個HTTP響應報文是有響應行、響應頭、空行、響應體組成
響應行由HTTP協議版本、狀態碼和狀態描述組成

六、HTTP響應頭資訊