JavaScript history.replaceState

Question

一時的にURLに/a/を加えて
ページから離れる時(beforeunload)にhistory.replaceState('','','');で/a/を消したいのですがうまくいきません
なぜできないのか、よくわかりません
詳しい方教えていただけないでしょうか

window.addEventListener('beforeunload', () => {
history.replaceState('','','');
});

history.replaceState('','','/a/');

Answer 1

　HTML仕様を読んでいて笑ったのですが、

The replaceState(data, unused, url) method steps are to run the shared history push/replace state steps given this, data, url, and false.

The shared history push/replace state steps, given a History history, a value data, a scalar value string-or-null url, and a boolean isPush, are:

1. Let document be history's associated Document.
2. If document is not fully active, then throw a "SecurityError" DOMException.
3. Optionally, return. (For example, the user agent might disallow calls to these methods that are invoked on a timer, or from event listeners that are not triggered in response to a clear user action, or that are invoked in rapid succession.)
4. ...

7.10.3 The History interface | HTML Standard

　ということですから、ブラウザは必要に応じて好きにキャンセルしていい、ということになっているようです。

　実際のところ、Chrome ではセキュリティのためにユーザーがページ読み込み後に何らかのアクションをする前に push/replace state をすることを禁止しています。おそらく、ご提示の問題もセキュリティが理由ではないでしょうか。

---

　なお、

　2. Increase document's unload counter by 1.

7.11.12 Unloading documents | HTML Standard

　となっており、

　5. If the specified browsing context's active document's unload counter is greater than 0, then return.

7.10.3 The History interface | HTML Standard

　となっているため、history.backなどは明確にキャンセルされるようになっています。そちらを準用していると考えても納得がいく話でしょう。