【HTTP重定向与缓存机制详解】

HTTP重定向与缓存机制详解

一、HTTP重定向（301/302）基础

1. 什么是重定向？

重定向是服务器告诉浏览器：“你要找的资源不在这里，去另一个地方找吧"的过程。就像你去图书馆找书，管理员告诉你：“这本书被移到了新书架”（301）或"这本书暂时在修复区”（302）。

2. 301与302的本质区别

301 (永久重定向)：资源永远搬家了，以后都在新地址
302 (临时重定向)：资源暂时不在这，临时去另一个地址找

3. 记忆技巧

301：数字"1"像根"竖杠"|，稳固不动 = 永久
302：数字"2"像个"弯钩"∩，弯弯绕绕 = 临时

4. 工作原理

# 301示例
HTTP/1.1 301 Moved Permanently
Location: https://new-site.com# 302示例
HTTP/1.1 302 Found
Location: https://temp-site.com

5. 使用场景

301使用场景：

• 网站升级（HTTP迁移到HTTPS）
• 域名变更
• 网站改版，旧URL更换
• 多域名整合

302使用场景：

• 网站维护跳转
• 未登录用户跳转
• A/B测试
• 负载均衡

二、缓存机制

1. 缓存类型记忆法

强缓存："强"如猛虎，独立决策

• Cache-Control（"Control"表示强势控制）
  • max-age=秒数（最常用，如max-age=3600表示1小时）
  • no-cache（强制协商）
  • no-store（不缓存）
  • public/private（是否允许中间缓存）
• Expires（"Ex"表示到期，就像合同到期日）
  • 具体的GMT时间（如：Wed, 11 Jun 2025 15:00:00 GMT）

协商缓存："协"如外交，需要双方沟通

• ETag/If-None-Match（"Tag"像商品标签，用于匹配）
  • 服务器：ETag: "abc123"
  • 浏览器：If-None-Match: "abc123"
• Last-Modified/If-Modified-Since（"Last"表示最后一次，好记）
  • 服务器：Last-Modified: Wed, 11 Jun 2025 15:00:00 GMT
  • 浏览器：If-Modified-Since: Wed, 11 Jun 2025 15:00:00 GMT

注意：协商缓存响应中也会带有Cache-Control/Expires头

• 用于设置新的过期时间
• 304响应通常会带上新的Cache-Control

2. 缓存判断流程

强缓存（浏览器独立判断）
判断依据：

• Cache-Control（优先级更高）
  • 检查max-age是否过期
  • 检查其他指令（no-cache, no-store等）
• Expires（作为后备）
  • 检查时间是否过期
    工作流程：
• 浏览器：检查资源的Cache-Control
  ↓
• 如果有max-age且未过期 → 直接使用缓存（不发请求）
  ↓
• 如果没有Cache-Control → 检查Expires是否过期
  ↓
• 如果都过期或标记为no-cache → 进入协商缓存阶段

协商缓存（需要服务器参与）
判断依据：

• ETag/If-None-Match（优先级更高）
• Last-Modified/If-Modified-Since
  工作流程：
• 浏览器：发起请求，带上缓存标识
  • If-None-Match: "abc123"
  • If-Modified-Since: Wed, 11 Jun 2025 15:00:00 GMT
    ↓
• 服务器：接收请求，对比缓存标识
  ↓
• 判断资源是否变化：
  • 没变化 → 返回304（不返回资源内容）
    • 同时返回新的缓存控制头：
      • Cache-Control: max-age=3600
      • ETag: "abc123"
  • 有变化 → 返回200和新资源

3. 304状态码详解

记忆技巧：
304 = “3"表示这是个重定向家族的状态码
“04"谐音"没有”，表示"没有修改”

3.1 304响应机制详解

服务器的角色
服务器在返回304时，会同时返回新的缓存控制头（Cache-Control、ETag等）
这些头信息是由服务器程序（如Nginx、Express等）根据配置自动添加的
目的是更新浏览器中缓存资源的元信息，但不返回资源本体

