Question

我正在使用的CSS文件加载了一些像这样的图像：

eg: main.css:  
.nav{  
background-image:url("/www/images/bg.png")  
}

<link href="/www/css/main.css?version=1.2" type="stylesheet" />

CSS文件加载在HTML中，如上所示。

我知道有一种方法可以添加一个类似“？version = 1.2”的查询字符串来强制浏览器从Web服务器加载css文件而不是从缓存加载。但我的问题是，这适用于css文件，但对嵌入的图像没有任何作用。

那么，当我编辑图像时，如何让浏览器下载嵌入在css或js文件中的图像，但名称保持不变？

我不想： 1.更改图像名称 2.禁用缓存

谢谢

Answer 1

可以使用Chrome隐身模式让浏览器每次都获取图片吗？

Answer 2

您可以在托管上使用.htaccess文件（使用mod_expires）吗？

<IfModule mod_expires.c>
   ExpiresActive On
   ExpiresByType image/png "access plus 1 minutes"
</IfModule>

编辑：我看到了你的编辑。您的问题是，您希望在服务器上更新图像时强制客户端刷新图像，而不禁用浏览器缓存吗？

<IfModule mod_expires.c>
   ExpiresActive On
   ExpiresByType image/png "modification plus 1 seconds"
</IfModule>

Answer 3

将查询字符串添加到网址?version=2只会阻止每次网址更改时的缓存，例如image.png?random=123，每次页面加载时random的值都不同。由于网址与缓存图片的网址不匹配，唯一网址会强制浏览器每次重新获取图片。

由于您想要使用静态URL，我建议您设置HTTP服务器设置，以便向浏览器发送不缓存图像的标头。如果您需要帮助，请告诉我。

Answer 4

谷歌的apache mod_pagespeed插件会为你做自动版本控制。这真的很光滑。 http://code.google.com/speed/page-speed/docs/module.html

它解析HTML从Web服务器出来（使用PHP，rails，python，静态HTML - 任何东西）并重写CSS，JS，图像文件的链接，因此它们包含一个id代码。它在修改后的URL上提供文件，并对它们进行非常长的缓存控制。文件更改后，它会自动更改URL，以便浏览器重新获取它们。它基本上只是工作，没有任何代码更改。它甚至会在出路时缩小你的代码。

此帖How to force browser to reload cached CSS/JS files?

被盗

如何更新嵌入在css或js文件中的图像

4 个答案: