1.1 瀏覽器根據域名解析IP地址
瀏覽器根據訪問的域名找到其IP地址。DNS查找過程如下：
瀏覽器緩存：首先搜索瀏覽器自身的DNS緩存（緩存的時間比較短，大概只有1分鐘，且只能容納1000條緩存），看自身的緩存中是否是有域名對應的條目，而且沒有過期，如果有且沒有過期則解析到此結束。
系統緩存：如果瀏覽器自身的緩存里面沒有找到對應的條目，那么瀏覽器會搜索操作系統自身的DNS緩存，如果找到且沒有過期則停止搜索解析到此結束。
路由器緩存：如果系統緩存也沒有找到，則會向路由器發送查詢請求。
ISP（互聯網服務提供商） DNS緩存：如果在路由緩存也沒找到，最后要查的就是ISP緩存DNS的服務器。
1.2 瀏覽器與WEB服務器建立一個TCP連接
TCP的3次握手。
1.3 瀏覽器給WEB服務器發送一個HTTP請求
一個HTTP請求報文由請求行（request line）、請求頭部（headers）、空行（blank line）和請求數據（request body）4個部分組成。
1.3.1 請求行
請求行分為三個部分：請求方法、請求地址URL和HTTP協議版本，它們之間用空格分割。例如，GET /index.html HTTP/1.1。
1.請求方法
HTTP/1.1 定義的請求方法有8種：GET（完整請求一個資源）、POST（提交表單）、PUT（上傳文件）、DELETE（刪除）、PATCH、HEAD（僅請求響應首部）、OPTIONS（返回請求的資源所支持的方法）、TRACE（追求一個資源請求中間所經過的代理）。最常的兩種GET和POST，如果是RESTful接口的話一般會用到GET、POST、DELETE、PUT。
（1）GET
當客戶端要從服務器中讀取文檔時，當點擊網頁上的鏈接或者通過在瀏覽器的地址欄輸入網址來瀏覽網頁的，使用的都是GET方式。GET方法要求服務器將URL定位的資源放在響應報文的數據部分，會送給客戶端。使用GET方法時，請求參數和對應的值附加在URL后面，利用一個問號'？’代表URL的結尾與請求參數的開始，傳遞參數長度受限制。例如，/index.jsp?id=100&op=bind。通過GET方式傳遞的數據直接放在地址中，所以GET方式的請求一般不包含“請求內容”部分，請求數據以地址的形式表現在請求行。地址中'？’之后的部分就是通過GET發送的請求數據，各個數據之間用'&’符號隔開。顯然這種方式不適合傳送私密數據。另外，由于不同的瀏覽器對地址的字符限制也有所不同，一半最多只能識別1024個字符，所以如果需要傳送大量數據的時候，也不適合使用GET方式。如果數據是英文字母/數字，原樣發送；如果是空格，轉換為+；如果是中文/其他字符，則直接把字符串用BASE64加密，得出：%E4%BD%A0%E5%A5%BD，其中%XX中的XX為該符號以16進制表示的ASCII。
（2）POST
允許客戶端給服務器提供信息較多。POST方法將請求參數封裝在HTTP請求數據中，以名稱/值的形式出現，可以傳輸大量數據，這樣POST方式對傳送的數據大小沒有限制，而且也不會顯示在URL中。POST方式請求行中不包含數據字符串，這些數據保存在“請求內容”部分，各數據之間也是使用'&’符號隔開。POST方式大多用于頁面的表單中。因為POST也能完成GET的功能，因此多數人在設計表單的時候一律都使用POST方式，其實這是一個誤區。GET方式也有自己的特點和優勢，我們應該根據不同的情況來選擇是使用GET還是使用POST。
2.URL
URL：統一資源定位符，是一種資源位置的抽象唯一識別方法。
組成：<協議>://<主機>:<端口>/<路徑>
端口和路徑有事可以省略（HTTP默認端口號是80）
3.協議版本
協議版本的格式為：HTTP/主版本號.次版本號，常用的有HTTP/1.0和HTTP/1.1
1.3.2 請求頭部
請求頭部為請求報文添加了一些附加信息，由“名/值”對組成，每行一對，名和值之間使用冒號分隔。
請求頭部的最后會有一個空行，表示請求頭部結束，接下來為請求數據。
1.3.3 請求數據
請求數據不在GET方法中使用，而在POST方法中使用。POST方法適用于需要客戶填寫表單的場合。與請求數據相關的最長使用的請求頭部是Cntent-Type和Content-Length。下面是一個POST方法的請求報文：
POST /index.php HTTP/1.1 請求行
Host: localhost
User-Agent: Mozilla/5.0 (Windows NT 5.1; rv:10.0.2) Gecko/20100101 Firefox/10.0.2 請求頭
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,/;q=0.8
Accept-Language: zh-cn,zh;q=0.5
Accept-Encoding: gzip, deflate
Connection: keep-alive
Referer: http://localhost/
Content-Length：25
Content-Type：application/x-www-form-urlencoded
空行
username=aa&password=1234 請求數據
1.4 服務器端響應HTTP請求，瀏覽器得到HTML代碼
HTTP響應報文由狀態行（status line）、相應頭部（headers）、空行（blank line）和響應數據（response body）4個部分組成。
1.4.1 狀態行
狀態行由3部分組成，分別為：協議版本、狀態碼、狀態碼掃描。其中協議版本與請求報文一致，狀態碼描述是對狀態碼的簡單描述。
1.4.2 響應頭部
1.4.3 響應數據
用于存放需要返回給客戶端的數據信息。
HTTP/1.1 200 OK 狀態行
Date: Sun, 17 Mar 2013 08:12:54 GMT 響應頭部
Server: Apache/2.2.8 (Win32) PHP/5.2.5
X-Powered-By: PHP/5.2.5
Set-Cookie: PHPSESSID=c0huq7pdkmm5gg6osoe3mgjmm3; path=/
Expires: Thu, 19 Nov 1981 08:52:00 GMT
Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0
Pragma: no-cache
Content-Length: 4393
Keep-Alive: timeout=5, max=100
Connection: Keep-Alive
Content-Type: text/html; charset=utf-8
空行
<html> 響應數據
<head>
<title>HTTP響應示例<title>
</head>
<body>
Hello HTTP!
</body>
</html>
1.5 瀏覽器解析HTML代碼，并請求HTML代碼中的資源
瀏覽器拿到HTML文件后，開始解析HTML代碼，遇到靜態資源時，就向服務器端去請求下載。
1.6 關閉TCP連接，瀏覽器對頁面進行渲染呈現給用戶
瀏覽器利用自己內部的工作機制，把請求到的靜態資源和HTML代碼進行渲染，呈現給用戶。
————————————————
版權聲明：本文為CSDN博主「艾倫lee」的原創文章，遵循CC 4.0 BY-SA版權協議，轉載請附上原文出處鏈接及本聲明。
原文鏈接：https://blog.csdn.net/ailunlee/article/details/90600174
