怎么在HTML中配置协商缓存机制-html教程-PHP中文网

html中meta标签无效，因浏览器自2018年起完全忽略；禁用缓存必须依赖服务端响应头，如nginx精确匹配location = /index.html并配置add_header cache-control "no-cache, must-revalidate, max-age=0"、etag on和expires epoch。

怎么在html中配置协商缓存机制

为什么直接在HTML里写无效

浏览器从2018年起就完全忽略 <meta http-equiv="Cache-Control"> 这类标签。你写 <meta http-equiv="Cache-Control" content="no-cache">，DevTools 的 Network 面板里照样看到 Cache-Control: public, max-age=3600——因为协议层只认 HTTP 响应头，<meta> 根本不参与缓存决策。这不是兼容性问题，是设计如此。

Nginx 中给 index.html 配协商缓存的最小可靠配置

必须用 location = /index.html 精确匹配，避免误配带参数的路径（比如 /index.html?v=1）或备份文件（如 /index.html.bak）。关键点：

add_header Cache-Control "no-cache, must-revalidate, max-age=0"; —— 强制每次走协商，must-revalidate 防代理擅自放宽策略
etag on; —— Nginx 默认不发 ETag，只发 Last-Modified；必须显式开启
expires epoch; —— 等价于 Expires: Thu, 01 Jan 1970 00:00:01 GMT，确保强缓存彻底失效
不要加 add_header ETag "" 或手动覆盖 ETag，Nginx 的 etag on 会基于文件内容生成 SHA-256 值，多实例部署才不会错乱

服务端返回 304 的前提是比对逻辑正确

浏览器发 If-None-Match 或 If-Modified-Since，不代表服务器一定返回 304。常见断点：

html-to-pptx-converter

使用 PptxGenJS 和 Python 解析，将结构化的 HTML/CSS 幻灯片内容转换为原生、可编辑的 PowerPoint（.pptx）演示文稿。

下载

ETag 必须是内容哈希（如 sha256(fileContent)），不能是 inode、mtime 或随机字符串，否则多台机器返回不同值，协商永远失败
Last-Modified 精度只有秒级，同一秒内多次构建发布，时间戳不变，可能误判为“未更新”而返回 304
CDN 或反向代理吃掉了你的响应头：本地 curl -I 看到 no-cache，但浏览器 Network 面板显示 public, max-age=86400，大概率是某层中间件覆盖了头——需在 CDN 控制台开“Cache-Control 透传”，Nginx 反向代理中禁用全局 add_header Cache-Control

验证协商缓存是否真生效的三个硬指标

别信地址栏回车或 F5：它们可能走内存缓存或强制校验，结果不可靠。打开 Chrome DevTools → Network → 刷新页面 → 找到 index.html 请求后看三处：

Response Headers 中有 Cache-Control: no-cache, must-revalidate, max-age=0 和 ETag: "W/\"abc123...\""
Request Headers 中出现 If-None-Match 或 If-Modified-Since
Status 显示 304（不是 200，也不是灰色的“from memory cache”）

只要其中一项缺失，协商就没真正跑起来——最常被忽略的是第三点：你以为它在协商，其实每次都是 200 下载新 HTML。