使用Javascript/AngularJS检测/防止浏览器关闭或会话存储卸载

Question

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

我有一个AngularJS应用程序，它将数据保存到会话存储中，以便用户可以在不丢失其状态的情况下刷新页面，并且可以在不同标签中打开多个单独的应用程序实例，而无需同步数据。

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

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

注意2：我已经尝试了卸载和beforeUnload事件，但这些不起作用，因为它们在点击刷新按钮或用户导航离开页面时也会触发。我只想在会话销毁之前显示消息，即当标签页/浏览器实际关闭时。

注意3：这是一个公司内部公司使用的应用程序，我知道所有的用户和他们的用例，所以我不担心用弹出消息来烦他们。我意识到，阻止用户关闭应用程序将是一个公共网站上不好的用户体验，但他是一个非常可控的场景。

Answer 1

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

这就是说，你可能还想重新考虑你的第一个音符。您可以为每个新会话创建一个散列，并将会话内容存储在localstorage中的该键下。