HTTP協議學習太枯燥？那咱們看圖吧～

研究代表知識概念的圖形化，相較於文字描述更具備直觀性，有助於高效的學習及加深對知識概念的理解

http協議的文章太多了，光掘金就有"幾千篇"，更別說google了，也有不少優秀的文章，可是本文將盡量避免過多的使用文字，而是使用圖形或者表格來刻畫描述http及其相關生態圈概念，在這個快節奏的時代以便讓你們可以花最少的時間更加高效直觀的掌握http以及方便之後查閱，做圖做表不易，你的贊就是對做者的最大的鼓勵

閱讀本文你將收穫/瞭解：

• 系統的http/https知識體系
• http緩存機制
• 實踐開發中如何選擇緩存策略
• https及其工做機制
• 什麼是證書及證書的工做機制

http在TCP/IP模型中（發送請求發生了什麼）

TCP/IP模型

http知識網絡

http概念

報文

請求方式

請求方式	描述
GET	GET方法請求一個指定資源的表示形式. 使用GET的請求應該只被用於獲取數據.
HEAD	HEAD方法請求一個與GET請求的響應相同的響應，但沒有響應體（報文主體）,用於確認URI的有效性及資源更新的日期時間等.
POST	POST方法用於將實體提交到指定的資源，一般致使在服務器上的狀態變化或反作用.
PUT	PUT方法用請求有效載荷替換目標資源的全部當前表示, 因爲PUT自身不帶驗證機制，存在安全問題，通常不用，若配合web程序的驗證制或架構設計採用REST標準的同類web網站，可能會開放PUT方法
DELETE	DELETE方法刪除指定的資源，通常不用，緣由PUT
CONNECT	CONNECT方法創建一個到由目標資源標識的服務器的隧道.
OPTIONS	查詢針對指定請求URI指定的資源支持的方法
TRACE	TRACE方法配合Max-forwords沿着到目標資源的路徑執行一個消息環回測試，不經常使用（容易跨站追蹤攻擊）
LINK	創建和資源之間的聯繫(HTTP/1.1已棄用)
UNLINK	斷開鏈接關係(HTTP/1.1已棄用)

常見狀態碼

狀 態 碼	描述
1xx	Informational(信息性狀狀態碼)，接受的請求正在處理
2xx	Success(成功狀態碼)，請求正常處理完畢
200	OK:請求正常處理完畢，注意HEAD請求方法不返回報文主體
204	NO CONTENT:成功處理可是返回響應不含任何實體的主體；固然也不容許返回任何實體的主體，通常用於不須要對客戶端返回新內容對狀況
206	Partial Content:客戶端進行了範圍請求，而服務器成功執行了這部分GET請求，響應報文中包含由Content-Range指定範圍的實體內容
3xx	重定向
301	Moved Permanently:永久性重定向，請求的資源已經被分配新的URI,之後應使用該URI
302	Found:臨時性重定向，請求的資源已經被分配新的URI,但願本次應使用該URI
303	See Other:對應當前請求的響應能夠在另外一個 URI 上被找到，並且客戶端應當採用 GET 的方式訪問那個資源。與302區別是若是POST方式但願用戶能使用GET重定向，303狀態碼更加合適，雖然功能上是同樣的
304	Not Modified:客戶端發送帶有條件的請求時，服務器容許請求訪問資源，可是因發生請求未滿條件的狀況（便可直接shying客戶端未過時緩存）
307	Temporary Redirect:臨時性重定向，與302含義相同，儘管302標準禁止POST改成GET，可是實際你們並不遵照，307會遵照標準不會POST改成GET，可是對於處理響應的行爲，每種瀏覽器可能不同
4xx	客戶端錯誤
400	Bad Request：請求報文中存在語法錯誤
401	Unauthorized：當前請求須要用戶驗證，彈出認證用的對話窗口；若以前已經請求過一次，則表示用戶認證失敗，該響應必須包含一個適用於請求資源的 WWW-Authenticate 信息頭用以詢問用戶信息
403	Forbidden：服務器已經理解請求，可是拒絕執行它
404	Not Found：請求失敗，請求所但願獲得的資源未被在服務器上發現.也可用於當服務器不想揭示到底爲什麼請求被拒絕或者沒有其餘適合的響應用的狀況
405	Method Not Allowed：請求行中指定的請求方法不能被用於請求相應的資源。該響應必須返回一個Allow 頭信息用以表示出當前資源可以受的請求方法的列表
5xx	服務器錯誤
500	Internal Server Error：服務器在執行請求時發生了錯誤，也多是web應用存在bug或者臨時故障
502	Bad Gateway：此錯誤響應代表服務器做爲網關須要獲得一個處理這個請求的響應，可是獲得一個錯誤的響應。
503	Service Unavailable：服務器沒有準備好處理請求。 常見緣由是服務器因維護或超負載而停機
504	Gateway Timeout：當服務器做爲網關，不能及時獲得響應時返回此錯誤代碼

