Skip to content

HTTP 協议:前後端的"通信語言"

🎯 核心問题

HTTP 是如何工作的? 這就像問:兩个人如何對话?需要约定語言、語法、對话規则。HTTP 就是前後端之間的"對话協议"。


0. HTTP 的本质

HTTP(HyperText Transfer Protocol,超文本傳輸協议)是前後端通信的基础協议。

0.1 用對话來類比

對话要素HTTP 對應說明
語言HTTP 協议雙方都能理解的語言
語法請求/響應格式怎么"說话"
流程請求-響應模式一問一答
結束挂断TCP 連接關閉

1. HTTP 的發展歷程

HTTP 從 1991 年诞生至今,經歷了多次重大升级。

🌐HTTP Protocol Demo
📤HTTP request
GET/api/users/123HTTP/1.1
Host:api.example.com
User-Agent:Mozilla/5.0
Accept:application/json
Authorization:Bearer xxx
TCP connection
📥HTTP response
HTTP/1.1200OK
Content-Type:application/json
Content-Length:156
Cache-Control:max-age=3600
{ "id": 123, "name": "Alice", "email": "alice@example.com" }

1.1 版本對比

版本年份核心改進典型特征
HTTP/0.91991僅支持 GET纯文本,只有請求,无響應頭
HTTP/1.01996增加 POST/HEAD每个請求一个 TCP 連接
HTTP/1.11997持久連接Keep-Alive,一个連接多个請求
HTTP/22015多路複用二進制帧,頭部压缩
HTTP/32022基于 QUICUDP 傳輸,解决队頭阻塞

💡 為什么需要 HTTP/2?

HTTP/1.1 虽然支持持久連接,但請求必须串行發送(前一个請求的響應返回後,才能發送下一个請求)。HTTP/2 通過多路複用解决了這个問题,可以同時發送多个請求。


2. HTTP 請求的結構

2.1 請求行

http
GET /api/users/123 HTTP/1.1

包含三个部分:

  • 方法:GET、POST、PUT、DELETE 等
  • URL:請求的资源路径
  • 版本:HTTP/1.1 或 HTTP/2

2.2 請求頭

http
Host: api.example.com
User-Agent: Mozilla/5.0
Accept: application/json
Authorization: Bearer xxx
Content-Type: application/json
Content-Length: 45

常见請求頭:

頭部說明示例
Host服務器域名api.example.com
User-Agent客户端信息Mozilla/5.0
Accept接受的響應類型application/json
Authorization認證信息Bearer token
Content-Type請求體類型application/json

2.3 請求體

json
{
  "name": "张三",
  "email": "zhangsan@example.com"
}

只有 POST、PUT、PATCH 等方法才有請求體。


3. HTTP 響應的結構

3.1 狀態行

http
HTTP/1.1 200 OK

包含三个部分:

  • 版本:HTTP/1.1
  • 狀態碼:200、404、500 等
  • 狀態文本:OK、Not Found 等

3.2 響應頭

http
Content-Type: application/json
Content-Length: 156
Cache-Control: max-age=3600
Set-Cookie: session=xxx; HttpOnly

常见響應頭:

頭部說明示例
Content-Type響應體類型application/json
Content-Length響應體大小156
Cache-Control緩存策略max-age=3600
Set-Cookie設置 Cookiesession=xxx

3.3 響應體

json
{
  "code": 0,
  "data": {
    "id": 123,
    "name": "张三"
  }
}

4. HTTP 方法詳解

方法用途請求體幂等性安全性
GET獲取资源
POST創建资源
PUT全量更新
PATCH部分更新
DELETE删除资源
HEAD獲取頭部
OPTIONS查询支持的方法

4.1 GET vs POST

特性GETPOST
參數位置URL 查询參數請求體
緩存可緩存默認不緩存
書簽可添加為書簽不可
歷史記錄保存在浏览器歷史不保存
數據長度有限制(URL 長度)无限制
安全性參數可见在 URL參數在請求體中

