JavaScriptでブラウザの挙動判定をする

最近はライブラリが充実してきてこういったブラウザバックやブラウザフォワードの制御周りを自分で書くということはほとんどないのだけれども、書く機会があったのでログとして残しておく。

内容としては、開いているページがどのようにアクセスされたか判定する
例えば、開いているページから戻るボタンを押して、そのあと再び元のページに戻ってくるなど。
そういった挙動をコントロールしたいケースなんかで使う。

    // ブラウザバック制御
    window.onload = ()=>{
      const perfEntries = performance.getEntriesByType("navigation");
      perfEntries.forEach((pe) => {
        switch( pe.type ){
          case 'navigate':
            console.log('通常のアクセス');
            break;
          case 'reload':
            console.log('更新によるアクセス');
            break;
          case 'back_forward':
            console.log('戻るによるアクセス');
            window.location.reload();
            break;
          case 'prerender':
            console.log('レンダリング前');
            break;
        }
      });
    };

MDNではPerformanceEntryに記載されています
PerformanceEntry.entryType – Web APIs | MDN

関連記事