[JavaScript] ブラウザの戻るボタンを禁止する方法

ブラウザの戻るボタンで戻れなくする方法

概要

ウェブアプリなどでは戻るボタンで前のページに戻られると予期せぬ動作をしてしまうことがある。これまでは戻れないように別ウィンドウで表示したりと色々と面倒な小細工をしていたが、History API に対応したブラウザであれば後述の JavaScript で戻る行為を禁止することができる。(普通のサイトでは使用の機会は少ないかもしれないが)

コード

if (history.pushState && history.state !== undefined) {
  history.pushState("aGlybzAyMTg=", null, "");

  window.addEventListener("popstate", function (e) {
    if (!e.originalEvent.state) {
      history.pushState("aGlybzAyMTg=", null, "");
      return;
    }
  });
}

History API に対応していないブラウザは個別に対応してやる必要がある。