强制浏览器在图片上缓存图片

Question

我有缩略图 PHP 脚本，它可以重新制作缩略图。在加载缩略图之前一切正常，浏览器无法从服务器重新加载图像并显示旧缩略图。我尝试了以下技巧：

  header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
  header("Last-Modified: " . gmdate("D, d M Y H:i:s") . " GMT");
  header("Cache-Control: no-store, no-cache, must-revalidate");
  header("Cache-Control: post-check=0, pre-check=0", false);
  header("Pragma: no-cache");

还有元标记：

<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="Expires" content="Tue,01 Dec 1990 06:30:00 GMT">

问题是，我做错了什么还是有其他方法？我知道在图像末尾添加“？randomnumber”技巧。但是，我真的不想使用它，因为这意味着浏览器会缓存大量图像以及让事情看起来很乱。而且我没有真正的方法来可靠地获得缩略图编辑日期。

Answer 1

缓存对您与响应一起发送的标头进行操作，如果缓存已经有一个资源副本，说明其标头未过期，那么它没有理由查看上游，也没有多少麻烦后续响应的标题会改变这一点。

这就是 HTTP 的工作原理。

如果您希望显示新版本的缩略图，您可以：

1. 只发送足够小的缓存标头，这样您就不会像这样自爆。
2. 发送明确禁用缓存的标头。
   • 见：https://stackoverflow.com/a/2068407/1064767
3. 内容更改时更改文件名。
4. 将缓存中断数据附加到 url，也就是 img.jpg?t={$file_modification_timestamp}

这是一个全面的选项列表，无论您觉得它们多么不吸引人。

Answer 2

当我必须清除缓存时，我偶尔会部署一种低技术的 html-php 方法。在图像标签 src 上抛出一个查询字符串！ 如果您通过回显一个随机数来使查询字符串随机化，那么它每次都会破坏该图像的缓存。

    <img src="/images/logo.png?v=<?=rand(1, 10)?>" border="0">

Query Stringed Image

Answer 3

试试这个：

image.jpg?foo=20180308136060 //year, month, day, hours, minute and seconds