为什么Firefox有时会缓存我的CSS& Javascript代码,即使它已经改变了?

时间:2012-10-25 20:20:59

标签: html css caching browser assets

在我的产品网站上,Firefox有时会“检测不到”我的CSS和& Javascript代码。而是它加载旧版本,所以我似乎需要清除缓存。在这种情况下,我该怎么办?这与最新的Firefox(撰写本文时为16.0.1)有关。

EDIT!

我忘了说localhost css文件的错误。我的意思是,这是一个旧的js文件,我更新它,上传它,并在产品服务器上firefox认为它是localhost文件。 我包含文件的方式:

<link rel="stylesheet" href="/xyz.css" type="text/css" />

7 个答案:

答案 0 :(得分:10)

如果您使用的是服务器端语言,则可以使用技巧。 您可以在.css / .js之后追加一个字符串。以PHP为例:

<link rel="stylesheet" type="text/css" href="/style.css?t=<?= time(); ?>" />

它会更改每个页面重新加载。

请查看有关cache busting

的这篇文章

答案 1 :(得分:9)

您可以使用一种名为&#34;缓存清除的技术&#34;将查询字符串附加到对css / js文件的调用的位置。然后,每当更新css / js时,都会更新查询字符串。

示例:

<link rel="stylesheet" type="text/css" href="/styles.css?ver=1" />

答案 2 :(得分:3)

如其他几个答案中所述,您希望根据内容为您的静态资产设置唯一标识符,即当且仅当内容发生更改时,标识符才会更改。这样,只要内容没有改变,浏览器仍然可以使用资源的缓存版本 - 这正是您想要的。此技术称为静态资产版本控制

所以不要使用当前时间或随机数/字符串。如果可以,请使用文件的修改时间或(更好)使用其内容的md5哈希值。您可以将此标识符附加为查询字符串(将被忽略)或(better)将其附加到扩展名之前的文件名。

为了与之对比并清除其他答案中提到的cache busting技术的混淆:缓存清除是广告商用来强制浏览器始终重新加载资源的一种技术因此,广告客户可以根据请求资源的次数来衡量广告展示次数。这可以通过使用随机数轻松完成。您通常希望将其用于静态资产。

答案 3 :(得分:2)

您可以在您发送的css / js末尾添加一个版本。

例如

而不是www.foo.com/js/javascript.js,请发送www.foo.com/js/javascript.js?v=1
而不是www.foo.com/css/style.css,请发送www.foo.com/css/style.js?v=1

答案 4 :(得分:2)

  • 您可以使用元标记强制刷新。 <meta http-equiv="Cache-control" content="no-cache"><meta http-equiv="pragma" content="no-cache">
  • 您可以强制使用HTTP标头:Cache-control: no-cachePragma: no-cache
  • 您可以将随机查询字符串附加到CSS和JavaScript文件中。

答案 5 :(得分:1)

我不得不清除缓存或硬刷新(Ctrl + F5)。

另一种选择是简单地更改JS或CSS文件的文件名,以便FF不会将其识别为缓存文件(例如,将style.css重命名为style2.css)。

答案 6 :(得分:1)

style.css?randomnumber将确保加载