仅在修改文件后刷新图像

Question

我有一张通过FTP上传到主机服务器的图像，现在我使用间隔为10秒的函数向image.src中添加一个随机数并重新加载该图像，但这花费太多了带宽，所以我正在寻找一种仅在服务器上的文件已被修改时重新加载元素的方法。

具有时间间隔的功能：

setInterval(function reload() {
    var d = new Date();
    document.getElementById("imageOne").src="folder/image.png?a="+d.getTime();
}, 10000);

Answer 1

有些技术可以让您订阅服务器。我不知道该怎么做，this question on a similar subject建议没有明确答案的人。希望它会得到一个很好的答案。

如果您能负担得起更多的服务器端处理：我将在php端执行以下操作：根据javascript的请求；通过某种等待循环检查文件是否已更新，以保持打开连接的时间尽可能长。将此循环放在php端将减少数据包流量并增加服务器负载。最终，在php超时之前，您想返回一个答案，以便浏览器知道重新打开它的连接，该连接可以和整个文件一样大，也可以像一个空包一样小（一个空包仍为64 bytes）。 / p>

如果您能负担得起一两个数据包，我不知道您的应用程序需要什么样的性能。只需检查最后更新的标头，即可避免每次下载文件。 This post询问有关获取文件的最后修改时间戳的问题将对您有所帮助；如果您不知道如何编写Ajax来做到这一点。

如果您不能决定，则检查标头的错误几率极小。如果价格仍然太高，我会先尝试一下，然后尝试其他方法。如果这还不够的话，混合选项将是我的下一个建议。