web-dev-qa-db-ja.com

JavaScriptを使用してiframeでハードリフレッシュを強制できますか？

JavaScriptでiframeを更新する方法について、StackOverflowで多くの回答を見つけました。

例えば：

彼らはうまく働きます。ただし、iframeのページが最近変更された場合、更新ではこの変更は表示されません。指定されたiframeを強制的に更新して、新しいバージョンが表示されるようにする方法はありますか？

javascriptiframerefresh
8
jkupczak

IFrameをURLでリロードしますが、一意のIDを指定します...

var Rand = Math.floor((Math.random()*1000000)+1);
var iframe = document.getElementById('youriframe');
iframe.src = "http://www.yourpage.com/yourpage.html?uid="+Rand;

あなたが現在持っているコードを見ることができれば、あなたに解決策を与えるのは簡単でしょう。

お役に立てば幸いです。

7
George

私は何年もの間これに苦労しました。上記の方法の多くは、iframeがWebページと同じドメインにある場合に機能します。

ただし、iframeが別のドメインのものである場合、これらの方法は機能しません（CORSポリシーのため）。

Src属性の種類を変更しても機能しますが、iframeが適切に再描画されません。これは、iframeを使用してページにGoogleマップを埋め込んでいる場合に特に顕著になります。

私が最終的に発見したのは、次のことを行う必要があるということです。

1）iframeのソース属性を保存します

2）DOMからiframeを削除します

3）手順1で保存したソース属性の最後にランダムクエリパラメータを追加します。

4）iframeをDOMに追加し直します（一意のソース属性を使用）。

 //save the source of the iframe minus the unique identifier
    tempElementSrc = $('#the-iframe').attr('src').substring(0,$('#the-iframe').attr('src').lastIndexOf('&', $('#the-iframe').attr('src')));

  //remove the iframe
    $('#the-iframe').remove();

  //readd the iframe with the new source including random query string
  $('#container-id').append('<iframe width=\"100%\" id=\"iframe-id\" src=\"' + tempElementSrc + '&' + Date.now() + '\">');
1
John McAulay