此文章講解 http 的大綱, 這是一個(gè)關(guān)于 http 的系列文章, 有興趣完整了解相關(guān)內(nèi)容的可以點(diǎn)個(gè)關(guān)注或者點(diǎn)個(gè)關(guān)注, 以防找不到此系列文章 。

廢話不多說, 直接上代碼以及圖例(為了讓大家方便閱讀, 都有自己驗(yàn)證過程的一些圖片作為分享) 。

一: 前后端對(duì) http 的簡(jiǎn)單掌握:

1. 后臺(tái)開發(fā)者(http的認(rèn)知):1. http method? ( 請(qǐng)求的方式 )2. http status code? ( http請(qǐng)求狀態(tài)碼 )2. 前端開發(fā)者(http緩存的認(rèn)知):1. http 緩存 ?2. 客戶端 緩存 ?3. 代理服務(wù)器 緩存 ?4. 緩存 驗(yàn)證可用性 ?3. 總結(jié) IT 工程師為什么對(duì) http 不了解的緣由:1. http 協(xié)議作為 web 開發(fā)中最基礎(chǔ)的內(nèi)容, 所有與 web 開發(fā)相關(guān), 數(shù)據(jù)傳輸/內(nèi)容傳輸 都是要通過 http 協(xié)議的 。2. 現(xiàn)在 web 開發(fā)的同學(xué)在入門的時(shí)候很難有機(jī)會(huì), 有人告訴我們要先從 http 協(xié)議開始學(xué)習(xí) 。3. 先從 http 協(xié)議開始學(xué)習(xí), 對(duì)于沒有計(jì)算機(jī)基礎(chǔ)的同學(xué)也很難去學(xué)習(xí) 。4. 我們?nèi)腴T的時(shí)候都是直接上手 直接去做 頁面 / demo / 框架 。5. 對(duì)于后端更是直接上手 框架 。

圖片示例:

---

二: http 對(duì)于開發(fā)者是很重要的原因:

1. 前端所有的 靜態(tài)資源加載/數(shù)據(jù)加載 都是需要 http 協(xié)議進(jìn)行發(fā)送的 。2. 后端開發(fā)者所做的服務(wù), 提供的內(nèi)容與數(shù)據(jù)丟給 web、app 客戶端也是需要通過 http 去發(fā)送的 。3. 瀏覽器與服務(wù)器如何進(jìn)行交互, 有哪些內(nèi)容可以影響到數(shù)據(jù)加載的速度或者傳輸效率, 我需要了解它的實(shí)現(xiàn)邏輯是離不開 http 的 。

---

三: http 常見簡(jiǎn)單示例:

1. 輸入 URL 打開網(wǎng)頁, 請(qǐng)求網(wǎng)頁內(nèi)容, 然后展示給用戶 。2. 通過 Ajax 獲取數(shù)據(jù) (數(shù)據(jù)格式可以為: JSON / XML / 字符串)。3. img 標(biāo)簽加載圖片 - src / script - src / link - src 。

---

四: http 緩存簡(jiǎn)單介紹:

1. 設(shè)置緩存: Cache-Control1. Cache-Control : max-age=100 -> 對(duì)應(yīng)的靜態(tài)資源緩存 100 秒 。2. 給 Cache-Control 設(shè)置 public / private 來控制它只能在客戶端進(jìn)行緩存, 還是可以通過代理服務(wù)器進(jìn)行緩存 。3. 給 Cache-Control 設(shè)置 must-revalidate 讓緩存過期之后必須要到服務(wù)端驗(yàn)證過之后, 才能繼續(xù)使用緩存 。4. no-cache / no-store 控制是否使用緩存 。2. 緩存的驗(yàn)證:1. 因?yàn)榫彺媸谴嬖诳蛻舳说?span id="ze8trgl8bvbq" class="token punctuation">, 客戶端并不知道服務(wù)器是否有改變緩存的這部分?jǐn)?shù)據(jù), 那么我們的緩存就有必要進(jìn)行一個(gè)驗(yàn)證 。2. 我們可以通過 last-modified 配合 if-modified-since 來進(jìn)行驗(yàn)證 。3. 我們可以通過 etag 配合 if-none-match 來進(jìn)行驗(yàn)證 。3. 緩存是對(duì) web 服務(wù)性能, 提升最大的一環(huán) 。

圖片示例:

---

五: http 更多的實(shí)際使用:

1. http 頭的作用:1. Content-Type / Content-Encoding 等來約束數(shù)據(jù)的類型 。2. cookie 用來保持會(huì)話信息(session 方案就是通過 cookie 來實(shí)現(xiàn)的) 。3. CORS 實(shí)現(xiàn)跨域, 并保持安全性限制 。1. 如果我們的跨域服務(wù)對(duì)所有人進(jìn)行開放, 那么每個(gè)人都可以進(jìn)行訪問, 這樣就無法保證我們的服務(wù)是安全的 。

