在我的網站中，我有一個向同一服務器發送一些XHR 請求的頁面，問題是如果用戶單擊任何鏈接以導航到同一服務器上的任何其他頁面，瀏覽器會阻止并等待所有 XHR 首先完成，然后導航，這可能需要大約 10 秒。
我已經實作了XHR 中止解決方案，它正在作業，但瀏覽器仍在等待 XHR 回應。在我看來xhr.abort()只是為了防止呼叫xhr.onload()，但實際上瀏覽器仍在等待 XHR 的回應。
如何使用 JavaScript 強制瀏覽器立即關閉并銷毀 XHR 請求？
代碼是這個的復制粘貼。
所有這些都發生在同一臺服務器上。如果我導航到另一臺服務器，瀏覽器會立即導航，而如果鏈接在同一臺服務器中，則瀏覽器首先等待完成所有 XHR 請求。
uj5u.com熱心網友回復：
問題是瀏覽器將請求數量限制在單一來源，顯然在導航時，Chrome（至少）會等到它可以請求新頁面，然后再拆除舊頁面，從而導致延遲。（相比之下，在我的測驗中，Firefox 不會等待。）
如果您在離開頁面時取消未完成的請求，它們將停止阻止瀏覽器導航。例如，如果您通過包裝函式發出請求：
const requests = new Set();
function request(...args) {
const xhr = new XMLHttpRequest(...args);
xhr.addEventListener("load", removeRequest);
xhr.addEventListener("error", removeRequest);
requests.add(xhr);
return xhr;
}
function removeRequest() {
requests.delete(this);
}
...然后在離開頁面時取消它們：
window.onbeforeunload = () => {
for (const xhr of [...requests]) {
xhr.abort();
requests.delete(xhr);
}
};
這解決了問題（對我來說，使用 Chrome；它也適用于 Firefox，但 Firefox 最初并沒有解決問題）。
考慮到現代瀏覽器對其施加的所有限制，我不確定是否onbeforeunload會起作用，但確實如此，我猜取消請求不會嘗試開始新的東西，也不會花費太長時間，所以這使得感覺。
轉載請註明出處，本文鏈接：https://www.uj5u.com/yidong/459018.html
上一篇：從顯示錯誤的狀態反應創建JSX