我正在尝试每隔20秒左右刷新一次动态图像文件，最好使用JQuery/JS，但我愿意接受任何建议。
该图像是一个Twitch.tv.php文件，根据流媒体当前是否正在广播，该文件会从ONLINE动态更改为OFFLINE。问题是，图像有时在没有大量浏览器刷新的情况下不会更新，有时在我清除缓存之前根本不会更新。
我尝试在的网站是http://www.team-omen.com/content.php你会在中央看到一个名为OmenTV的模块，它有几个这样的图像，我希望这些图像能自动更新，这样用户就不必刷新页面来查看流媒体是否已经开始广播。
这来自status.php文件，该文件决定显示哪个.png。。。
<?php
header('content-type: image/png');
$stream = $_GET['stream'];
$json_file = @file_get_contents("http://api.justin.tv/api/stream/list.json?channel={$stream}", 0, null, null);
$json_array = json_decode($json_file, true);
if ($json_array[0]['name'] == "live_user_{$stream}") {
echo file_get_contents("online.png");
}else{
echo file_get_contents("offline.png");
}
?>
这是HTML文件中显示图像的部分
<div align="center" id="streamers">
<div id="omentoggle" class="streamer">
Team Omen
<br />
<img src="http://www.team-omen.com/status/streamstatus.php?stream=teamomen" class="status" id="status_teamomen" />
</div>
<div id="briantitantoggle" class="streamer">
BrianTitan
<br />
<img src="http://www.team-omen.com/status/streamstatus.php?stream=o_briantitan" class="status" id="status_briantitan"/>
</div>
</div>
等等
有人能给我一个如何实现这一点的例子吗？比如说，有问题的图像的ID是#status_teamomen？
提前感谢
您可以在JavaScript中使用setInterval函数定期更新图像源：
setInterval(function() {
var cache_buster = Math.random();
document.getElementById("status_teamomen").src = "http://www.team-omen.com/status/streamstatus.php?stream=teamomen&cache_buster=" + cache_buster;
}, 20000);
请注意，使用cache buster querystring参数在每个请求上生成一个唯一的URL，这将绕过任何浏览器对动态生成的图像的缓存。
对于缓存问题，您可以在url中添加一个随机片段，这样每次url都不同，浏览器不会缓存图像。
请在此处查看答案：每页多个GD图像