強制同步iframe加載

Question

我有一個iframe指向任意外部域http://A 我想在用戶事件http://B其發送到另一個外部域http://B

假設http://B加載緩慢。 如果我只是設置iframe.src = "http://B" ，則iframe將保留A的內容，直到B被完全下載並可以呈現為止。 這使用戶感到困惑，因為他們要求B ，但是他們看到的只是A

我想從A和B之間的域中加載../html/loading.html頁面。 假設此頁面加載總是很快的。

我觀察到設置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';

但是，這會引發跨域錯誤，表示我無法訪問http://A的contentWindow中的contentWindow （因為loading.html尚未加載，我們仍在http://A ，但我無法強制重新加載）。

有沒有一種方法可以強制iframe進行URL的同步加載？ 我正在寫一個Chrome擴展程序，所以如果它必須特定於crx ，也可以。

Answer 1

您需要在當前URL完成加載后立即加載下一個URL，幸運的是，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應該使用加載load.html

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

在loading.html的客戶端onload事件中，應使用以下命令將源更改為其他域B

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