iframeのキャッシュが強すぎる

iframeで外部HTMLを呼び出す際、iframe内のキャッシュが強すぎて意図しない挙動をすることがあります。

たとえば、同じページのみを呼び出し続ける等。 metaでキャッシュを残さないこともできますが、レギュレーション上できない場合があります。

そんなときの対策をいくつかご紹介します。

呼び出すソースのパスに、ランダムな値を追加する

呼び出す際に、乱数やUNIX時間など、重複する可能性の低い値を追加してiframeのsrcに設定する。

hoge.html → hoge.html?time=123456

ちなみにJavaScriptでUNIX時間を求めるのは次のやりかたで。

var date = new Date();
var time = date.getTime();

これはブラウザの「戻る」ボタン押下時への対応。

「戻る」ボタンによる表示では、loadイベントが走らない場合があり、キャッシュが残るときがあります。

unloadイベントに「何もしない関数」を結びつけることで、強制的にキャッシュを削除するらしい。

$('window').on('unload', function(){});

$('iframe').contentWindow.location.reload();

ちなみにreload(true)にするとスーパーリロードになるそうです。

src属性に改めて読み込み先を指定。

var src = 'hoge.html';
$('iframe').attr('src', src);