😎

フォームの再送信を回避したいですぞ

2020/12/27に公開

なぐり書きです。そしてタイトルが少し間違っていたので直し有用情報を追記ました。

まずブラウザのリロードとは

前回送信した内容をもう一度送る動作をするもの。
https://teratail.com/questions/98171

前回POSTしていたら同じ内容をPOSTしてしまう
URL直叩きのGETとは時として違うふるまいが起こりうる

1回だけリロードしたいと思ったら

        if(!window.location.hash) {
            window.location = window.location + '#loaded';
            _mainmenu.reload();
        }
        if (.name != "any") {
            _mainmenu.reload();
            window.name = "any";
        } else {
            window.name = "";
        }


ブラウザバック時にリロードする
JavaScript 現在のページをリロードしたい
ブラウザバックでどうしてもリロードを行いたい時
とかメチャクチャ色々出てくるが、
画面の初期処理で書いてたらいずれでも弊プロダクトは無限ループした。
もちろん紹介した記事のせいではない。

フォームの再送信の敵前回避

唯一通用しそうだったのがこれ。
https://pisuke-code.com/javascript-prohibit-browser-back/

history.pushState(null, null, location.href);
window.addEventListener('popstate', (e) => {
    history.go(1);
});

「空のステートで履歴を追加してその履歴に戻る」。

本当は

Post/Redirect/Get (PRG) パターン

などができるようにサーバ(java)側の体質改善が必要。

参考

絶対に二重サブミットを許さない友の会
されても耐える 以降になるほどとなった!が弊プロダクトはこの表題の問題でセッションが切れずなのでいつかのために知識として蓄えておくことにする。

Discussion