刷新图像 PHP 和 Javascript答案

【问题标题】：Refresh Image PHP and Javascript刷新图像 PHP 和 Javascript
【发布时间】：2011-03-01 04:49:56
【问题描述】：

我正在使用一个名为 APE 的 Comet 实时引擎，并且我正在使用 jQuery 来刷新 PHP 图像。最初我像这样加载图像：

<div id="container">
<img src="image.php" style='background: url(../assets/load.gif) no-repeat center center;margin-left:42px;' alt=' Loading ...' width="500px" height="300px" />
</div>

然后当我收到一个事件时，我会这样做：

$("#container").empty();
$("#container").html('<img src="image.php?device='+device+'" style="background: url(../assets/load.gif) no-repeat center center;margin-left:42px;" width="500px" height="300px" alt=" Loading ..."/>');

device 是我从事件中收到的一个 var，例如，我得到了 device1，一切正常（图像实际上是一个图表）并且标题更改为“device1”并绘制了最后 5 分钟

但是，我的问题是每次我收到一个事件，在这个初始事件之后，日期仍然保持在相同的五分钟周期。我的设备每次都是一样的，但是在我的脚本中，我计算了 5 分钟前到当前时间的时间，但是这个脚本似乎没有更新图像。它是被缓存还是什么？

我已经尝试在页面顶部使用它：

<?php
header("Cache-Control: no-cache, must-revalidate");
header("Expires: Mon, 26 Jul 1997 05:00:00 GMT");
?>

我可以等待大约 10 分钟，发送一个事件，但时间段仍然是从初始加载开始，我认为“empty()”会清除容器，重新加载图像并因此重新运行脚本。任何建议都会有所帮助！

谢谢

【问题讨论】：

标签： php javascript jquery image comet

【解决方案1】：

一种常见的方法是在包含 unix 时间戳的查询字符串中添加一个普通的 var；浏览器将每个调用视为对唯一图像的调用。例如

'image.php?device=' + device + '&t=' + Math.round((new Date()).getTime() / 1000);

这样它就不会认为它有缓存的图像。（尽管它会继续任何导致此问题的缓存策略）

【讨论】：

谢谢！我认为这可能是最有意义的
请注意，此方法不会阻止缓存，相反，它会在客户端缓存中填充与重新加载页面一样多的版本。可能没问题，但重要的是要提醒它;-)

【解决方案2】：

在图像路径上添加一个额外的随机变量。

$("#container").html('<img src="image.php?device='+device+'&rand='+(math.random * 1000000)+'" style="background: url(../assets/load.gif) no-repeat center center;margin-left:42px;" width="500px" height="300px" alt=" Loading ..."/>');

这将使它看起来像一个不同的 URL 并导致浏览器不缓存。这与 YUI 使用的策略相同。

【讨论】：