HTTP 協(xié)議學(xué)習(xí)筆記(掃盲文)

作為一個前端,了解下 HTTP 協(xié)議是很有必要的蔗包。

先說個題外話魂挂,從《躍遷》一書中提到甫题,高手獲取信息的方式 —— 只獲取一手、二手資料涂召。
我在學(xué)習(xí) HTTP 協(xié)議的時候犯了的毛病是 —— 百度了一堆 HTTP 相關(guān)文章坠非,內(nèi)容不一、質(zhì)量參差不齊芹扭,看得云里霧里麻顶。最后干脆去Google查 HTTP赦抖,發(fā)現(xiàn)在 MDN 上有詳細的 HTTP 相關(guān)資料,于是拋棄三手辅肾、四手資料队萤,直接去看 MDN 上的內(nèi)容。
所以學(xué)習(xí)知識矫钓,必須得先認清資料的來源和專業(yè)程度要尔,在知識源頭學(xué)習(xí)可以提高學(xué)習(xí)的效率和準確性。

簡介

HTTP是一種能夠獲取如 HTML 這樣的網(wǎng)絡(luò)資源的 protocol(通訊協(xié)議)新娜。它是在 Web 上進行數(shù)據(jù)交換的基礎(chǔ)赵辕,是一種 client-server 協(xié)議,也就是說概龄,請求通常是由像瀏覽器這樣的接受方發(fā)起的还惠。一個完整的Web文檔通常是由不同的子文檔拼接而成的,像是文本私杜、布局描述蚕键、圖片、視頻衰粹、腳本等等锣光。

這里加上我個人的理解:HTTP 是一種在客戶端和服務(wù)端之間傳輸信息的傳輸協(xié)議,或者說是一整套傳輸方案铝耻。所以誊爹,像 Headers、Cookie瓢捉、Methods 等都是 HTTP 協(xié)議中的內(nèi)容频丘。用于更好的解決 client-server 傳輸信息中遇到的各種問題。

關(guān)于HTTP的更多歷史信息泊柬,可以看到阮一峰老師的HTTP 協(xié)議入門(阮一峰老師寫的文章還是那么清晰明了椎镣,向老師學(xué)習(xí)!)兽赁。

TCP/IP 三次握手

HTTP 的傳輸協(xié)議是 TCP/IP 協(xié)議,該協(xié)議連接是需要進行三次握手的冷守。
那么為什么必須是三次刀崖?

這個問題的本質(zhì)是:信道不可靠,但是通信雙發(fā)需要就某個問題達成一致拍摇。而要解決這個問題亮钦,無論你在消息中包含什么信息,三次通信是理論上的最小值充活。所以三次握手不是TCP本身的要求蜂莉,而是為了滿足"在不可靠信道上可靠地傳輸信息"這一需求所導(dǎo)致的蜡娶。

以下列出三次握手具體步驟與理解:

  • 客戶端發(fā)送 SYN 報文給服務(wù)器端,進入 SYN_SEND 狀態(tài)映穗。 —— 客戶端向服務(wù)器端發(fā)送消息窖张,請求它的回應(yīng)。
  • 服務(wù)器收到 SYN 報文蚁滋,回應(yīng)一個 SYN ACK 報文宿接,進入 SYN_RECV 狀態(tài)。 —— 服務(wù)器端收到消息辕录,采取回應(yīng)行為睦霎,回復(fù)消息告訴客戶端收到了。
  • 客戶端收到服務(wù)器 SYN 報文走诞,回應(yīng)一個 ACK 報文副女,進入連接狀態(tài)。 —— 客戶端收到消息蚣旱,這時客戶端收到響應(yīng)碑幅,表明發(fā)送的數(shù)據(jù)有回信了。但是服務(wù)器端發(fā)送了回應(yīng)卻還不知道客戶端有沒有收到姻锁。這時客戶端需要再次發(fā)送消息告訴服務(wù)器我收到了枕赵。服務(wù)器收到消息后,客戶端和服務(wù)器都知道對方已準備好通訊位隶,然后就開始連接通訊了拷窜。

