防止浏览器和服务器缓存 CSS 文件
开发网站时,进行 CSS 更改但不能立即反映出来通常会令人沮丧在浏览器中。这可能是由于浏览器和服务器都进行了缓存所致。
Apache 缓存 CSS 文件吗?
是的,Apache 默认情况下会缓存资源。要检查您的 Apache 服务器是否正在缓存 CSS 文件,您可以通过将以下行添加到 .htaccess 文件来启用调试:
LogFormat "%r %s %b %H" debuglog CustomLog "| tail -f /dev/stderr -" debuglog
重新加载页面并检查调试日志中是否存在以下行:
GET /css/main.css 200 7122 0
最后一个数字“0”表示该文件是从缓存提供的。
防止缓存
有多种方法可以防止缓存 CSS 文件:
1.将查询字符串附加到文件名
您可以将随机查询字符串附加到 CSS 文件名的末尾,强制浏览器下载文件而不是使用缓存版本。例如:
<link rel="stylesheet" type="text/css" href="style.css?v=2" />
2。使用 Cache-Control 标头
您可以向 HTTP 响应添加“Cache-Control”标头,指定浏览器应缓存文件的时间。例如:
header("Cache-Control: no-cache, no-store, must-revalidate"); header("Pragma: no-cache");
3。在 Apache 中使用 mod_headers
对于 Apache 服务器,您可以使用 mod_headers 模块来防止缓存。将以下行添加到您的 .htaccess 文件中:
Header set Cache-Control "max-age=0, s-maxage=0, must-revalidate"
4。使用版本号调用 CSS
许多网站使用的常见方法是使用版本号调用 CSS。当您更新 CSS 时,会增加版本号,强制浏览器加载新文件。例如:
<link rel="stylesheet" type="text/css" href="style.css?v=1" />
更新 CSS 时,将“v=1”更改为“v=2”。
通过实现这些方法中的一个或多个,您可以确保您的 CSS 更改会立即反映在浏览器中,甚至在生产服务器上。
以上是如何防止浏览器和服务器缓存 CSS 文件?的详细内容。更多信息请关注PHP中文网其他相关文章!