javascriptで画面が閉じるのを制御したい

前提・実現したいこと

サーバで処理が動いている際にWebブラウザを誤って閉じてしまうと、サーバの処理状態が分からなくなるため
×ボタンで閉じた際にダイアログ（ポップアップ）を表示して簡単に閉じれないようにしたいと考えています。

解決したい課題「ブラウザの×ボタン押下時にダイアログを表示する」

参考にしたサイト：https://www.javadrive.jp/javascript/event/index16.html

javascript
1<script>
2window.addEventListener('beforeunload', function(event){
3    event.preventDefault();
4    event.returnValue = 'Check';
5});
6</script>

上述のコードを記述すると×ボタン押下時にダイアログが表示されるのですが、
サーバが処理中の状態で×ボタンを押下するとダイアログが出ず画面が閉じてしまいます。

ダイアログを表示できない条件などあればご教示いただきたいです。
例えば、forward まで到達していない状態で×ボタンを押下するとダイアログを表示できないだとか
reload 後に×ボタンを押下するとダイアログを表示できないなどございますでしょうか？

加えて、このダイアログがいかなる状況でも表示できるようになったとして、
上述のコードだと「ページを離れる」および「キャンセル」のボタンが表示されますが、
「キャンセル」のみ表示するという制御は行えないでしょうか？

備考

↓↓開発環境↓↓
・eclipseを使用
・JavaEE(Java11)
・Tomcat9.0

m.ts10806

2022/01/19 23:10

ブラウザにより実装状況が違うので絶対の制御は難しいものかと。また、サーバーサイドの処理なのであれば一度リクエストを送ってしまえば画面関係なくサーバー側で処理が行われるので「サーバーの状況」は画面から知るようなことではないと思いますが、そうでない理由があるのでしょうか。画面などの実装状況がこの質問内容では見えてこないので、こたえようがない部分もあります。追記願います。

yambejp

2022/01/20 03:56

進捗を確認するページを作ればよいのでは？

K.KATSU2

2022/01/20 14:05

コメントありがとうございます。現在の実装状況としてはブラウザから処理実行ボタンを押下すると5分近くかかる処理がサーバ側で流れ始めます。このサーバ側で流れる処理は６ステップあるので、ブラウザ側で setTimeout(location.reload(), 10000); といったかたちで画面更新を行い、進捗メッセージを表示するようにしております。このとき、ブラウザを誤って閉じてしまうと結局サーバではどこまで処理されたか、正常終了されたのか分からなくなってしまうということが起きるので、ブラウザを簡単には閉じれないようにしたいと考えた次第です。

行動規範の内容に同意します

回答1件

ベストアンサー

ブラウザは、beforeunloadの設定がある場合でも、ユーザーとページの対話がない場合、ダイアログを表示しません。これは、対話が存在しない場合、ページ上から失われるデータが存在しないためです。

次のHTMLでページ表示直後にクローズするとダイアログは出現しません。
次のHTMLでページ表示後、ページをクリックした後、クローズするとダイアログが出現します。

html
1<script>
2window.addEventListener('beforeunload', function(event){
3    event.preventDefault();
4    event.returnValue = 'Check';
5});
6</script>