01 Web通信
這個部分重點介紹瀏覽器與Web服務器的詳細通信過程。
01-00 URL協議
只要上網訪問服務器，就離不開URL。
URL是什么？
URL就是我們在瀏覽器里輸入的站點鏈接。又叫做“統一資源定位符”（Uniform Resource Locator)。
URL支持很多協議，比如HTTP、FTP等等。
PS：HTTP和URL有何區別？
答：（來源(https://www.jianshu.com/p/4fb712c05b63)
HTTP：（Hypertext transfer protocol）超文本傳輸協議，是用於從萬維網（WWW:World Wide Web）服務器傳輸超文本到本地瀏覽器的傳送協議。
URL：（Uniform Resource Locator）統一資源定位符，對可以從互聯網上得到的資源的位置和訪問方法的一種簡潔的表示，是互聯網上標准資源的地址。
URL的作用就是定位服務器的資源。
那如何才能定位到網站（服務器）的資源呢？
我們來設想一下：我們在網上購買的東西是如何寄到我們手上的呢？
我們提供了我們的收貨地址。
在Web的世界中，URL就充當了收貨地址的角色。
瀏覽器通過URL，可以定位到服務器的資源，然后將服務器的資源展示給我們。
這個“收貨地址”有一定的格式：
schema://host[:port#]/path/.../[?query-string] [#anchor]
schema:底層協議如http、https、ftp等；
host:服務器的域名或者IP地址；
:port# : 服務器端口，HTTP默認端口是80(可以省略)，其他端口需要指明；
/path: 訪問資源的路徑；
?query-string: 發送給服務器的數據；
#anchor: 錨；通常表示在頁面的特定位置。
URL實例
例如這個URL:http://dun.163.com/sj/test/test.jsp?name=sviergn&x=true#stuff
逐一解析：
schema：http協議；
dun.163.com；沒有指明端口，默認80
/path：/sj/test/test.jsp，訪問資源的路徑；
?query-string：?name=sviergn&x=true；
anchor：
這一部分需要常憶常用。
01-01 HTTP協議
HTTP就是Web通信時使用的協議，也是Web建立的基礎；是網絡上應用最廣的一種協議。
什么是HTTP？
HTTP又稱超文本傳輸協議；英文名：Hyper Text Transfer Protocol;
為了了解這一協議的過程，我們拿快遞小哥的工作打比方：
-
-
如果要讓快遞小哥送進小區里面，我們就需要告訴物業准許他進入，相當於給他頒了個通行證；
-
HTTP協議類似。
-
-
快遞小哥通過貨車送貨：瀏覽器通過Get方式發送請求。
-
HTTP中的Host就相當於“收件人地址”；
-
User-Agent就相當於快遞小哥所處的公司；
-
HTTP包含的Cookie就相當於能夠進入我們小區的憑證。
-
可以看到HTTP協議的請求和響應包含了一些特殊的屬性，包含方式、User-Agent、Host、返回的狀態碼等等；
上面這些都屬於HTTP的報文。
什么是HTTP的報文？
分為三部分：起始行、頭、身體
左邊，是瀏覽器發送的HTTP請求報文，右邊是服務器返回的HTTP請求報文；
-
左側
-
第一行：請求行Request Line
-
之后：是我們的頭部Headers；
-
下面：應該是我們的數據體，但由於是GET請求，沒有數據體
-
注意頭部和數據體之間是有一個空行的。
-
-
右側
-
第一行：狀態行；
-
比如：HTTP/1.1 200 OK
-
-
頭部
-
主體：也就是響應的正文
-
注意響應的頭部和主題之間也是有一行空行的。
-
HTTP請求示例
比如一個發帖的HTTP請求
當我們進行發帖的時候，我們的請求報文和響應報文如下：
-
請求
-
第一行：請求行
-
這里是POST
-
-
Headers
-
相較於上面，多了一個Cookie字段，就是前面提到的用戶憑證，相當於告訴服務器，是我發的這個帖子。
-
黑客就比較喜歡獲取這個Cookie憑證，如果獲取，就擁有了“我”的憑證，可以以“我”的身份發帖。
-
后面會接觸一些這方面的安全漏洞。
-
-
也有了數據體
-
就是要發布的帖子的相關內容
-
-
HTTP請求的其他方法
-
HEAD
-
與GET請求類似，不同是只返回HTTP的頭部信息，沒有數據體，也就沒有頁面內容。
-
-
PUT
-
上傳指定的URL描述
-
-
DELETE
-
刪除指定資源
-
-
OPTIONS
-
返回服務器支持的HTTP方法
-
01-02 HTTP頭的Referer
這是除了HTTP請求方式和Cookie的概念外，另一個重要概念。
Referer就是告訴服務器，我們從什么地方來（即告訴物業我們是哪個快遞公司的）；
舉例：
我們通過https://m.study.163.com/直接跳轉到頁面。和從bing主頁搜索雲課堂再進入，開發者工具中顯示的HTTP請求是不同的，后者會多一個Referer頭，表示是從bing的這個鏈接來的。
如圖；圖一是直接跳轉；圖二是搜索跳轉；
直接跳轉Rerfer
搜索跳轉的Rerfer與之不同。
所以由於Referer可以告訴服務器該次請求的來源，所以很多Web服務器會通過Referer來進行統計（比如CNZZ、百度統計）
從安全的角度來講，Referer還可以用來判斷來源是否合法。
（比如：
-
防止盜鏈
-
比如一些網站不想被盜用內容或惡意引用，就會通過Referer限制來者
-
-
防止CSRF漏洞
-
（暫不了解
-
01-03 HTTP狀態碼
302 --跳轉
比如：在響應報文的狀態行（第一行）
HTTP/1.1 302 Moved Temporarily在跳轉同時，還會在響應報文的Headers部分有一個Location字段，是跳轉到的URL地址，也就是這個響應報文告訴我們，我們需要跳轉到Location中的URL地址。
除了這兩處，還會有Set-Cookie字段，作用是Web服務器向我們的瀏覽器頒發憑證，比如我們通過用戶名密碼登錄成功后，Web服務器通常就會給我們頒發一個憑證。
類似的是301。
除此之外，還包括10x，20x，30x，40x，50x；每個狀態碼都代表不同的意思。
| 分類 | 分類描述 |
|---|---|
| 10x | 信息，服務器收到請求，需要請求者繼續執行操作 |
| 20x | 成功，操作被成功接收並處理 |
| 30x | 重定向，需要進一步的操作以完成請求 |
| 40x | 客戶端錯誤，請求包含語法錯誤或無法完成請求 |
| 50x | 服務器錯誤，服務器在處理請求的過程中發生了錯誤 |
具體的狀態碼可以到后面再學習，或用到查看。
01-04 實例演示
我們打開Edge瀏覽器，輸入https://www.cnblogs.com/Roboduster
我們用F12打開開發者工具，進入“網絡”，刷新一下，查看“文檔”，選中head頭，可以看到有請求頭、響應頭，點擊就可以看源碼，有一些是上面講過的，還有些字段是不熟悉的。這些字段可以自行查閱。
除了HEADER外，我們可以看一看響應的具體內容，在左側的“響應”中；Cookie中有請求的Cookie等等。