强制同步iframe加载

Question

我有一个指向任意外域http://A的iframe。我想在用户事件中将其发送到另一个外部域http://B。

说http://B加载速度很慢。如果我只是设置了iframe.src = "http://B"，则iframe将保留A内容，直到B完全下载并可以呈现。这对用户来说很困惑，因为他们要求B，但他们看到的只是A。

我想在../html/loading.html和A之间加载来自我的域名的网页，例如B。假设此页面加载总是很快。

我发现设置iframe.src是异步的。请考虑以下代码：

iframe.src = '../html/loading.html';
iframe.src = 'http://B';

这会跳过../html/loading.html，然后直接转到http://B。 （无论loading.html的速度有多快，或B的速度有多慢）。我也尝试过这样做：

iframe.src = '../html/loading.html';
iframe.contentWindow.location.reload();
iframe.src = 'http://B';

但是，这会引发跨域错误，说我无法访问contentWindow http://A中的内容（因为loading.html尚未加载，我们仍然在{ {1}}我无法强行重装。

有没有办法强制iframe执行URL的同步加载？我正在编写Chrome扩展程序，因此如果它必须特定于http://A，那也没关系。

Answer 1

您希望在加载完当前网址后立即加载下一个网址，幸运的是，iframe我们可以使用onload事件。

你想要做这样的事情：

iframe.src='../html/loading.html'
//load the next page after finishing loading the last one
iframe.onload=function(){iframe.src='http://B';}

Answer 2

试试这个：

最初，iframe应使用

加载loading.html

    iframe.src = '../html/loading.html';

在loading.html的客户端onload事件中，应使用

将源更改为其他域B.

    iframe.src = 'http://B';