Safariにおけるiframeのキャッシュの扱いと「Failed to load resource: フレームの読み込みが中断しました。」の回避

Safariにおいて、iframeが存在するページを何度かリロードすると「Failed to load resource: フレームの読み込みが中断しました。」というエラーが発生した。 (他にも複合的な要因の組み合わせである可能性は高いが細かいところは不明)

その他細かい事象として、

という様子。どうもSafariのiframeのキャッシュの扱いが特殊なように見える。

調査してもこの仕様(?)自体の詳細は分からなかったが、回避策は色々と判明したので記録。

これを行うとSafari側が同一のリソースと判断しない(?)のか、リロードしてもキャッシュが用いられない様子。

Railsでやると例えば以下の形

content_tag(:iframe, '', src: some_path + '?' + rand)

実動作上問題は無さそうだが、不要なクエリパラメーターが含まれてしまうのは正直ちょっと気になる。

window.onload = () => {
  document.getElementsByTagName("iframe")[0].contentWindow.location.reload();
}

のような形でiframeの中だけリロードする

分かりやすいが、不要にリロードが行われるのでやや見た目に影響もある(一瞬再リロードされるなど)

HTMLIFrameElement.contentWindow で HTMLIFrameElement が所属する Window オブジェクトを取得できるのは他の何かにも使えそう https://developer.mozilla.org/ja/docs/Web/API/HTMLIFrameElement/contentWindow

metaタグでキャッシュを残さないようにする。

<meta http-equiv="Cache-Control" content="no-store">

これも1.と同様にキャッシュを残さないようにするやり方。一番スマートな気はするが、影響範囲が広くなりがちで気楽には採用できなさそう(試していない)

参考サイト