在 Nginx 配置文件中设置静态资源浏览器缓存过期时间，最推荐的做法是在 http 或 server 块中使用 expires 指令配合 location 匹配静态文件后缀。此方法适用于 CSS、JS、图片等不频繁变动的资源，风险边界在于若文件内容更新但文件名未变，用户浏览器可能仍读取旧缓存。

命令速用版

以下配置片段可直接放入 server 块中，用于匹配常见静态资源并设置 30 天缓存：

location ~* \.(css|js|png|jpg|jpeg|gif|ico|svg|woff|woff2)$ {\n    expires 30d;\n    add_header Cache-Control "public, immutable";\n}

注意：配置修改后需执行 nginx -t 检查语法，再执行 nginx -s reload 重载配置。

为什么会这样

浏览器缓存机制依赖 HTTP 响应头中的时间标识来决定是否复用本地文件。Nginx 的 expires 指令会自动计算过期时间并生成 Expires 头和 Cache-Control 头。当用户再次请求同一资源时，浏览器检测到未过期则直接从本地读取，不再向服务器发送请求，从而降低服务器负载并加快页面渲染。

分步处理

第一步：编辑 Nginx 配置文件。通常位于 /etc/nginx/nginx.conf 或 /etc/nginx/conf.d/ 目录下的站点配置文件中。

第二步：在 server 块内添加 location 匹配规则。使用正则匹配静态资源后缀，例如 location ~* \.(css|js|png)$。

第三步：在 location 块内写入 expires 指令。例如 expires 30d; 表示缓存 30 天，也可使用 expires max; 设置最长缓存时间。

第四步：检查配置语法。在终端执行 nginx -t 命令，确保输出 syntax is ok 和 test is successful。

第五步：重载 Nginx 服务。执行 nginx -s reload 命令使配置生效，无需停止服务。

怎么验证是否生效

使用 curl 命令查看响应头信息。执行 curl -I https://你的域名/static/style.css，观察输出中是否包含 Cache-Control 和 Expires 字段。

预期结果中 Cache-Control 应包含 max-age 值，Expires 应显示具体的未来日期。若未看到相关字段，检查配置是否位于正确的 server 块内，或是否有其他配置覆盖了该设置。

也可在浏览器开发者工具的 Network 面板中查看资源请求的 Response Headers，确认缓存策略已应用。

常见坑

HTML 文件不建议设置长期缓存。因为 HTML 通常包含资源引用链接，若 HTML 被缓存，更新后的 JS 或 CSS 可能无法被用户加载。建议 HTML 文件设置 expires off; 或较短的缓存时间。

动态生成的资源不宜强制缓存。若资源内容随用户或时间变化，强制缓存会导致用户看到旧数据。需排除 php、jsp 等动态脚本后缀。

文件名未变更时更新内容需谨慎。若文件内容修改但文件名不变，浏览器在缓存期内不会请求新文件。建议配合构建工具使用文件名哈希值（如 style.abc123.css）来解决此问题。

常见问题

HTML 文件可以设置长期缓存吗？

不建议对 HTML 文件设置长期缓存。HTML 文件通常作为入口文件，若缓存时间过长，内部引用的静态资源更新后用户无法及时获取，导致页面样式或功能异常。

修改了文件怎么立即生效？

若文件名未变且浏览器缓存未过期，修改文件后用户端不会立即生效。建议通过更改文件名（如添加版本号或哈希值）强制浏览器重新请求新资源。

expires 和 Cache-Control 有什么区别？

expires 是 HTTP/1.0 的标准，使用绝对时间；Cache-Control 是 HTTP/1.1 的标准，使用相对时间（max-age）。Nginx 的 expires 指令会同时生成这两个头，现代浏览器优先遵循 Cache-Control。

参考来源

• Nginx Documentation, ngx_http_headers_module, http://nginx.org/en/docs/http/ngx_http_headers_module.html#expires