后端

HTTP

你可能会说

我就想知道，点一下按钮，浏览器和服务器之间到底发生了什么。

浏览器或 App 向服务器提出请求、再接收结果时遵守的通信规则例如，用户在资料页修改昵称并点击保存后，页面会通过 HTTP 发出请求，服务器再返回成功、失败和具体内容。开发者可以在浏览器的 Network 面板里看到这次通信。

也常被叫作HTTP 请求超文本传输协议

GET —— 获取资源
GET /api/components HTTP/1.1
Host: api.vibeui.dev

POST —— 交数据
POST /api/login HTTP/1.1
Content-Type: application/json{ "email": "you@example.com", "pwd": "••••••" }

组成结构 · Anatomy

POST /api/login HTTP/1.1
Host: api.vibeui.dev
Content-Type: application/json{ "email": "you@example.com", "pwd": "••••••" }

这封信想干嘛：GET 拿、POST 交、PUT 改、DELETE 删

寄给谁，见 URL；路径加参数

信封上的附加说明：内容类型、身份凭证、来源

可选的数据载体，常见于 POST、PUT、PATCH 等请求；内容格式由 Content-Type 和接口约定决定

常见变体 · Variants

GETGET

GET /api/list?page=1

获取资源，并按接口约定在 URL 中传查询参数

POSTPOST

POST /api/login

交数据，内容放在请求体里

PUT / PATCHPUT & PATCH

PUT /api/items/42

更新已有数据，覆盖或局部改

DELETEDELETE

DELETE /api/items/7

删除数据时用，请慎重

典型使用场景

地址栏回车发 GET

🔒 vibeui.dev/components ⏎

Network · 1 个请求

components GET 200 document

登录表单发 POST

点击瞬间 → POST /api/login

Network 面板看请求

Network Fetch/XHR

list?page=1GET20064 ms

savePOST200120 ms

items/42PUT20098 ms

items/7DELETE20475 ms

curl 手动发请求

$ curl -X POST https://api.vibeui.dev/login \
  -H "Content-Type: application/json" \
  -d '{"email":"you@example.com","pwd":"123456"}'
{ "token": "eyJhbGciOi…" }
# 方法 -X、头 -H、体 -d，一封信的三要素

快速判断

HTTP 和 HTTPS 有什么区别？

公开网站和线上服务应使用 HTTPS。它仍按 HTTP 规则传递请求与响应，只是在传输时增加了 TLS 保护。

对比维度	HTTP	HTTPS
是什么	浏览器与服务器之间收发请求和响应的通信规则	在 HTTP 基础上增加 TLS 加密与身份验证保护
传输途中	内容以明文传输，途经的网络设备可能读取或篡改	内容会被加密，并能发现传输途中是否遭到篡改
适用场景	本地开发与离线调试（如 http://localhost）	公开网站、用户登录、支付交互与生产 API