ブラウザバックで戻った先の画面でブラウザバックを検知して処理したい

ブラウザバックを検知したい

送信ボタンを一度押されると、2重送信防止のためボタンを非活性にして操作できないようにすることがあります。
その場合、仮にブラウザバックを行うと非活性のままキャッシュされてしまっているので、リロードしない限りボタンが活性状態へ戻りません

そこで、ブラウザバックを検知してボタンを活性化させる対応を試みました

解決した

sample.js

window.addEventListener('pageshow', イベント);

ページを読み込んだタイミングでイベントを拾えるようにしました。

また、loadイベントとは違ってpageshowイベントでは、キャッシュされたページの場合も対象になります

・同じウィンドウまたはタブの中で、他のページからそのページへ移動してきたとき
・ブラウザーの進む、戻るボタンを利用してこのページに戻ったとき
https://developer.mozilla.org/ja/docs/Web/API/Window/pageshow_event

試して無理だった方法

履歴の変更を加えて強制的にイベントを実行する

結論：イベントを拾うことは可能でした。が、拾いたいタイミングで拾えなかった

sample.js

history.replaceState(null, "", null);
window.addEventListener('popstate', function(e) {
  alert('ブラウザバック検知');
});

history.replaceStateは、引数に与えられた情報によって履歴を編集するものです。
popstateイベントはその履歴の変更によって発火します

それを利用し、ブラウザバック時のイベントを検知することを試みました。

が、しかし、、、safari以外のブラウザでは欲しいタイミングでイベントが拾えず断念

ブラウザごとにキャッシュするタイミングが異なるから、挙動に差が出てしまいます

参考