javascript - 在窗口关闭时运行 Ajax 请求

Question

如果窗口关闭，我正尝试提交一些表单数据，但在测试时我什至无法让警报工作。我确实读到我可能需要服务器端替代方案来执行此操作？

这是我的:

//if window is closed send form data anyway
$(window).on('beforeunload', function() {
    $.ajax({
            type: 'POST',
            url: $(actualForm).attr('action'),
            data: formData,
            async: false
    });
    alert('something');
});

我做错了什么，还是这不是一个可行的解决方案？

Answer 1

这不会可靠地工作。您不能在卸载时触发网络请求并期望它在页面上下文被拆除之前完成。如果您有数据要发送，则应在未与此表单进行交互时发送。 (检查焦点何时离开输入的 onblur 事件。)

一般来说，如果您需要知道某人何时关闭页面，有一些巧妙的替代方案，每个方案都有自己的注意事项。

一种经典方法是长轮询资源。基本上，您将服务器设置为接受连接并发送 header ，但不发送实际数据。资源可以是任何东西……图像、js、媒体，都没有关系。这里的想法是，当页面上下文被销毁时，浏览器将取消任何正在进行的 HTTP 请求。当连接断开时，很可能浏览器已经关闭。这种方法确实存在问题。你和浏览器之间的代理服务器会做一些不可预测的事情，提前终止连接，让它们无限期地打开等等。另一个问题是你必须记住，使用 HTTP/1.1 和 HTTP/2，许多请求可以通过同一个连接发送.用户可以关闭页面，但底层 TCP 连接可能保持事件状态。

Web 套接字可以用作现代替代方案。你可以合理地确定，如果你建立了一个网络套接字连接，并且它被关闭了，那么页面就消失了或者浏览器已经失去了它的连接。与长轮询一样，您需要构建一个服务器来支持此功能。另请注意，某些移动网络确实会弄乱网络套接字。 (谢谢你，Sprint。)不过情况正在好转，因为此时浏览器已经支持 Web 套接字好几年了。

您还可以进行重复的 AJAX 轮询。每隔 5 秒左右，客户端发送一个请求说，“我还在这里!”，并且服务器更新它的数据库以表明这一点。如果 15 秒后您没有收到浏览器的消息，则它可能不再打开。再次不能保证这一点......连接可能只是暂时丢失。这种方法的缺点是这些请求中的每一个都有开销。当浏览器关闭时，检测延迟也很高，因为您必须设置相当高的轮询间隔。 (我不会少于 5 秒。您不知道什么样的客户端资源问题可能会减慢浏览器请求速度。见过使用卫星互联网的人吗？)

总而言之，最好完全不必这样做。如果可能的话，通过尽早保存来解决这个问题。