緩存機制

緩存控制相關字段

字段名稱	可能值舉例	緩存優先級	描述
Cache-Control	max-age=3600	高（強緩存）	再次請求3600s內均可以使用緩存
Expires	Sat, 10 Jan 2020 09:00:00 GMT	高（強緩存）	2020年1月10日9點以前再次請求均可以使用緩存
If-Modified-Since/Last-Modified	Sat, 10 Jan 2020 09:00:00 GMT	低	第一個時間>第二個(只能精確到秒)，返回304，反之，200，讀取服務器資源並返回實體結果
If-None-Match/ETag	123xx	中	若123xx!==ETag，則讀取資源並返回實體，反之304，注意:，ETag判斷資源是否修改的準確度雖然高於If-Modified-Since,但這是要犧牲服務器的資源的爲前提的，由於要根據算法生成ETag須要額外開銷服務器資源

注： 1.緩存控制字段同時存在時，會按照優先級由高到低進行控制緩存命中控制，在HTTP/1.0中，同時存在Cache-Control和Expires會忽略Cache-Control，在HTTP/1.1中，則會忽略Expires

Cache-Control指令

緩存請求指令

指令	參數	說明
no-cache	無	強制向源服務器再次驗證
no-store	無	不緩存請求或響應的任何內容
max-age = [ 秒]	必需	響應的最大Age值
max-stale( = [ 秒])	可省略	接收已過時的響應
min-fresh = [ 秒]	必需	指望在指定時間內的響應仍有效
no-transform	無	代理不可更改媒體類型
only-if-cached	無	從緩存獲取資源
cache-extension	-	新指令標記（token）

緩存響應指令

指令	參數	說明
public	無	可向任意方提供響應的緩存
private	可省略	僅向特定用戶返回響應
no-cache	可省略	緩存前必須先確認其有效性
no-store	無	不緩存請求或響應的任何內容
no-transform	無	代理不可更改媒體類型
must-revalidate	無	可緩存但必須再向源服務器進行確認
proxy-revalidate	無	要求中間緩存服務器對緩存的響應有效性再進行確認
max-age = [ 秒]	必需	響應的最大Age值
s-maxage = [ 秒]	必需	公共緩存服務器響應的最大Age值
cache-extension	-	新指令標記（token）

http緩存控制工做原理

http緩存控制工做流程

實踐中如何定製緩存策略

定製緩存策略

在使用強緩存時，當咱們設置了緩存有效時間以後，若是在有效時間靜態內資源被修改，可是咱們依然會使用緩存(老的)，顯然生成中這是不被容許的！在單頁面實踐中，在打包的時候webpack會經過hash的方式修改html引用的靜態資源文件名（否者靜態資源的URI沒變，依然會使用緩存），並將其嵌入html中生產新的html文件，因此咱們只須要設置請求html資源爲no-cache（即每次請求都會驗證緩存的有效性）就能夠保證即便緩存有效期內，被引用的靜態資源發生了修改，也能獲取到最新的改動

針對http的安全策略

https

https

https示意圖

https工做流程

https工做流程

證書機制

證書機制

關於數字簽名及其驗證

附錄

首部字段

首部字段名	說明
Cache-Control	控制緩存的行爲
Connection	逐跳首部、鏈接的管理
Date	建立報文的日期時間
Pragma	報文指令
Trailer	報文末端的首部一覽
Transfer-Encoding	指定報文主體的傳輸編碼方式
Upgrade	升級爲其餘協議
Via	代理服務器的相關信息
Warning	錯誤通知

