在窗口關閉時發送通知

Question

我有一個Web應用程序，我試圖在窗口關閉時向服務器發送通知。到目前爲止，我發現的最好方法是在onunload中使用同步xhr（因爲異步是不可靠的）。下面是目前的代碼：

window.onunload = function() { 
     var req = new XMLHttpRequest(); 
     req.open('GET', '/api/v1/' + id + '/close?resource=' + JSON.stringify(resource), false); 
     req.setRequestHeader('Authorization', localStorage.token); 
     req.send(); 
    } 

唯一的問題是，當他們重新加載頁面，頁面定格位（我認爲這是由於XHR）。當窗口關閉時，有沒有更好的方式將通知發送到服務器？

Answer 1

您正在尋找beforeunload事件。 unload事件實際上是在用戶返回頁面時發生的（因爲事件在網頁關閉時無法觸發，也沒有關閉該選項卡，因爲文檔尚未卸載）。

另外一個有用的提示是以URL兼容格式編碼您的JSON：encodeURIComponent(JSON.stringify(resource))。

在這裏看到：https://developer.mozilla.org/en-US/docs/Web/Events/beforeunload

Answer 2

我認爲更好的辦法是使用Navigator.sendBeacon新的瀏覽器 - 瀏覽器，Opera和Firefox - 因爲是異步的，瀏覽器給你的承諾，將發送請求。

該方法解決了分析和診斷代碼的需求，通常會在卸載文檔之前嘗試將數據發送到Web服務器。

更多，你可以在這裏找到：https://developer.mozilla.org/en-US/docs/Web/API/Navigator/sendBeacon

填充工具：https://github.com/miguelmota/Navigator.sendBeacon