HTTP：每个 Web 开发人员必须掌握的协议

您是否正在构建 Web 应用程序，但正在为 API 集成而苦苦挣扎？了解 HTTP 是现代 Web 开发的基础，但它经常被忽视。本指南将把您从一个随意的 API 用户转变为一个自信的 HTTP 专家。

你将学到什么

• 通过实用的、可用于生产的代码示例掌握 HTTP 方法
• 使用行业最佳实践实施安全、可扩展的 API 端点
• 使用专业的故障排除技术调试常见的 HTTP 问题
• 通过适当的缓存和优化构建高性能应用程序

本指南适合谁

• 使用 API 的 Web 开发人员
• 构建 RESTful 服务的后端工程师
• 处理 HTTP 请求的前端开发人员
• 管理 Web 服务的 DevOps 工程师

目录

1. 为什么 HTTP 对于 Web 开发很重要

   • 对性能的影响
   • 安全考虑
   • 专业发展

2. 先决条件

   • 技术要求
   • 所需知识
   • 开发环境

3. 核心概念

   • HTTP 协议基础知识
   • 请求/响应周期
   • 标题和正文
   • 身份验证

4. HTTP 方法深入探究
   

   • 概念
   • 实施

5. 高级主题

• 缓存策略

• 错误处理模式

• 速率限制

• CORS 配置

1. 实际练习

• 构建 RESTful API

• 实施身份验证

• 处理文件上传

• 性能优化

1. 更多资源

• 推荐工具

• 补充阅读

• 社区资源

为什么 HTTP 对于 Web 开发很重要

每个 Web 交互都依赖 HTTP 作为其基础。了解 HTTP 不仅仅是进行 API 调用，还涉及构建健壮、安全且高性能的可扩展 Web 应用程序。
HTTP（超文本传输​​协议）构成了网络通信的支柱。本指南通过实际例子探索其核心方法。

对性能的影响

• 缓存策略：正确的 HTTP 实现可以实现有效的缓存，减少服务器负载并缩短响应时间

• 连接管理：了解 HTTP/2 和保持活动连接有助于优化网络资源使用

• 负载优化：正确使用 HTTP 方法和标头可以最大限度地减少不必要的数据传输

• 负载平衡：HTTP 知识可以更好地跨服务器分配流量

安全考虑

• 身份验证机制： HTTP 提供了各种身份验证方案（Basic、Bearer、OAuth）

• CORS 安全性：了解跨源资源共享可防止未经授权的访问

• 数据保护： HTTPS 加密可保护传输中的敏感信息

• 输入验证：正确的请求验证可以防止注入攻击和数据泄露

专业发展

• API 设计： HTTP 专业知识支持创建直观的 RESTful API

• 调试技巧：了解HTTP有助于快速识别和解决通信问题

• 系统架构： HTTP 知识影响架构决策

• 团队协作：共同的 HTTP 理解可以提高开发人员的沟通

核心概念

HTTP 协议基础知识

• 无状态协议：每个请求/响应周期都是独立的

• 客户端-服务器模型：前端和后端之间的关注点清晰分离

• 基于资源： URL 识别和定位资源

• 基于方法：不同操作的不同方法（动词）

请求/响应周期

1. 客户发起请求

• 方法（GET、POST 等）

• 网址

• 标题

• 正文（如果适用）

1. 服务器处理请求

• 验证请求

• 执行操作

• 准备回复

1. 服务器发送响应

• 状态代码

• 标题

• 正文（如果适用）

标头和正文

通用标头

Authorization: Bearer token123
Content-Type: application/json
Accept: application/json
Cache-Control: no-cache

车身结构

{
  "request": {
    "data": "Example request payload"
  },
  "response": {
    "data": "Example response payload"
  }
}

验证

• 类型：
• 基本身份验证
• 基于令牌（JWT）
• OAuth 2.0

• API 密钥

• 实施：
  

// Middleware example
const authenticate = async (req, res, next) => {
  const token = req.headers.authorization?.split(' ')[1];
  if (!token) {
    return res.status(401).json({ error: 'Authentication required' });
  }
  try {
    const decoded = jwt.verify(token, process.env.JWT_SECRET);
    req.user = decoded;
    next();
  } catch (error) {
    res.status(401).json({ error: 'Invalid token' });
  }
};

先决条件

在深入研究 HTTP 方法之前，请确保您拥有：

