时间戳

首页 > 解决方案 > 仅当用户实际关闭选项卡时，我如何运行 Javascript 代码？

javascript - 仅当用户实际关闭选项卡时，我如何运行 Javascript 代码？

问题描述

当用户关闭我的页面时，我正在尝试运行一些 JS 代码。我在网上找到了这个：

window.addEventListener('beforeunload', (event) => {
      event.returnValue = null
      console.log("unload")
    });

当我尝试在我的文档中使用此代码关闭我的页面时，Chrome 会给我一个对话框并询问“离开网站？您所做的更改可能不会被保存”，并带有“离开”和“取消”选项。它也运行console.log，所以它似乎工作正常，对吧？但是，在console.log出现提示的同时运行。所以我不知道用户实际上关闭了网站，因为据我所知，他们本可以点击取消。如果我知道用户实际上关闭了页面，我只想运行我的代码。

如果可能的话，我真的更愿意避免使用 WebSockets，或者进行某种连续轮询以检查用户是否仍在页面上。但是，如果真的没有其他方法可以做到这一点，我可能会诉诸其中一种方法，但我真的希望有另一种方法可以做到这一点。

有任何想法吗？

编辑：我实际上并不关心触发beforeunload事件的原因。例如，用户可能会单击浏览器中的关闭按钮，他们可能会刷新页面，可能会单击链接，或者可能会在浏览器中键入另一个 URL。我不在乎。如果他们在出现的提示上单击取消，我只是不想运行我的代码，因为他们实际上并不会真正卸载页面。另外，我没有做任何侵入性的事情，只是在幕后做一些数据库的事情，所以如果代码在页面关闭后以某种方式运行也没关系（我想我记得一些关于sendBeacon或能够做到这一点的东西，但我'不确定），或者如果根本没有出现提示也可以，它只是运行我的代码然后关闭页面。

标签： javascriptdom-eventsaddeventlisteneronbeforeunload

解决方案

顾名思义，此事件发生在页面卸载之前，并允许用户取消卸载。

使用unload事件侦听器来检测页面何时真正被卸载。如果你有两个事件监听器，这只会在用户选择时运行Leave。

推荐阅读