你有没有遇到过这种情况：改完网页，刷新却发现页面还是老样子？明明代码已经更新了，用户看到的却是旧内容。这时候问题很可能出在缓存上，而关键就是 Cache-Control 这个HTTP头。
什么是 Cache-Control
Cache-Control 是HTTP协议中用来控制浏览器和中间代理如何缓存资源的字段。它决定了一个文件能被缓存多久、是否允许缓存、谁可以缓存等行为。设置得当，能让网站加载更快；设置不当，就会出现“改了不生效”或者“总是重新下载”的问题。
常见指令说明
比如你有一个静态图片 logo.png，希望浏览器长期缓存它，可以这样设置：
Cache-Control: max-age=31536000, public这里 max-age=31536000 表示缓存有效期是一年（单位是秒），public 表示任何中间代理都可以缓存。
但如果是用户登录后的个人页面，内容敏感且经常变化，就应该禁止缓存：
Cache-Control: no-cache, no-store其中 no-cache 表示使用前必须向服务器验证是否过期，no-store 是最严格的，表示完全不允许存储副本。
实际配置方法
如果你用的是Nginx服务器，在配置文件里加上这一行就行：
location /static/ {
expires 1y;
add_header Cache-Control "public, immutable";
}这样所有放在 /static/ 路径下的资源都会带上一年的有效期和公共可缓存策略。
如果是Apache服务器，可以在 .htaccess 文件中写：
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/jpeg "access plus 1 year"
ExpiresByType text/css "access plus 1 month"
</IfModule>虽然这里用了 Expires，但最终生成的响应头还是会包含对应的 Cache-Control 指令。
开发调试时的小技巧
前端本地开发时，经常希望每次都能拿到最新文件，可以临时加：
Cache-Control: no-cache这样浏览器每次都会发请求问服务器有没有更新，避免自己被缓存坑了还找不到原因。
反过来，上线后发现用户看不到新版本，可能就是因为静态资源被缓存得太久。解决办法之一是在文件名后加版本号或哈希，比如 app.a1b2c3.js，配合长期缓存策略，实现“既能高效缓存，又能强制更新”的效果。
注意优先级
多个缓存指令同时存在时，浏览器会按最严格的规则执行。比如同时有 max-age=3600 和 no-cache，那 no-cache 会起主导作用，即使时间没到也要先校验。
另外，CDN节点也会遵循 Cache-Control 设置。如果你的资源通过CDN分发，设置 max-age 太长，更新时就得手动清缓存，不然全球节点都还在吐旧内容。