javascript - 如何刷新远程图片？

Question

我在网站 abc.com 上的 DIV 中有一张图片，该图片托管在其他地方，例如<IMG SRC="http://xyz.com/image.jpg">.

它加载正常，但是，我需要每隔几秒钟更新一次。

大多数要上传的项目都是本地的，但以下代码不适用于远程图片：

$('#rightpic').load('http://xyz.com/image.jpg', null);

通过尝试这个，我得到一个错误：...is not allowed by Access-Control-Allow-Origin.

谁能推荐一个更好的方法来做到这一点？

Answer 1

试试这个，你想实际更改 src，而不是使用 .load() 函数。

$('#rightpic').get(0).src = 'http://xyz.com/image.jpg';

Answer 2

.load使用 AJAX 请求，因此应用相同的源策略 - 这限制了跨域请求。此外，无论如何，这不是加载图像的最佳方式。此外，设置相同的 urlsrc通常会从缓存中加载图像。

相反，您应该为每个请求添加一个随机查询字符串值，例如时间戳，以“破坏缓存”

var img = document.getElementById('rightpic');

//update every 10 seconds using time from epoch as random value
setInterval(function(){
    var randomValue = new Date().getTime();
    img.src = "http://example.com/image.jpg?t="+randomvalue;
},10000);