23

我有一个项目列表，其中还包含一个图像缩略图。有时我需要更改缩略图，但保持文件名相同。有没有办法强制浏览器下载新上传的图片，而不是从浏览器缓存中抓取一张？

当人们更新他们的头像时，这非常相关，这会导致一些用户感到困惑，他们一直看到他们的旧头像，直到他们清除浏览器缓存或重新启动浏览器。

4

8 回答 8

33

在图像 src 的末尾附加一个唯一编号

IE

<?php

echo "<img src=../thumbnail.jpg?" . time() . ">";

仅在更新头像的表单上执行此操作

为我工作

顺便说一句，这适用于强制更新其他静态文件

即css文件的html是

<link rel="Stylesheet" href="../css/cssfile.css?<?= md5_file('cssfile.css'); ?>" />
于 2010-12-18T22:07:23.210 回答
8

您可以使用文件的修改时间：

<?

$filename = 'avatar.jpg';
$filemtime = filemtime($filename);

echo "<img src='".$filename."?".$filemtime."'>";

//result: <img src='avatar.jpg?1269538749'>

?>

当文件被修改时会清除客户端缓存

于 2010-06-29T05:07:20.097 回答
2

缓存的图像在手动页面刷新时也会失效（在浏览器中按 F5）。这可以通过在身体负载时触发的 Javascript 方法 location.reload() 来模拟。为了避免永久重新加载，这可能只发生一次。当用户上传一个新的头像时，ReloadPending 请求会在他/她的会话中持续设置，并在被回答时重置。

<?php
if ($session['ReloadPending']) 
{   $session['ReloadPending']=false; 
       echo "<body onload='location.reload(true);'>"; 
} else echo "<body>";
?>

头像上传后重新加载整个页面会导致页面闪烁，但这种情况只会发生一次，我相信这是可以接受的。

于 2014-01-30T22:28:14.933 回答
2

您可以通过更改标题使整个页面的缓存无效：

<?php
header("Cache-Control: no-cache, must-revalidate"); // HTTP/1.1
header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // Date in the past
?>
于 2010-06-29T04:52:09.180 回答
1

发送图像时，请确保不要发送任何Expires标题。还要考虑发送这个缓存头：

Cache-Control: must-revalidate

这将使浏览器每次都向您的服务器询问图像。注意请求中的 If-Modified-Since 标头；如果图像没有被修改，则使用 304 HTTP 代码回答。

整个过程（必须重新验证，If-Modified-Since，304 答案）将使浏览器可以缓存图像内容，但同时询问您的服务器文件是否已更改。

另一种可能更简单的解决方案是只在未来的短时间内Expires设置标题，例如十分钟，并通知用户十分钟的延迟。这将加速大多数页面加载，因为根本不需要对图像执行任何 HTTP 请求。

于 2010-06-29T04:55:11.717 回答
1

.htaccess请在您的文件中使用这些规则。我使用了这些规则并解决了与使用相同文件名重新上传图像相关的问题。 

# BEGIN Caching
<ifModule mod_headers.c>
    <filesMatch "\\.(ico|pdf|flv|jpg|jpeg|png|gif|swf|ttf|otf|woff|woff2|eot|svg)$">
        Header set Cache-Control "max-age=0, public"
    </filesMatch>
    <filesMatch "\\.(css)$">
            Header set Cache-Control "max-age=604800, public"
    </filesMatch>
    <filesMatch "\\.(js)$">
        Header set Cache-Control "max-age=216000, private"
    </filesMatch>
    <filesMatch "\\.(xml|txt)$">
        Header set Cache-Control "max-age=216000, public, must-revalidate"
    </filesMatch>
    <filesMatch "\\.(html|htm|php)$">
        Header set Cache-Control "max-age=1, private, must-revalidate"
    </filesMatch>
</ifModule>
# END Caching
于 2020-01-13T13:05:55.137 回答
0

您可以将上次修改日期添加到您的图像，或者只是在图像末尾添加日期和时间URL

例如

$today=date('Y-m-d H:i');

<img class="img-circle pro_pic" src="https://govcard.net/yourimage.jpg?lm=<?php echo $today?>" alt="">

在 .jpg 之后像这样添加日期和时间。希望这会帮助你。

于 2020-05-10T17:31:56.837 回答
0

我发现最好的方法之一是使用相同的 URL 来获取和发布图像 (REST)。

POST /my/image（缓存控制：无缓存，必须重新验证）

GET /my/image（缓存控制：必须重新验证）

于 2015-10-22T09:56:16.150 回答