技术要求：

• 已安装 Node.js (v14)
• 代码编辑器（推荐使用 VS Code）
• Postman 或类似的 API 测试工具

所需知识：

• JavaScript 基础知识
• 基本的异步/等待概念
• REST API 原则
• Express.js 基础知识

实际应用

常见实现：

• 电子商务产品目录（GET）
• 用户注册系统（POST）
• 购物车更新（补丁）
• 帐户删除（DELETE）
• 库存管理（PUT）

常见的 HTTP 状态代码

Authorization: Bearer token123
Content-Type: application/json
Accept: application/json
Cache-Control: no-cache

HTTP 方法深入探讨

获取方法

{
  "request": {
    "data": "Example request payload"
  },
  "response": {
    "data": "Example response payload"
  }
}

概念

GET 请求检索数据而不修改服务器状态。他们应该是：

• 幂等

• 可缓存

• 安全

实施说明

// Middleware example
const authenticate = async (req, res, next) => {
  const token = req.headers.authorization?.split(' ')[1];
  if (!token) {
    return res.status(401).json({ error: 'Authentication required' });
  }
  try {
    const decoded = jwt.verify(token, process.env.JWT_SECRET);
    req.user = decoded;
    next();
  } catch (error) {
    res.status(401).json({ error: 'Invalid token' });
  }
};

邮寄方式

// Success Codes
200 OK              // Successful GET
201 Created         // Successful POST
204 No Content      // Successful DELETE

// Client Error Codes
400 Bad Request     // Invalid syntax
401 Unauthorized    // Authentication required
404 Not Found       // Resource doesn't exist

// Server Error Codes
500 Internal Error  // Server-side error

概念

POST 创建新资源。它应该：

• 不是幂等的

• 创建新资源

• 成功返回201

执行

graph LR
    Client-->|GET /products|Server
    Server-->|200 + Products|Client

放置方法

// GET /products/:id
// Purpose: Retrieve single product
// Security: Validate ID format
// Error handling: 404 if not found
app.get("/products/:id", async (req, res) => {
  try {
    const product = await Product.findById(req.params.id);
    if (!product) {
      return res.status(404).json({
        error: "Product not found"
      });
    }
    res.json(product);
  } catch (error) {
    handleError(error, res);
  }
});

概念

PUT 替换整个资源。应该是：

• 幂等

• 替换整个资源

• 不存在则创建

执行

graph LR
    Client-->|POST /products|Server
    Server-->|201 Created|Client

补丁方法

app.post("/products", async (req, res) => {
  try {
    // Validation
    const { name, price } = req.body;
    if (!name || !price) {
      return res.status(400).json({
        error: "Missing required fields"
      });
    }

    // Create resource
    const product = new Product(req.body);
    await product.save();

    // Return created resource
    res.status(201).json({
      message: "Product created",
      product
    });
  } catch (error) {
    handleError(error, res);
  }
});

概念

PATCH 部分更新资源。它应该：

• 幂等

• 更新特定字段

• 验证部分更新

执行

graph LR
    Client-->|PUT /products/123|Server
    Server-->|200 OK|Client

删除方法

app.put("/products/:id", async (req, res) => {
  try {
    const product = await Product.findByIdAndUpdate(
      req.params.id,
      req.body,
      { new: true, overwrite: true }
    );

    if (!product) {
      return res.status(404).json({
        error: "Product not found"
      });
    }

    res.json(product);
  } catch (error) {
    handleError(error, res);
  }
});

概念

DELETE 删除资源。它应该：

• 幂等

• 成功返回204

• 优雅地处理缺失的资源

执行

graph LR
    Client-->|PATCH /products/123|Server
    Server-->|200 OK|Client

高级主题

缓存策略

浏览器缓存

app.patch("/products/:id", async (req, res) => {
  try {
    // Validate allowed updates
    const updates = Object.keys(req.body);
    const allowedUpdates = ['name', 'price', 'description'];
    const isValidOperation = updates.every(update => 
      allowedUpdates.includes(update)
    );

    if (!isValidOperation) {
      return res.status(400).json({
        error: "Invalid updates"
      });
    }

    const product = await Product.findByIdAndUpdate(
      req.params.id,
      req.body,
      { new: true, runValidators: true }
    );

    if (!product) {
      return res.status(404).json({
        error: "Product not found"
      });
    }

    res.json(product);
  } catch (error) {
    handleError(error, res);
  }
});

