浏览器缓存CSS文件

时间:2009-01-20 07:47:10

标签: html css http caching browser

关于CSS和浏览器的快速问题。我尝试搜索SO并发现了一些类似的帖子,但没有确定的。

我在我的网站项目中使用了一个或两个CSS文件。这些在我的网页的HEAD中引用。一旦我点击其中一个页面,CSS是否会被缓存,以便每次请求都不会重新下载?希望如此。 IE,Firefox和Safari处理这种方式有何不同?如果浏览器已关闭,那么在打开新的浏览器实例时第一次访问时是否会刷新CSS?

6 个答案:

答案 0 :(得分:60)

您的文件可能被缓存 - 但这取决于......

不同的浏览器行为略有不同 - 最明显的是处理从服务器发出的模糊/有限的缓存标头。如果你发出一个明确的信号,浏览器几乎一直都在服从。

目前最大的差异在于不同Web服务器和应用程序服务器的默认缓存配置。

某些(例如Apache)可能提供已知的静态文件类型,其HTTP标头鼓励浏览器缓存它们,而其他服务器可能会针对每个响应发送no-cache命令 - 无论文件类型如何。

...

所以,首先,请阅读一些优秀的HTTP caching tutorialsHTTP Caching & Cache-Busting for Content Publishers让我真正大开眼界: - )

接下来安装FirebugLive HTTP Headers插件,以找出服务器实际发送的标头。

然后阅读您的网络服务器文档,了解如何将它们调整到完美(或者说您的系统管理员为您做这件事)。

...

关于重新启动浏览器时会发生什么情况,这取决于浏览器和用户配置。

根据经验,希望浏览器在每次重新启动后更有可能检入服务器,以查看是否有任何更改(请参阅If-Last-ModifiedIf-None-Match)。

如果您正确配置服务器,它应该能够返回超短304 Not Modified(花费很少的带宽),之后浏览器将正常使用缓存。

答案 1 :(得分:41)

问题的第一部分 - 是的,浏览器缓存css文件(如果浏览器的配置没有禁用它)。许多浏览器具有重新加载没有缓存的页面的组合键。 如果您对css进行了更改并希望用户立即看到它们而不是等待下次浏览器重新加载文件而不进行缓存时,您可以通过向URL添加一些参数来改变CSS服务的方式,如下所示:

/style.css?modified=20012009

答案 2 :(得分:7)

它确实依赖于与CSS文件一起发送的HTTP标头,因为两个先前的答案状态 - 只要您不向href附加任何缓存内容。例如

<link href="/stylesheets/mycss.css?some_var_to_bust_cache=24312345" rel="stylesheet" type="text/css" />

某些框架(例如rails)默认将这些框架放入。

但是,如果你得到类似firebugfiddler的内容,你可以确切地看到你的浏览器在每个请求中下载的内容 - 这对于找出你的浏览器是什么特别有用做,而不是 应该做什么。

所有浏览器应该以相同的方式尊重缓存标头,除非配置为忽略它们(但必然会有例外)

答案 3 :(得分:3)

值得注意的是,IE不会使用@import方法缓存其他css文件调用的css文件。因此,例如,如果你的html页面链接到“master.css”,它通过@import输入“reset.css”,那么IE将不会缓存reset.css。

答案 4 :(得分:1)

这取决于您与CSS文件一起发送的标头。检查您的服务器配置,因为您可能没有手动发送它们。 谷歌搜索“http缓存”,了解您可以设置的不同缓存选项。 例如,您可以强制浏览器在每次加载文件时下载文件的新副本,或者您可以将文件缓存一周......

答案 5 :(得分:0)

除非你弄乱了你的服务器,否则它是缓存的。所有浏览器都应该处理它。有些人(像我一样)可能会配置他们的浏览器,以便它不会缓存任何文件。关闭浏览器不会使缓存中的文件无效。但是,更改服务器上的文件应该会刷新文件。