如何防止浏览器缓存图像？ [复制]答案

【问题标题】：How to prevent browsers from caching an image? [duplicate]如何防止浏览器缓存图像？ [复制]
【发布时间】：2011-08-26 07:23:22
【问题描述】：

我的网站上有一张我不想缓存的图片。该图像在 CSS 中用作背景，因此我无法动态更改它的名称。有什么想法吗？

【问题讨论】：

我可以设置 Apache。有没有更简单的方法？
@Alex，您可以创建一个 .htaccess 文件，其中包含该文件的缓存指令，这相当容易，并且不需要接触 Apache。
文件是 wp-content/themes/ss3/includes/sprite.jpg 。你能帮我制定规则吗？
@Alex 抱歉，我必须自己查找并测试规则，现在不能这样做。无论如何，您需要this 将指令限制为一个文件；其余的可以在 SO 上找到，尝试按照“apache 禁用缓存”的方式进行尝试。 @David 的链接教程也应该包含这些信息。
@Alex - 只是好奇，但你为什么不希望文件缓存？

标签： php html css

【解决方案1】：

另一种选择是在图像文件之后添加一个随机字符串。

<img src="/path/to/image/image.jpg?<?php echo time(); ?>/>

这应该确保每次显示页面时都重新加载图像。

【讨论】：

适用于许多浏览器，但在 IE8 中，我在 img src 的末尾添加了一个随机数作为查询字符串，就像这样，IE8 仍然会拉出一个缓存的图像！尝试了像image.jpg#random 这样的哈希，也没有骰子。

【解决方案2】：

如果您的目标是现代浏览器，您可以使用 HTML5 清单文件：http://diveintohtml5.ep.io/offline.html#network

【讨论】：

链接已失效，请更新。

【解决方案3】：

使用 apache，您无法通过 2 种不同的方式实现此目的：

使用 mod_headers：

<FilesMatch "\.(png|jpg|jpeg|jpeg)$">
Header set Expires "Fri, 04 Aug 1978 12:00:00 GMT"
Header set Cache-Control "no-cache, no-store, must-revalidate, max-age=0, proxy-revalidate, no-transform"
Header set Pragma "no-cache"
</FilesMatch>

或使用 mod_expires：

<IfModule mod_expires.c>
  ExpiresActive On
  ExpiresByType image/png A0
  ExpiresByType image/gif A0
  ExpiresByType image/jpg A0
  ExpiresByType image/jpeg A0
</IfModule>

【讨论】：

据我所知，您可以跳过 2 行并离开： Header set Cache-Control "no-cache, no-store, max-age=0"

【解决方案4】：

如果您无法在 Apache 上设置缓存规则（如 @David Dorvard 的回答所建议的那样 - 请参阅使用 <Files 指令的部分），您可以通过 PHP 脚本通过管道传输图像，并设置您自己的（否)在那里缓存头文件：

<?php 
header('Cache-Control: no-cache');
header('Expires: 0');
header('Content-Type: image/jpeg'); // or whatever your image is
readfile('/some/path/to/yourfile.jpg');
?>

这应该为您提供一个根本没有缓存的图像；强调应该，因为各种浏览器都有不同的损坏（IIRC IE6 在链接为背景图像时无论如何都会缓存它，但谢天谢地，这正在消失）。

请注意，这种简单的方法将 1) 增加服务器的负载，因为它需要为图像请求启动 PHP 和 2) 禁用脚本/图像的部分下载

【讨论】：

我可以设置 Apache。有没有更简单的方法？
@Alex Dumitru：在这种情况下，请阅读@David Dorward 答案中的链接；我认为你感兴趣的部分从这里开始：mnot.net/cache_docs/#IMP-SERVER

【解决方案5】：

mnot has a good caching tutorial 将解释如何设置 HTTP 标头以请求不缓存图像（请记住，您需要为图像设置 HTTP 标头，而不是 HTML 文档）。

这可能是个坏主意，因为图像往往相对较粗，因此为每个页面重新下载它可能会显着降低性能。

【讨论】：