当我创建一个页面,链接它到一个CSS文件,并在浏览器中打开它,它工作正常。 但是,如果在非常短的时间段内进行更改并再次刷新页面,则不会反映更改。但过了一段时间,当我再次刷新页面时,会出现更改。
因此,某种程度上,浏览器会将CSS文件缓存并在一段时间后将其过期。如何使浏览器缓存没有CSS或HTML文件。 如果我可以在特定域上阻止它,那会更好。
我在Ubuntu上,使用Chrome和Firefox,试图阻止浏览器在'localhost'上缓存CSS文件......怎么做......
...谢谢
答案 0 :(得分:4)
这样简单应该有用:
<link rel="stylesheet" src="/css/screen.css?v={CURRENT_TIMESTAMP}">
只需将{CURRENT_TIMESTAMP}
替换为服务器端代码中的实际时间戳即可。这使得浏览器认为它是一个新文件,因为它有查询字符串,它将再次下载。您还可以使用文件的实际修改时间(filemtime('/path/to/css/screen.css')
如果您使用的是PHP),这样可以防止不必要的下载。
答案 1 :(得分:3)
您可以按Ctrl+Shift+J
打开开发者工具,然后在右下方找到一个齿轮图标。当您单击它时,您应该看到一个禁用缓存的选项。
答案 2 :(得分:1)
了解网站的托管方式会有所帮助,因为您可以在大多数网络服务器中进行配置。
此外,引入缓存清除机制是一个好主意,当您更改CSS文件时,该机制会修改指向CSS文件的链接。内容。然后浏览器会重新加载CSS文件,因为HTML引用了不同的URL。
缓存清除机制的一个很好的例子是rails 3.1资产管道上的ruby,如果浏览器支持它们,它还会缩小文件并对它们进行压缩:
Rails 3 - Asset Pipeline -- What does it mean to me?
http://2beards.net/2011/11/the-rails-3-asset-pipeline-in-about-5-minutes/
答案 3 :(得分:0)
看似不优雅但坚如磐石的方法是在内容发生变化时为资产赋予新名称。这解决了所有用户的问题,而不仅仅是您:
<link rel="stylesheet" src="/css/screen_034.css">
<link rel="stylesheet" src="/css/screen_035.css">
<link rel="stylesheet" src="/css/screen_036.css">
或者也许(但是在IDE中更改会更加痛苦,有时会导致缓存无关的问题):
<link rel="stylesheet" src="/css/screen.css?pretend_version_number=034">
在大规模生产环境中,没有其他任何东西可以正常运行,其中数百万个较旧的css文件副本可能位于各种中间或浏览器缓存中。有些客户端会忽略缓存控制标头,并且您实际上并不希望缓存被破坏,至少在生产中是这样。
在开发中,您可以按Ctrl + Shift + J(Chrome)并关闭缓存。