使用Javascript/AngularJS檢測/防止瀏覽器關閉或會話存儲卸載

Question

如何使用javascript或AngularJS檢測瀏覽器或選項卡關閉並允許用戶通過對話消息阻止它？

我有一個AngularJS應用程序，它將數據保存到會話存儲中，以便用戶可以在不丟失其狀態的情況下刷新頁面，並且可以在不同標籤中打開多個單獨的應用程序實例，而無需同步數據。

如果用戶關閉標籤頁或瀏覽器，則會因爲會話被卸載而失去正在進行的工作。我想檢測會話何時被銷燬，並向用戶顯示一條消息，通知他們如果他們繼續進行，他們將失去正在進行的工作，並允許他們選擇「確定」繼續關閉瀏覽器/標籤或取消以阻止其停止收盤。我只想在瀏覽器/選項卡關閉時顯示消息，而不是在用戶點擊刷新按鈕或導航到新頁面時顯示消息。

注意1：我需要使用會話存儲而不是本地存儲，因爲不同的選項卡需要隔離應用程序實例，並且不能共享數據。

注意2：我已經嘗試了卸載和beforeUnload事件，但這些不起作用，因爲它們在點擊刷新按鈕或用戶導航離開頁面時也會觸發。我只想在會話銷燬之前顯示消息，即當標籤頁/瀏覽器實際關閉時。

注意3：這是一個公司內部公司使用的應用程序，我知道所有的用戶和他們的用例，所以我不擔心用彈出消息來煩他們。我意識到，阻止用戶關閉應用程序將是一個公共網站上不好的用戶體驗，但他是一個非常可控的場景。

Answer 1

理想情況下，你可以使用beforeunload事件生命週期..但正如你所說，你不能。據我所知，沒有其他方法可以將方法與類似事件綁定。

這就是說，你可能還想重新考慮你的第一個音符。您可以爲每個新會話創建一個散列，並將會話內容存儲在localstorage中的該鍵下。