作成日:2021-10-23, 更新日:2021-10-27
経緯
１．適当なページを開く（メニューは閉じられている）
２．閉じられているメニューを開く
３．違うページに遷移
４．ブラウザバック（ブラウザで「戻る」ボタンを押したとき）で戻る
５．「２」の状態になる。希望は「１」のメニューが閉じられた状態
対策
以下、メモ。
・chromeはセキュリティ対策で「popstate」はすでに使えない（2021-10-23時点）
・iPhoneサファリは「bfcache（Back Forward Cache）」が有効
・「bfcache（Back Forward Cache）」が有効な場合、キャッシュを表示。有効でないならキャッシュではなくページを読み込む・・・らしい
・端末かブラウザの何が原因なのかは不明だけど・・・取得できない何かがある
→ひとまず問題は無いっぽい（2021-10-27時点）
サンプル
▼2021-10-23時点の暫定処理
noHave_bfcache = function() {
let perfEntries = performance.getEntriesByType('navigation');
if ( perfEntries.length == 0 ) {
// perfEntriesが空っぽ: ブラウザバックではない・・・と思う。取得できない端末（or ブラウザ）がある。
}
else {
perfEntries.forEach(function(flg){ // 複数個取得されることがあるのかは不明・・・状況によって中のif文でbreak的な何かをいれた方がいいかも？
if (flg.type == 'back_forward'){
// ブラウザバックの時
}
else {
// ブラウザバックではない時
}
});
}
}
window.onpageshow = function(event) { // キャッシュが残った状態でページが表示された時に発生: キャッシュは関係あるのか・・・微妙
if (event.persisted) {
// 「bfcache（Back Forward Cache）」を検出→ブラウザバック・・・iPhoneサファリだけかも？
window.location.reload(); // 基本、リロード。リロードがイヤなら任意の処理
}
else {
// 「bfcache（Back Forward Cache）」を検出していないので、さらに深掘りする
noHave_bfcache();
}
};