HTTP 的請求(request)和響應(yīng)(response)

請求

請求為客戶端發(fā)送給服務(wù)器的數(shù)據(jù)。具體有如下數(shù)據(jù):

  • 請求方法:如 GET涧黄、 POST 這類請求方法篮昧。
  • 要獲取的資源路徑。
  • HTTP協(xié)議版本號笋妥。
  • Headers:傳遞附加信息懊昨。
  • body:如果想 POST 請求,就會傳遞 body 資源數(shù)據(jù)給服務(wù)器春宣。
Request

響應(yīng)

響應(yīng)為服務(wù)器收到客戶端發(fā)送數(shù)據(jù)返回的數(shù)據(jù)酵颁,具體有如下數(shù)據(jù):

  • HTTP協(xié)議版本號。
  • 狀態(tài)碼(status code):告知請求是否成功以及失敗原因月帝。
  • 狀態(tài)消息(status message):非權(quán)威狀態(tài)碼信息躏惋,由服務(wù)器自行設(shè)定。
  • Headers:傳遞附加信息嚷辅。
  • body: 響應(yīng)返回的資源存在body中簿姨。一般返回圖片、HTML等資源。
Response

Headers 頭文件

頭文件允許客戶端和服務(wù)器通過請求和響應(yīng)傳遞附加信息扁位。
下面列出一些常用的消息頭及其用法:

  • Date 信息來源的日期時間
  • Content-Type 指定服務(wù)器文檔的MIME類型准潭,幫助用戶代理去處理接收到的數(shù)據(jù)。
  • Content-Length 表示 body 的字節(jié)長度域仇。
  • Host 服務(wù)器的域名刑然。
  • User-Agent 可以用來識別發(fā)送請求的瀏覽器,是產(chǎn)品標(biāo)記符和注釋的清單殉簸。
  • Accept 用戶代理期望的MIME類型列表
  • Accept-Encoding 列出用戶代理支持的壓縮方法
  • Accept-Ranges 期望范圍闰集。參數(shù):byte、none般卑。
  • Assess-Control-Allow-Origin 允許組織連接控制 武鲁。
  • Age 對象在代理緩存中的時間
  • Cache-Control 指定緩存機制
  • Connection 是否保持網(wǎng)絡(luò)連接打開狀態(tài)。參數(shù):keep-alive蝠检、close沐鼠。
  • ETag 特定版本資源標(biāo)識符
  • Expires 過期時間日期
  • Server 服務(wù)器信息,如JSP叹谁、Apache等饲梭。
  • Referer 可用于識別用戶訪問位置

還有一些自定專用消息頭可通過 X- 前綴來添加。如 x-oss-object-type焰檩。

狀態(tài)碼

狀態(tài)碼是由服務(wù)器端發(fā)送的響應(yīng)中帶有的請求結(jié)果的信息碼憔涉。可以分為以下幾類:

  • 1** 信息響應(yīng)
  • 2** 成功響應(yīng)
  • 3** 重定向
  • 4** 客戶端響應(yīng)
  • 5** 服務(wù)器響應(yīng)

列一些常見的狀態(tài)返回碼:

  • 200 請求成功析苫。
  • 304 未修改兜叨。
  • 401 當(dāng)前請求需要用戶驗證。
  • 404 未找到資源衩侥。
  • 500 服務(wù)器內(nèi)部錯誤国旷,無法完成請求。

狀態(tài)碼其實只要了解常用的茫死,冷門的遇到的時候查查 MDN 就好了跪但。

Cookie

