以前書いた記事
iphone iOS safariの「戻る」ボタンの問題
これはiphone iOS safariの「戻る」ボタンで前のページに戻るとキャッシュが残っていてまっさらにならないという問題の対応策だった。
その対応策とは「戻る」ボタンで前のページに戻るときにjavascriptで強制的にリロードさせるやり方だ。
この記事に対して何件か同じようなお問い合わせをいただいていた。
内容は「特定のページへ戻るときだけ処理（リロード）させたい」というものだった。
今回はこれを取り上げてみます。
戻ったページによって処理を変える
戻ったページによって処理を変えるのは簡単だ。
たとえばトップページに戻る時だけ処理させたい。
この場合「戻る」事は意識せずに「読み込むページがなにか」がわかればいい。
location.href
これで読み込むページのURLがわかる。
current_url = location.href;
if(current_url == 'トップページのURL'){
//特定の処理
}
上記のソースでトップページに戻ったときだけ（トップページを表示したときだけ）の処理が書ける。
これを
iphone iOS safariの「戻る」ボタンの問題
のソースと組み合わせると、
current_url = location.href;
window.onpageshow = function(event) {
if (event.persisted && current_url == 'トップページのURL') {
window.location.reload();
}
};
こんな感じでトップページの時だけ強制リロードさせる事が出来る。
戻る前のページによって処理を変える
戻ったページではなく戻る前のページによって処理を変える事も出来る。
webページは前にいたページを取得出来る。
前にいたページはリファラーで取得出来る。
javascriptで書くと、
document.referrer
これで取得出来る。
ref_url = document.referrer;
alert(`ref_url=${ref_url}`);
上記のソースをページAに書いて
ページBにページAへのリンクを貼る。
ページBからページAへのリンクをクリックして移動すると、
アラートでページBのURLが表示されるはずだ。
これを使えば特定のページへ戻るときだけの処理が書ける。
ref_url = document.referrer;
if(ref_url == 'トップページのURL'){
//特定の処理
}
上記のソースで前のページがトップページだった時だけの処理が書ける。
これを
iphone iOS safariの「戻る」ボタンの問題
のソースと組み合わせると、
ref_url = document.referrer;
window.onpageshow = function(event) {
if (event.persisted && ref_url == 'トップページのURL') {
window.location.reload();
}
};
これで前のページがトップページだった時だけ制的にリロードする。
まとめ
以上、「iphone iOS safariの「戻る」ボタンの問題」の記事で扱った事に対しての加筆としての記事でした。
実装するときとはテストをして確かめてから行ってください。
超シンプルなソースで解決出来ましたが、他にもっといいやり方もあるとは思います。
何か気づかれた方はコメントをいただけると嬉しいです。