Redis 缓存示例

graph LR
    Client-->|DELETE /products/123|Server
    Server-->|204 No Content|Client

错误处理模式

集中式错误处理程序

app.delete("/products/:id", async (req, res) => {
  try {
    const product = await Product.findByIdAndDelete(req.params.id);

    if (!product) {
      return res.status(404).json({
        error: "Product not found"
      });
    }

    res.status(204).send();
  } catch (error) {
    handleError(error, res);
  }
});

速率限制

快速速率限制器

// Setting cache headers
app.get('/static-content', (req, res) => {
  res.set({
    'Cache-Control': 'public, max-age=86400',
    'ETag': 'W/"123-abc"'
  });
  res.send(content);
});

CORS配置

const Redis = require('redis');
const redis = Redis.createClient();

// Cache middleware
const cacheMiddleware = async (req, res, next) => {
  const key = `cache:${req.originalUrl}`;
  const cached = await redis.get(key);

  if (cached) {
    return res.json(JSON.parse(cached));
  }

  res.sendResponse = res.json;
  res.json = async (body) => {
    await redis.setEx(key, 3600, JSON.stringify(body));
    res.sendResponse(body);
  };

  next();
};

实践练习

构建 RESTful API

练习 1：用户管理 API

创建一个完整的 CRUD API 用于用户管理，满足以下要求：

• 用户注册与认证

• 个人资料管理

• 基于角色的访问控制

• 输入验证

• 错误处理
  

Authorization: Bearer token123
Content-Type: application/json
Accept: application/json
Cache-Control: no-cache

实施身份验证

练习 2：JWT 身份验证

通过以下方式实现基于 JWT 的身份验证：

• 代币生成

• 刷新令牌

• 密码重置功能

• 帐户激活
  

{
  "request": {
    "data": "Example request payload"
  },
  "response": {
    "data": "Example response payload"
  }
}

处理文件上传

练习 3：分段文件上传

通过以下方式实现文件上传系统：

• 多个文件上传

• 文件类型验证

• 尺寸限制

• 进度跟踪
  

// Middleware example
const authenticate = async (req, res, next) => {
  const token = req.headers.authorization?.split(' ')[1];
  if (!token) {
    return res.status(401).json({ error: 'Authentication required' });
  }
  try {
    const decoded = jwt.verify(token, process.env.JWT_SECRET);
    req.user = decoded;
    next();
  } catch (error) {
    res.status(401).json({ error: 'Invalid token' });
  }
};

性能优化

练习 4：API 优化

通过以下方式优化现有 API：

• 响应压缩

• 字段过滤

• 分页

• 数据缓存

• 查询优化
  

// Success Codes
200 OK              // Successful GET
201 Created         // Successful POST
204 No Content      // Successful DELETE

// Client Error Codes
400 Bad Request     // Invalid syntax
401 Unauthorized    // Authentication required
404 Not Found       // Resource doesn't exist

// Server Error Codes
500 Internal Error  // Server-side error

更多资源

推荐工具

1. API 开发

• 邮递员

• 失眠

• Thunder 客户端（VS Code）

1. 监控$调试

• 摩根

• 调试

• 新遗物

• 数据狗

1. 文档

• Swagger/OpenAPI

• API 蓝图

• 邮递员文档

补充阅读

1. 规格和标准

• HTTP/1.1 规范 (RFC 7230-7235)

• HTTP/2 规范 (RFC 7540)

• REST API 设计最佳实践

1. 书籍

• Leonard Richardson 的“RESTful Web API”

• Brian Mulloy 的《Web API 设计手册》

• 《HTTP：权威指南》作者：David Gourley

1. 在线课程

• MDN 网络文档 - HTTP

• freeCodeCamp - API 和微服务

• Pluralsight - REST 基础知识

社区资源

1. 论坛与讨论

• Stack Overflow - [api] 标签

• Reddit - r/webdev、r/nodejs

• Dev.to - #api、#webdev

1. 开源项目

• Express.js

• 快点

• NestJS

1. API 设计指南

• Microsoft REST API 指南

• Google API 设计指南

• Heroku 平台 API 指南

保持更新：

• API 设计博客

• 技术会议演讲

• 网络开发播客

以上是HTTP：每个 Web 开发人员必须掌握的协议的详细内容。更多信息请关注PHP中文网其他相关文章！