---

六: TCP (http 原理)簡(jiǎn)單介紹:

1. TCP 的三次握手 。2. HTTPS 創(chuàng)建連接的過程, 以及為什么 HTTPS 就是安全的 。3. 什么是長(zhǎng)連接, 以及為什么需要長(zhǎng)連接 。4. HTTP2 的 信道復(fù)用 又為什么能夠提高性能 。

---

七: 瀏覽器輸入 url 之后, “http” 請(qǐng)求返回 的完整過程:

從我們打開瀏覽器, 輸入 url 之后, 整個(gè)有關(guān)數(shù)據(jù)加載的過程所會(huì)經(jīng)歷的每個(gè)時(shí)間點(diǎn):1. Redirect (重定向): 為什么 Redirect? 因?yàn)闉g覽器可能記錄我們輸入的 url, 已經(jīng)永久跳轉(zhuǎn)成一個(gè)新的地址了, 所以一開始瀏覽器就需要判斷是否需要 Redirect, 以及 Redirect 到哪里 。2. App cache (應(yīng)用程序緩存): 查看緩存, 因?yàn)槲覀冋?qǐng)求的資源可能已經(jīng)緩存過了, 所以我們要去 App cache 中查看緩存數(shù)據(jù)否已經(jīng)存在; 如果沒有緩存, 就要去實(shí)際的服務(wù)器去請(qǐng)求資源 。3. DNS: 因?yàn)槲覀冚斎氲氖怯蛎?span id="ze8trgl8bvbq" class="token punctuation">, 要對(duì)應(yīng)成 IP 之后才能真正的訪問到服務(wù)器, 所以這個(gè)時(shí)候要先去把域名解析為對(duì)應(yīng)的 IP 地址, 這個(gè)叫做 DNS 解析 。4. TCP: 有了 IP 之后, 我們就要去創(chuàng)建 TCP 鏈接, 創(chuàng)建 TCP 鏈接要經(jīng)過 3 次握手之后才能真正的把鏈接創(chuàng)建起來; 同時(shí), 如果我們這個(gè)請(qǐng)求是 https 的, 要?jiǎng)?chuàng)建一個(gè) https 的鏈接, 它和 TCP 的 3 次握手又不一樣; 因?yàn)樗虚g要有一個(gè)保證安全的數(shù)據(jù)傳輸?shù)倪^程 。5. request(請(qǐng)求): 在鏈接創(chuàng)建好了之后, 才真正發(fā)送 http 請(qǐng)求的數(shù)據(jù)包 。6. Response(響應(yīng)): 我們?cè)谡?qǐng)求的數(shù)據(jù)包發(fā)送完成之后, 服務(wù)器接受到這個(gè)數(shù)據(jù), 進(jìn)行一個(gè)數(shù)據(jù)處理之后返回這個(gè)請(qǐng)求想要的內(nèi)容, 那么它就開始返回?cái)?shù)據(jù), 返回?cái)?shù)據(jù)之后這個(gè) http 請(qǐng)求才真正的完成 。

圖片示例:

---

之前有整理過部分知識(shí)點(diǎn), 現(xiàn)在將整理的相關(guān)內(nèi)容, 驗(yàn)證之后慢慢分享給大家; 這個(gè)專題 就是 “HTTP協(xié)議原理與實(shí)踐代碼” 的相關(guān)專欄; 不積跬步，無以至千里, 戒焦戒躁 。

如果對(duì)你有所幫助，喜歡的可以點(diǎn)個(gè)關(guān)注, 必然回訪; 文章還一直持續(xù)打磨 。

有什么想要了解的前端知識(shí)嗎? 可以評(píng)論區(qū)留言, 會(huì)及時(shí)跟進(jìn)分享所提內(nèi)容 。

整理知識(shí)點(diǎn)不易, 每次都是在工作繁忙之余夜深人靜之時(shí)整理, 無論知識(shí)點(diǎn)是大是小, 都會(huì)驗(yàn)證后再分享, 以防自己發(fā)表的文章給大家造成誤導(dǎo) 。如有問題還望不吝賜教，本人會(huì)及時(shí)更改 (本文原創(chuàng), 如需轉(zhuǎn)載，請(qǐng)注明出處) 。

HTTP協(xié)議原理下篇文章: HTTP協(xié)議相關(guān)的網(wǎng)絡(luò)經(jīng)典五層模型

總結(jié)

以上是生活随笔為你收集整理的HTTP协议原理与代码实践之大纲的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。