为什么设置了Cache-Control还是没生效？

Des.素伟提问于 2026-03-17 12:03:24 阅读 11

前端

我在 Nginx 里给静态资源加了 Cache-Control: max-age=31536000，但每次刷新页面浏览器还是会重新请求图片，状态码是 200 而不是 304 或 from disk cache，这是为啥？

我试过强制刷新（Ctrl+F5）和普通刷新，也清过浏览器缓存，但只要一刷新就重新拉取。Chrome DevTools 里看到响应头确实有我设的 Cache-Control：

Cache-Control: max-age=31536000
Content-Type: image/png

难道还要配 ETag 或 Last-Modified 才行？可文档说 max-age 足够了啊……

我来解答赞 4 收藏

反馈

1 条解答

上官可馨 Lv1

这问题太常见了，十有八九是你 Chrome DevTools 那个 "Disable cache" 开关没关。

你在 Network 面板右键或者在 DevTools 右上角设置里能看到，只要开发者工具开着，Chrome 默认就会勾选 "Disable cache"，这时候甭管你服务端 Cache-Control 设成啥样，浏览器都会每次重新请求。关掉那个选项就好了。

如果确认没开那个开关，那检查一下 Nginx 配置里有没有配其他缓存相关的指令，比如：

# 错误的写法 - if 里面可能不生效

location /static/ {

    if ($request_uri ~* .(png|jpg|jpeg)$) {

        add_header Cache-Control "max-age=31536000";

    }

}



# 正确的写法

location ~* .(png|jpg|jpeg)$ {

    add_header Cache-Control "max-age=31536000";

}

Nginx 的 if 判断在 add_header 这种场景下有时不生效，能不用 if 就别用。

另外你提到强制刷新 Ctrl+F5，那玩意儿本来就会跳过缓存发请求，测试的时候用普通刷新或者直接地址栏回车。

至于 ETag 和 Last-Modified，max-age 够用的话确实不需要配，304 那是 max-age 过期了之后才用来验证缓存有没有更新的。

2026-03-17 17:24