javascript - 仅当 iframe 内容为新时才重新加载 iframe？

Question

简短版本:

当 iframe 指向同一服务器上另一个 HTML 文件的 iframe 的 HTML 文件如何能够自动重新加载该 iframe？内容是新吗？

上下文:

我正在使用 HTML/Javascript 文件来监视来自 Python 程序的新指令。当有新的指令要查看时，Python 程序会重写一个简单的 HTML 文件。

所以我的简单解决方案是使用一些 Javascript 强制每秒重新加载 iframe src。

但是，这会导致每次 iframe 加载时内容都会闪烁，并且大多数情况下信息都不是新的。

相反，我希望 HTML 文件仅在 iframe src 是新的时强制重新加载。这可能吗？

Answer 1

您可以使用 AJAX 请求来检查 iframe 是否已更改。

var value;
(function check() {
    var xhr = new XMLHttpRequest();
    xhr.open('GET', '/url/toIframe'); // change this to the correct URL
    xhr.addEventListener('load', function() {
        if(value === undefined) {
            value = this.responseText;
        } else if(value != this.responseText) {
            value = this.responseText;
            // refresh iframe!
        }
        setTimeout(check, 1000); // check again in another second
    });
    xhr.send();
})();

这会向服务器发出请求以查看内容是否已更改。每次请求结束与下一次检查开始之间间隔一秒。 (目前，如果服务器出现故障，则不会进行错误处理。)

<小时/>

仅供引用，如果服务器发送 Last-Modified header ，您实际上可以发出 HEAD 请求并仅检查该 header 。如果您不知道我在说什么，请不要担心。