Cookie 是服務(wù)器發(fā)送到用戶瀏覽器并保存在本地的一小塊數(shù)據(jù),它會在瀏覽器下次向同一服務(wù)器發(fā)起請求時被懈怠并發(fā)送到服務(wù)器上峦萎。
HTTP 本質(zhì)上無狀態(tài)屡久,使用 Cookie 可以創(chuàng)建有狀態(tài)會話。服務(wù)器指定 Cookie 后爱榔,瀏覽器的每次請求都會攜帶 Cookie 數(shù)據(jù)涂身。所以,Cookie 常被用來驗證用戶登錄信息搓蚪。
更多 Cookie 內(nèi)容請看 https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Cookies

跨域

跨域就是獲取不同域名下服務(wù)器的數(shù)據(jù)《○模跨域?qū)τ?GET 請求沒有影響妒潭。對于其他請求悴能,會先發(fā)送一個 OPTIONS 方法發(fā)送一個預(yù)檢請求,獲知服務(wù)端是否允許跨域請求雳灾。
所以漠酿,之前遇到 POST 方法請求變?yōu)?OPTIONS 請求報錯的問題就是跨域問題。
在 Express 中也遇到個跨域問題谎亩,最終使用 $ npm install cors 的方式解決了炒嘲。

HTTPS

HTTP 和 HTTPS 的區(qū)別

因為 HTTP 所封裝的信息是明文的,通過抓包工具可以分析其信息內(nèi)容匈庭。所以 HTTP 是及其不安全的夫凸。
而 HTTPS 在 HTTP 傳輸協(xié)議的基礎(chǔ)上加上了 SSL/TLS 加密協(xié)議,所以傳輸?shù)男畔⒍际羌用苓^的阱持。不易被截獲信息內(nèi)容夭拌。所以 HTTPS 比 HTTP 安全性更高。

HTTPS 運行機制

大致運行步驟如下:

  1. 客戶端發(fā)起 HTTPS 請求
  2. 服務(wù)端獲取數(shù)字證書CA —— 服務(wù)器向數(shù)字證書認證機構(gòu)申請獲取數(shù)字證書 CA 表明服務(wù)器是合法的衷咽、無害的鸽扁。
  3. 傳送數(shù)字證書 —— 將數(shù)字證書傳給客戶端
  4. 客戶端解析證書 —— 客戶端向數(shù)字證書認證機構(gòu)查詢,驗證服務(wù)器合法性镶骗。
  5. 客戶端傳輸加密后信息給服務(wù)端
  6. 服務(wù)端解密信息
  7. 服務(wù)端傳輸加密后的信息給客戶端
  8. 客戶端解密信息

常見加密算法

非對稱加密算法:RSA桶现,DSA/DSS
對稱加密算法:AES,RC4鼎姊,3DES
HASH算法:MD5骡和,SHA1,SHA256

最后

發(fā)現(xiàn)網(wǎng)上寫 HTTP 協(xié)議的文章很多此蜈,但是眾口不一即横,每篇博客的內(nèi)容都有所不同,搜集資料的時候還是蠻困惑的裆赵。
本文整理了一些 HTTP 的基礎(chǔ)知識东囚,寫的不夠詳細。更加深入的學(xué)習(xí)通過查 MDN 來解決問題啦~

參考資料

更新內(nèi)容

本文只是 HTTP 的掃盲文,并沒有深入學(xué)習(xí) HTTP 的意思强法,其實深入學(xué)習(xí) HTTP 水還是很深的蟹肘。換位思考,我感覺面試官問 HTTP 相關(guān)問題的主要目的是:能夠很好與后端工程師溝通接口問題楣导;更好處理前端工作中網(wǎng)絡(luò)傳輸?shù)膯栴}废境;保證項目的信息安全;前端工程師作為客戶端方的開發(fā),也有必要和服務(wù)器端的后端工程師合作將程序開發(fā)的高效噩凹、安全巴元、易維護。
--03-19更新--
我去問了一位前輩前端為什么要學(xué)習(xí) HTTP 協(xié)議驮宴,大牛前輩的回答是這樣的:“就前端來講逮刨,兩個用處吧:前端性能優(yōu)化必須掌握,排障必須掌握

