</>小白学编程.dev
后端开发·7 分钟阅读·作者：小白学编程

HTTP 是什么？给前端 / 后端入门者的一次彻底搞懂

请求、响应、状态码、方法、头部、Cookie、HTTPS……一次性把 HTTP 协议讲清楚，附调试技巧。

#HTTP#网络#API#基础

一句话理解 HTTP

HTTP 就是一个"客户端向服务器讨东西的规则"。

每次你打开一个网页、点一个按钮、发一条消息，浏览器在背后都做了一件事：

客户端：嘿，服务器，我能要这个东西吗？      ← 请求 Request
服务器：可以，给你。或者：不行，404。       ← 响应 Response

理解了"请求 / 响应"这一对儿，HTTP 就理解了一半。

1. 一个请求长什么样？

打开浏览器 → F12 → Network 标签 → 刷新页面，随便点一条，你会看到类似这样的"裸体":

GET /posts/12 HTTP/1.1
Host: example.com
User-Agent: Mozilla/5.0 ...
Accept: text/html
Cookie: session=abc123

四个核心要素：

部分 例子 含义
方法 GET 我想干啥
路径 /posts/12 要哪个东西
协议版本 HTTP/1.1 用哪一版规则说话
头部 Host, Cookie 附带信息

2. 响应长什么样？

HTTP/1.1 200 OK
Content-Type: text/html; charset=utf-8
Content-Length: 1234
Set-Cookie: theme=dark

<!doctype html>
<html>...
部分 例子 含义
状态行 200 OK 这次请求结果如何
头部 Content-Type 元信息
空行 头和正文的分隔
正文 (body) HTML / JSON 真正的内容

3. 你必须背下来的 8 个状态码

1xx  接收了，但还没完
2xx  成功
3xx  你要的东西换地方了 / 没变化
4xx  你（客户端）有问题
5xx  我（服务器）有问题

具体最常用的：

状态码 含义 何时出现
200 OK 一切正常
201 Created 创建成功（POST 之后常返回这个）
204 No Content 成功但没内容（DELETE 后）
301 / 302 重定向 "搬家了"
304 Not Modified 浏览器缓存还能用
400 Bad Request 你发的数据格式不对
401 Unauthorized 没登录
403 Forbidden 登了但没权限
404 Not Found 资源不存在
500 Internal Error 后端崩了
502 / 504 网关错误 / 超时 后端挂了或太慢

记忆口诀：4 是你错，5 是我错。

4. 七个常用方法

方法 语义 幂等 典型用法
GET 获取 ✅ 拿数据
POST 创建 ❌ 新建资源（注册、下单）
PUT 整体替换 ✅ 整条数据全更新
PATCH 部分修改 ❌ 只改一个字段
DELETE 删除 ✅ 删数据
HEAD 只要 header ✅ 检查是否存在
OPTIONS 询问允许操作 ✅ CORS 预检

「幂等」= 同一请求执行 1 次和 N 次效果一样。

5. 请求头与响应头：HTTP 的"信封"

最常见的：

头 出现位置 作用
Content-Type 双向 告诉对方正文格式
Authorization 请求 携带令牌
Cookie / Set-Cookie 双向 维持会话
Cache-Control 双向 缓存策略
User-Agent 请求 客户端标识
Accept 请求 我能接受什么格式
Location 响应（3xx） 重定向去哪
Access-Control-Allow-Origin 响应 CORS 跨域

HTTP 是无状态的协议。但你登录之后浏览器为啥还能记得你？答案就是 Cookie：

1) 登录成功 → 服务器：Set-Cookie: session=xxx
2) 之后每个请求 → 浏览器自动带上：Cookie: session=xxx
3) 服务器看到 session=xxx → 查到对应用户 → 你"还在登录"

新手常踩坑：

  • ⚠️ Cookie 不会跨域（比如 a.com 的 cookie 不会发到 b.com）
  • ⚠️ HttpOnly Cookie 不能被 JS 读取（防 XSS）
  • ⚠️ SameSite=Lax/Strict 限制跨站请求时是否带 Cookie（防 CSRF）

7. HTTPS：加了把锁的 HTTP

HTTPS = HTTP + TLS。它解决三个问题：

  1. 加密：中间人看到的是乱码
  2. 完整性：内容被篡改会被发现
  3. 身份认证：你访问的 baidu.com 真的就是百度（靠证书）

在 2025 年，没有 HTTPS 的网站会被浏览器标"不安全"。新做的网站直接上 HTTPS，免费证书用 Let's Encrypt。

8. 调试技巧：浏览器 + curl

浏览器 Network 面板

按 F12 → Network → 刷新。每条请求都能看到：

  • 状态码
  • Request / Response Headers
  • Payload（发送的数据）
  • Response（返回的数据）
  • Timing（每个阶段耗时）

curl 万能调试

# 看响应头
curl -I https://example.com

# GET 详细调试
curl -v https://api.example.com/users/1

# POST JSON
curl -X POST https://api.example.com/users \
  -H "Content-Type: application/json" \
  -d '{"name":"Tom","age":18}'

# 带 token
curl https://api.example.com/me \
  -H "Authorization: Bearer YOUR_TOKEN"

9. RESTful：用 URL 表达资源

REST 是一套怎么设计 API 的约定，不是必须的，但是几乎所有现代 API 都遵守：

GET    /users          → 拿所有用户
POST   /users          → 新建用户
GET    /users/12       → 拿 id=12 的用户
PATCH  /users/12       → 更新 id=12 的用户
DELETE /users/12       → 删除 id=12 的用户

要点：

  • URL 用名词（资源），别用动词
  • 动词用 HTTP 方法表达
  • 版本号写在前面：/api/v1/users

10. 五个新手最常踩的坑

  1. 以为 GET 不能带 body → 标准上没禁止，但很多代理/服务会丢弃，建议别带。
  2. 不知道 OPTIONS 哪来的 → 跨域时浏览器会先发预检。
  3. GET 带敏感信息 → URL 会被记录到日志、历史、Referer 头。用 POST + body。
  4. 不设 Cache-Control → 静态资源永远不缓存，性能极差。
  5. 422 / 400 不分 → 一般 400 是格式错；422 是格式对但语义错（如必填字段空）。

学完这篇，你能干什么？

  • 看 Network 面板不再害怕
  • 自己用 curl 调 API
  • 写后端时给前端一个"清晰、可预测"的接口
  • 看懂 95% 网络相关 bug 的成因

「图难于其易，为大于其细。」 HTTP 看似简单，正是无数 Web 大事的"细"之根本。把它学透，受益十年。