HTTP請求流程你瞭解了麼？
我又回來了，先來波推廣，最硬的資源來自公眾號：前端美食匯，歡迎大家關注公眾號獲取最新的技術。提示，文末有福利，最硬的文章會首先發布在公眾號上喔
預備知識
前文沒有描述到傳輸和協議直接的層級對應關係，大概補充下網路通訊中資料傳輸對應的協議，首先了解下OSI(開放式系統互聯:Open System InterConnection)七層 模式，及其對應不同層次的協議。
| OSI體系結構 | TCP/IP相關協議結構 |
|---|---|
| 應用層 | HTTP,Telnet，FTP等 |
| 表示層 | |
| 會話層 | |
| 傳輸層 | TCP,UDP |
| 網路層 | IP |
| 資料鏈路層 | |
| 物理層 |
瞭解到HTTP協議是建立在TCP連線基礎之上的。HTTP 是一種允許瀏覽器向伺服器獲取資源的協議，是 Web 的基礎，通常由瀏覽器發起請求，用來獲取不同型別的檔案， 例如 HTML 檔案、CSS 檔案、JavaScript 檔案、圖片、視訊等。此外，HTTP 也是瀏覽器使用最廣的協議。
我們對HTTP不太瞭解的話都會存在這樣的疑惑，為什麼再次訪問同一站點會比第一次快，登入過一次後的網站再次訪問就處於登入狀態等，我們 通過對HTTP請求過程的剖析來解開這些謎團。
瀏覽器端發起 HTTP 請求流程
瀏覽器輸入網址：http://time.geekbang.org/index.html，之後會完成什麼步驟呢？
1、構建請求
首先，瀏覽器構建請求行資訊，構建好後，瀏覽器準備發起網路請求。
GET /index.html HTTP1.1
2、查詢快取
在真正發起網路請求之前，瀏覽器會先在瀏覽器快取中查詢是否有要請求的檔案。其中，瀏覽器快取是一種在本地儲存資源副本，以供下次請求時直接使用的技術。
當瀏覽器發現請求資源已經存在瀏覽器快取中存有副本，則會攔截請求並返回該資源副本結束請求。如果查詢快取失敗，則會進入網路請求。所以會有利於：
-
緩解伺服器端壓力，提升效能
-
對於網站來說，快取是實現快速資源載入的重要組成部分，減少了獲取資源的時間。
3、準備IP地址和埠
我們通過開頭預備知識和前文也大概瞭解到了HTTP和TCP的關係。瀏覽器使用 HTTP 協議作為應用層協議，用來封裝請求的文字資訊；並使用 TCP/IP 作傳輸層協議將它發到網路上，所以在 HTTP 工作開始之前，瀏覽器需要通過 TCP 與伺服器建立連線。也就是說 HTTP 的內容是通過 TCP 的傳輸資料階段來實現的。
TCP和HTTP的關係示意圖：
據此，我們可以知道建立HTTP網路請求就是，通過URL地址來解析獲取IP和埠資訊，建立伺服器和TCP連線。我們通過前文《TCP協議》 說到了資料包都是通過IP地址傳輸給接收方的。而我們網站一般的地址都是域名，所以需要把域名和IP地址做對映關係，即解析IP地址的系統“域名系統(DNS)”解析出 IP地址，並獲取對應埠號獲得建立連線的前置條件。換句話說，即瀏覽器請求DNS返回域名對應的IP，而請求DNS時也會查詢DNS資料快取服務，判斷是否域名已解析過， 如果解析過則查詢直接使用，拿到IP後則判斷URL是否指明埠號，沒有則HTTP協議預設時80埠。
4、等待TCP佇列
Chrome 有個機制，同一個域名同時最多隻能建立 6 個 TCP 連線，如果在同一個域名下同時有 10 個請求發生，那麼其中 4 個請求會進入排隊等待狀態，直至進行中的請求完成。當然，如果當前請求數量少於 6，會直接進入下一步，建立 TCP 連線。
5、建立TCP連線
佇列等待結束後，TCP和伺服器實現“三次握手”（前文TCP協議有描述），即客戶端和伺服器傳送三個資料包以確認連線，實現瀏覽器和服務的連線。
6、傳送HTTP請求
一旦建立了 TCP 連線，瀏覽器就可以和伺服器進行通訊了。而 HTTP 中的資料正是在這個通訊過程中傳輸的。
HTTP請求資料格式：
首先瀏覽器會向伺服器傳送請求行，它包括了請求方法、請求 URI（Uniform Resource Identifier）和 HTTP 版本協議。
其中請求方式有GET，POST,PUT,Delete等，其中常用的POST會用於傳送一些資料給伺服器，比如登入網站把使用者資訊傳送給伺服器，一般 這些資料會通過請求體傳送。
在瀏覽器傳送請求行命令之後，還要以請求頭形式傳送其他一些資訊，把瀏覽器的一些基礎資訊告訴伺服器。比如包含了瀏覽器所使用的作業系統、瀏覽器核心等資訊，以及當前請求的域名資訊、Cookie等。
伺服器端處理 HTTP 請求流程
1、返回請求
curl -i https://time.geekbang.org/
通過curl工具(或network面板)我們可以瞭解到伺服器返回的資料格式：
首先伺服器會返回響應行，包括協議版本和狀態碼。
如果出現錯誤，伺服器會通過請求行的狀態碼來返回對應的處理結果，例如：
-
最常用的狀態碼是 200，表示處理成功；
-
404，表示沒有找到頁面
-
500，表示伺服器錯誤
正如瀏覽器會隨同請求傳送請求頭一樣，伺服器也會隨同響應向瀏覽器傳送響應頭。響應頭包含了伺服器自身的一些資訊， 比如伺服器生成返回資料的時間、返回的資料型別（JSON、HTML、流媒體等型別），以及伺服器要在客戶端儲存的 Cookie 等資訊。
響應頭之後，伺服器會發送響應體資料，通常包含了HTML的實際內容。以上為伺服器響應瀏覽器的過程。
2、斷開連線
一旦伺服器向客戶端返回了請求資料，它就要關閉 TCP 連線。不過如果瀏覽器或者伺服器在其頭資訊中加入了：
Connection:Keep-Alive
則TCP 連線在傳送後將仍然保持開啟狀態，這樣瀏覽器就可以繼續通過同一個 TCP 連線傳送請求。保持 TCP 連線可以省去下次請求時需要建立連線的時間，提升資源載入速度。 如果一個頁面內嵌的圖片都來自同一web站點，則初始化一個持久連線則可複用減少TCP的連線。
3、重定向
重定向返回響應行和響應頭:
狀態 301 就是告訴瀏覽器，我需要重定向到另外一個網址，而需要重定向的網址正是包含在響應頭的 Location 欄位中，接下來，瀏覽器獲取 Location 欄位中的地址，並使用該地址重新導航，這就是一個完整重定向的執行流程。
總結
通過http請求的完整過程，我們就知道，請求過程中DNS緩緩和頁面資源快取會被瀏覽器快取起來，以減少向伺服器請求的資源，所以會再次請求站點時速度會快。
瀏覽器資源快取處理過程：
從上圖的第一次請求可以看出，當伺服器返回 HTTP 響應頭給瀏覽器時，瀏覽器是通過響應頭中的 Cache-Control 欄位來設定是否快取該資源。通常，我們還需要為這個資源設定一個快取過期時長，而這個時長是通過 Cache-Control 中的 Max-age 引數來設定的。
因此在該快取資源還未過期的情況下, 如果再次請求該資源，會直接返回快取中的資源給瀏覽器。
如果快取過期了，瀏覽器則會繼續發起網路請求，並且在 HTTP 請求頭中帶上If-None-Match，伺服器收到請求頭後，會根據 If-None-Match 的值來判斷請求的資源是否有更新。
-
如果沒有更新，就返回 304 狀態碼，相當於伺服器告訴瀏覽器，這個快取可以繼續使用。
-
如果資源有更新，伺服器就直接返回最新資源給瀏覽器。
登入網站，通過POST方式提交資訊給伺服器，伺服器接收到瀏覽器提交的資訊之後，查詢驗證資訊正確則會生成表面使用者身份的字串寫入響應頭的Set-Cookie欄位裡返回瀏覽器。
瀏覽器解析響應頭，如有Set-Cookie欄位則儲存在本地，當用戶再次訪問時，發起HTTP請求前瀏覽器會讀取Cookie資料並寫入請求頭髮送到伺服器，伺服器再次判斷資訊，如果 正確則展示使用者登入狀態及使用者資訊。
最後總結出瀏覽器中的HTTP請求從發起到結束一共經歷了八個階段：構建請求、查詢快取、準備 IP 和埠、等待 TCP 佇列、建立 TCP 連線、發起 HTTP 請求、伺服器處理請求、伺服器返回請求和斷開連線。
詳細HTTP請求流程：
更多學習
HTTP快取：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Caching_FAQ
HTTP狀態碼：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Status
HTTP請求方式：https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Methods
七層網路協議：https://blog.csdn.net/kulala082/article/details/79695132
關注公眾號，後臺回覆“抖音”關鍵字獲取抖音相關編輯及推廣方式；回覆“線上運營”獲取入門運營三部曲；回覆“springboot快速入門”，“TensorFlow人工智慧實踐”，“java基礎”，“Nginx”，“node全棧實戰”關鍵字獲取相關內容。
關注公眾號福利持續更新~