不管是前端還是後臺開發，在找工作的時候，只要涉及到網絡方面的知識，必然會問到這樣一個問題：當我在瀏覽器的地址欄裡輸入一個完整的URL，在按下回車直至頁面加載完成，整個過程發生了什麼？這是一道考察綜合能力的面試題，今天我們就一起來總結下該如何回答這個問題，當然我只是在這裡講解主要的知識點，涉及到的細節還需要大家再去找資料看。
整體過程
在這整個過程中，大致可以分為以下幾個過程
DNS域名解析
TCP連接
HTTP請求
處理請求返回HTTP響應
頁面渲染
關閉連接
DNS域名解析
首先我們應該要知道的是，在地址欄輸入的域名並不是最後資源所在的真實位置，域名只是與IP地址的一個映射。網絡服務器的IP地址那麼多，我們不可能去記一串串的數字，因此域名就產生了，域名解析的過程實際是將域名還原為IP地址的過程。
DNS域名解析有兩種方法，分別是迭代查詢和遞歸查詢
迭代查詢
迭代查詢
遞歸查詢
遞歸查詢
TCP連接
在通過第一步的DNS域名解析後，獲取到了服務器的IP地址，在獲取到IP地址後，便會開始建立一次連接，這是由TCP協議完成的，主要通過三次握手進行連接。
三次握手的示意圖如下：
三次握手
HTTP請求
在確認與服務器建立連接後，便會發送一個HTTP請求，HTTP請求的報文主要包括請求行，請求頭，請求正文。
請求行的內容一般類似於：GET index.html HTTP/1.1
請求頭的內容一般如下，可以通過瀏覽器開發者工具查看
請求頭
請求體一般包含請求傳遞的參數
請求體
處理HTTP請求並響應
服務器在收到瀏覽器發送的HTTP請求之後，會將收到的HTTP報文封裝成HTTP的Request對象，並通過不同的Web服務器進行處理，處理完的結果以HTTP的Response對象返回，主要包括狀態碼，響應頭，響應報文三個部分。
狀態碼主要包括以下部分
1xx：指示信息–表示請求已接收，繼續處理。
2xx：成功–表示請求已被成功接收、理解、接受。
3xx：重定向–要完成請求必須進行更進一步的操作。
4xx：客戶端錯誤–請求有語法錯誤或請求無法實現。
5xx：服務器端錯誤–服務器未能實現合法的請求。
響應頭主要由Cache-Control、 Connection、Date、Pragma等組成
響應體為服務器返回給瀏覽器的信息，主要由HTML，css，js，圖片文件組成
頁面渲染
頁面DOM樹的渲染是個複雜的過程，需要深入瞭解DOM原理，這裡簡要描述一下，主要過程如下
DOM樹渲染
關閉連接
在頁面元素傳輸完成後，會選擇關閉連接，此時用到的是TCP四次揮手，示意圖如下
TCP四次揮手
總結
至此一個完成的URL從輸入到加載的過程就分析完了，今天的內容有沒有一點收穫呢？
相關推薦
