在Javascript / AngularJS中检测/阻止浏览器关闭或会话存储卸载

Question

如何使用javascript或AngularJS检测浏览器或选项卡的关闭，并允许用户通过对话框消息阻止它关闭？

我有一个AngularJS应用程序，该应用程序将数据保存到会话存储中，以便用户可以刷新页面而不丢失其状态，并且还可以在不同选项卡中打开该应用程序的多个单独实例，而不必同步数据。

如果用户关闭选项卡或浏览器，则他们将丢失正在进行的工作，因为会话已卸载。 我想检测会话何时被破坏，并向用户显示一条消息，通知他们如果继续进行操作，他们将丢失正在进行的工作，并允许他们选择“确定”以继续关闭浏览器/选项卡，或者取消以阻止它进行收盘。 我只想在浏览器/选项卡关闭时显示消息，而不是在用户单击刷新按钮或导航到新页面时显示。

注意1 ：我需要使用会话存储，而不是本地存储，因为不同的选项卡需要是应用程序的独立实例，并且不能共享数据。

注意2 ：我已经尝试过unload和beforeUnload事件，但是这些事件不起作用，因为当单击“刷新”按钮或用户离开页面导航时，它们也会触发。 我只想在会话被销毁之前（即当选项卡/浏览器实际上关闭时）显示消息。

注意3 ：这是供公司内部使用的公司应用程序，我知道所有用户及其用例，因此我不担心会因弹出消息而使他们烦恼。 我意识到阻止用户关闭该应用程序将是公共网站上的不良用户体验，但是他的情况非常可控。

Answer 1

理想情况下，您可以只使用beforeunload事件生命周期..但是正如您提到的，您不能。 据我所知，没有其他方法可以将方法绑定到类似事件。

就是说，您可能还需要重新考虑您的第一个音符。 您可以为每个新会话创建一个哈希，然后将会话内容存储在本地存储中的该键下。