JavaScript、浏览器、窗口关闭-发送Ajax请求或在关闭窗口时运行脚本

Question

JavaScript、浏览器、窗口关闭-发送Ajax请求或在关闭窗口时运行脚本我试图找出用户何时离开指定的页面。当他使用页面内的链接进行导航时，没有问题，但是我需要标记一些东西，比如当他关闭窗口或键入另一个URL并按Enter键时。第二个不那么重要，但第一个是。所以问题是：如何查看用户何时关闭页面(捕获窗口.关闭事件)，然后.这并不重要(我需要发送一个Ajax请求，但是如果我能够让它运行警报，我可以做剩下的事情)。

Answer 1

确实有unload和beforeunloadJavaScript事件，但对于Ajax请求来说这些事件并不可靠(不能保证在其中一个事件中启动的请求会到达服务器)。

因此，这样做是非常重要的。不推荐，你应该找个替代方案。

如果您确实需要这样做，可以考虑使用“ping”风格的解决方案。每分钟发送一个请求，基本上告诉服务器“我还在这里”。然后，如果服务器在两分钟内没有接收到这样的请求(您必须考虑延迟等)，则可以考虑离线客户端。

---

另一个解决方案是使用unload或beforeunload执行SjAX请求(同步JavaScript和XML)，但这是完全不建议的。这样做基本上会冻结用户的浏览器，直到请求完成为止，他们不会喜欢(即使请求只需要很少的时间)。

Answer 2

1)如果您正在寻找在所有浏览器中工作的方法，那么最安全的方法是向服务器发送同步Ajax。这不是一个好的方法，但至少要确保您没有向服务器发送太多的数据，而且服务器是快速的。

2)还可以使用异步Ajax请求，并使用忽略用户中止函数在服务器上(如果使用PHP)。不过忽略用户中止很大程度上取决于服务器配置。确保你测试的很好。

3)对于现代浏览器，不应该发送Ajax请求。你应该用新的航海家发送信标方法异步向服务器发送数据，而不阻塞下一页的加载。由于您希望在用户移出页面之前将数据发送到服务器，因此可以在卸货事件处理程序。

$(window).on('unload', function() {
    var fd = new FormData();
    fd.append('ajax_data', 22);
    navigator.sendBeacon('ajax.php', fd);});

似乎也有发送信标的填充..如果本机没有可用的方法，则需要发送同步Ajax。

对于移动设备来说很重要：请注意卸货事件处理程序不一定会被手机触发。..但视觉变化事件被保证会被触发。因此，对于移动设备，您的数据收集代码可能需要一些调整。

你可以参考我的博客文章对于所有三种方式的代码实现。