浏览器的处理流程
收到304响应 →
更新本地缓存的元信息（使用新的Cache-Control、ETag等） →
使用本地缓存中的资源内容显示

3.2 完整的缓存判断顺序（优化级由高到低）

1. 强缓存检查（浏览器独立完成）
   ↓
   检查Cache-Control: max-age是否有效
   ↓
   检查Expires是否有效
   ↓
   如果命中强缓存 → 直接使用缓存（不发请求）
   如果未命中 → 进入协商缓存阶段

2. 协商缓存检查（需要服务器参与）
   ↓
   发送请求带上If-None-Match和If-Modified-Since
   ↓
   服务器检查资源是否变化
   ↓
   未变化 → 返回304+新的缓存控制头
   已变化 → 返回200+新资源

3. 全新请求（缓存完全失效）
   ↓
   返回200+新资源+新的缓存控制头

4. 缓存状态码对比

• 200：从服务器返回新资源
• 200 (from cache)：命中强缓存
• 304：协商缓存验证后使用本地缓存

5. 完整缓存判断流程示例

# 首次请求资源
GET /resource.js
Host: example.com响应：
HTTP/1.1 200 OK
Cache-Control: max-age=3600
ETag: "abc123"
Last-Modified: Wed, 11 Jun 2025 15:00:00 GMT
[资源内容]# 再次请求同一资源（在max-age内）
结果：浏览器直接使用缓存，不发请求
状态：200 (from disk cache/memory cache)# 再次请求同一资源（max-age过期）
GET /resource.js
Host: example.com
If-None-Match: "abc123"
If-Modified-Since: Wed, 11 Jun 2025 15:00:00 GMT响应（如果资源未改变）：
HTTP/1.1 304 Not Modified
ETag: "abc123"
Cache-Control: max-age=3600

三、301与搜索引擎

1. 搜索引擎处理301的过程

• 爬虫访问旧URL
• 收到301响应和新URL
• 更新索引库
• 传递旧URL的"权重"到新URL
• 后续直接抓取新URL

2. 301缓存机制

• 浏览器层面：永久缓存重定向信息
• 搜索引擎层面：更新索引并持久化存储
• CDN层面：可能缓存301响应

3. 最佳实践

• 确保新旧URL的映射关系正确
• 保持301重定向链不要太长（影响性能）
• 适当设置Cache-Control头控制缓存时间
• 监控重定向流量和搜索引擎收录情况

四、实现示例

Nginx配置

# 301配置
location /old-path {return 301 https://new-site.com$request_uri;
}# 302配置
location /maintenance {return 302 /maintenance.html;
}

Node.js实现

// 301重定向
res.writeHead(301, {'Location': 'https://new-site.com'
});
res.end();// 302重定向
res.writeHead(302, {'Location': '/temp-page'
});
res.end();

五、现代Web缓存优化趋势

1. "服务器偷懒"策略

现代Web开发中，"服务器偷懒"已成为一种重要的优化策略。这不是贬义，而是一种精妙的性能优化方案：

• 优先使用缓存
• 强缓存：完全不打扰服务器
• 协商缓存：只确认资源是否变化
• 最后才是完整响应

优化目标

• 减少服务器负载
• 节省网络带宽
• 提升响应速度
• 降低服务器成本

2. 缓存优化最佳实践

合理设置缓存策略

• 静态资源使用较长的max-age
• 动态资源使用协商缓存
• 频繁变化的资源设置较短的过期时间

监控和调整

• 监控缓存命中率
• 分析未命中原因
• 持续优化缓存策略

性能收益

• 用户体验提升：更快的页面加载
• 服务器受益：更低的负载
• 成本优化：带宽使用更少

这种"服务器偷懒"的策略，实际上是现代Web性能优化的重要趋势，它巧妙地平衡了用户体验和服务器资源的使用，是一种双赢的解决方案。