💡 何時使用 GET/POST?

  • GET:查询、獲取數據
  • POST:創建、提交數據
  • PUT:全量更新(替换整个资源)
  • PATCH:部分更新(只修改指定字段)
  • DELETE:删除资源

5. HTTP 狀態碼

5.1 狀態碼分類

分類說明典型狀態碼
2xx成功200 OK、201 Created、204 No Content
3xx重定向301 永久、302 臨時、304 未修改
4xx客户端錯误400 參數錯误、401 未認證、404 不存在
5xx服務端錯误500 內部錯误、503 不可用

5.2 常用狀態碼

狀態碼說明使用場景
200 OK請求成功GET、PUT 請求成功
201 Created創建成功POST 創建资源成功
204 No Content无內容DELETE 删除成功
301 Moved Permanently永久重定向URL 永久變更
302 Found臨時重定向URL 臨時變更
304 Not Modified未修改緩存有效
400 Bad Request參數錯误請求參數格式錯误
401 Unauthorized未認證需要登錄
403 Forbidden无權限已登錄但權限不足
404 Not Found不存在资源不存在
500 Internal Server Error內部錯误服務器异常
503 Service Unavailable不可用服務器維護或過載

6. HTTPS:安全的 HTTP

6.1 HTTP vs HTTPS

特性HTTPHTTPS
協议TCPTCP + SSL/TLS
端口80443
數據明文傳輸加密傳輸
證書不需要需要 SSL 證書
性能略快略慢(握手開銷)
SEO无影響搜索引擎優先收錄

6.2 HTTPS 的工作流程

  1. Client Hello:客户端發送支持的加密套件
  2. Server Hello:服務器返回證書和選定的加密套件
  3. 验證證書:客户端验證服務器證書的有效性
  4. 密鑰交换:使用非對称加密交换會话密鑰
  5. 加密通信:使用會话密鑰進行對称加密通信

💡 HTTPS 的優勢

  • 防窃听:數據加密,第三方无法讀取
  • 防篡改:數據完整性校验
  • 防冒充:SSL 證書验證服務器身份

7. HTTP 緩存機制

7.1 緩存頭

頭部說明示例
Cache-Control緩存策略max-age=3600
ETag资源版本号"33a64df551425fcc"
Last-Modified最後修改時間Wed, 21 Oct 2015 07:28:00 GMT

7.2 緩存策略

強緩存

http
Cache-Control: max-age=3600

在 3600 秒內,浏览器直接使用緩存,不發送請求。

協商緩存

http
ETag: "33a64df551425fcc"

浏览器發送 If-None-Match,服務器返回 304(未修改)或 200(已修改)。


8. 常见問题

8.1 GET 和 POST 的本质區別

误區:GET 和 POST 的區別只是參數位置不同。

真相

  • GET 是幂等的,多次請求結果相同
  • POST 是非幂等的,多次請求可能創建多个资源
  • GET 可被緩存,POST 默認不緩存
  • GET 可被書簽保存,POST 不可

8.2 HTTP/1.1 的队頭阻塞

問题:HTTP/1.1 虽然支持持久連接,但請求必须串行發送。前一个請求響應慢,後續請求都要等待。

解决方案

  • HTTP/2 多路複用
  • 域名分片(多个域名建立多个連接)
  • 連接池(限制并發數)

8.3 HTTP/2 的優勢

特性HTTP/1.1HTTP/2
傳輸格式文本二進制帧
多路複用不支持支持
頭部压缩HPACK 算法
服務器推送不支持支持

名词速查表

名词英文解釋
HTTPHyperText Transfer Protocol超文本傳輸協议
HTTPSHTTP SecureHTTP + SSL/TLS
TCPTransmission Control Protocol傳輸控制協议
SSL/TLSSecure Sockets Layer安全套接層
幂等性Idempotent多次請求結果相同
持久連接Keep-Alive一个 TCP 連接發送多个請求
多路複用Multiplexing同時發送多个請求
队頭阻塞Head-of-Line Blocking前面的請求阻塞後面的請求