請求首部字段

首部字段名	說明
Accept	用戶代理可處理的媒體類型
Accept-Charset	優先的字符集
Accept-Encoding	優先的內容編碼
Accept-Language	優先的語言（天然語言）
Authorization	Web認證信息
Expect	期待服務器的特定行爲
From	用戶的電子郵箱地址
Host	請求資源所在服務器
If-Match	比較實體標記（ETag）
If-Modified-Since	比較資源的更新時間
If-None-Match	比較實體標記（與 If-Match 相反）
If-Range	資源未更新時發送實體 Byte 的範圍請求
If-Unmodified-Since	比較資源的更新時間（與If-Modified-Since相反）
Max-Forwards	最大傳輸逐跳數
Proxy-Authorization	代理服務器要求客戶端的認證信息
Range	實體的字節範圍請求
Referer	對請求中 URI 的原始獲取方
TE	傳輸編碼的優先級
User-Agent	HTTP 客戶端程序的信息

響應首部字段

首部字段名	說明
Accept-Ranges	是否接受字節範圍請求
Age	推算資源建立通過時間
ETag	資源的匹配信息
Location	令客戶端重定向至指定URI
Proxy-Authenticate	代理服務器對客戶端的認證信息
Retry-After	對再次發起請求的時機要求
Server	HTTP服務器的安裝信息
Vary	代理服務器緩存的管理信息
WWW-Authenticate	服務器對客戶端的認證信息

實體首部字段

首部字段名	說明
Allow	資源可支持的HTTP方法
Content-Encoding	實體主體適用的編碼方式
Content-Language	實體主體的天然語言
Content-Length	實體主體的大小（單位：字節）
Content-Location	替代對應資源的URI
Content-MD5	實體主體的報文摘要
Content-Range	實體主體的位置範圍
Content-Type	實體主體的媒體類型
Expires	實體主體過時的日期時間
Last-Modified	資源的最後修改日期時間

創建TCP鏈接創建過程

TCP鏈接創建

常見應用層協議

協議簡稱	英文全稱	中文全稱	描述
SMTP	Simple Mail Transfer Protocol	簡單郵件傳輸協議	用於郵件發送的基於TCP的應用層協議
POP3	Post Office Protocol - Version 3	郵局協議版本3	用於郵件接收的基於TCP的應用層協議
DNS	Domain Name System	域名系統	用於解析域名與IP地址的基於UDP/TCP 應用層協議
DHCP	Dynamic Host Configuration Protocol	動態主機配置協議	用於主機動態獲取IP地址、缺省網關、DNS服務器等參數的基於UDP 應用層協議
CIFS	Common Internet File System	通用網絡文件系統	Windows 文件共享的基於TCP的應用層協議
NFS	Network File System	網絡文件系統	用於Unix / Linux 文件共享，基於UDP/TCP協議
NTP	Network Time Protocol	網絡時間協議	用於時鐘同步的基於UDP的應用層協議
SIP	Session Initiation Protocol	會話發起協議	IP電話信令協議，IETF協議標準，基於TCP/UDP應用層協議
H.323	-	-	IP電話信令協議，國際電信聯盟 ITU協議標準，基於TCP/UDP應用層協議
RTP	Real-time Transport Protocol	實時傳輸協議	用於IP多媒體電話的語音、文字、視頻等流體的傳輸，基於UDP的應用層協議

總結

http幾乎深透了咱們天天的開發實踐中，滲透到你對它的存在習覺得常而忽略它，，但它真的很重要，由於它是先後端通訊的橋樑，也是前端性能優化的一個點。HTTPS的使用雖然會增長企業的運營成本和影響用戶體驗，部分企業採用了http,可是安全性必然是互聯網發展的主旋律，GoogleI/O大會上也倡導HTTPSeverywhere,還有很重要的一點,HTTPS會做爲google搜索排名算法中的一個參考因素！(你們能夠google試下)國內的BAT等公司也大多采用了https。這塊知識難點很少，可是很散，若是你們看完這篇文章（圖），對http生態有個清晰或者深入的認識，個人目的就達到了～，本人水平有限，文章若有錯誤或者建議，還請指教

參考

• 圖解http
• developers.google.com/web/fundame…