感覺這篇文章內(nèi)容實在少了點堵泽。所以又補充了點內(nèi)容修己,貼上幾條最靠譜的 HTTP 學(xué)習(xí)資料希望能夠幫到一些想深入學(xué)習(xí) HTTP 童鞋~

記住文章開頭所講的,只去源頭的知識學(xué)習(xí)才能保證學(xué)習(xí)的效率和準確性~祝我們能夠更快更好的學(xué)習(xí)技術(shù)知識迎罗。

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
  • 序言:七十年代末睬愤,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子佳谦,更是在濱河造成了極大的恐慌戴涝,老刑警劉巖,帶你破解...
    沈念sama閱讀 221,406評論 6 515
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件钻蔑,死亡現(xiàn)場離奇詭異啥刻,居然都是意外死亡,警方通過查閱死者的電腦和手機咪笑,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 94,395評論 3 398
  • 文/潘曉璐 我一進店門可帽,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人窗怒,你說我怎么就攤上這事映跟。” “怎么了扬虚?”我有些...
    開封第一講書人閱讀 167,815評論 0 360
  • 文/不壞的土叔 我叫張陵努隙,是天一觀的道長。 經(jīng)常有香客問我辜昵,道長荸镊,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 59,537評論 1 296
  • 正文 為了忘掉前任堪置,我火速辦了婚禮躬存,結(jié)果婚禮上,老公的妹妹穿的比我還像新娘舀锨。我一直安慰自己岭洲,他們只是感情好,可當(dāng)我...
    茶點故事閱讀 68,536評論 6 397
  • 文/花漫 我一把揭開白布坎匿。 她就那樣靜靜地躺著盾剩,像睡著了一般雷激。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上彪腔,一...
    開封第一講書人閱讀 52,184評論 1 308
  • 那天侥锦,我揣著相機與錄音,去河邊找鬼德挣。 笑死,一個胖子當(dāng)著我的面吹牛快毛,可吹牛的內(nèi)容都是我干的格嗅。 我是一名探鬼主播,決...
    沈念sama閱讀 40,776評論 3 421
  • 文/蒼蘭香墨 我猛地睜開眼唠帝,長吁一口氣:“原來是場噩夢啊……” “哼屯掖!你這毒婦竟也來了?” 一聲冷哼從身側(cè)響起襟衰,我...
    開封第一講書人閱讀 39,668評論 0 276
  • 序言:老撾萬榮一對情侶失蹤贴铜,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后瀑晒,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體绍坝,經(jīng)...
    沈念sama閱讀 46,212評論 1 319
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點故事閱讀 38,299評論 3 340
  • 正文 我和宋清朗相戀三年苔悦,在試婚紗的時候發(fā)現(xiàn)自己被綠了轩褐。 大學(xué)時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 40,438評論 1 352
  • 序言:一個原本活蹦亂跳的男人離奇死亡玖详,死狀恐怖把介,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情蟋座,我是刑警寧澤拗踢,帶...
    沈念sama閱讀 36,128評論 5 349
  • 正文 年R本政府宣布,位于F島的核電站向臀,受9級特大地震影響巢墅,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜飒硅,卻給世界環(huán)境...
    茶點故事閱讀 41,807評論 3 333
  • 文/蒙蒙 一砂缩、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧三娩,春花似錦庵芭、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,279評論 0 24
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽眨唬。三九已至,卻和暖如春好乐,著一層夾襖步出監(jiān)牢的瞬間匾竿,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,395評論 1 272
  • 我被黑心中介騙來泰國打工蔚万, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留岭妖,地道東北人。 一個月前我還...
    沈念sama閱讀 48,827評論 3 376
  • 正文 我出身青樓反璃,卻偏偏與公主長得像昵慌,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子淮蜈,可洞房花燭夜當(dāng)晚...
    茶點故事閱讀 45,446評論 2 359

推薦閱讀更多精彩內(nèi)容