AJAX 和用户离开页面

AJAX and user leaving a page

本文关键字：离开 用户 AJAX      更新时间：2023-09-26

我正在聊天，我正在尝试弄清楚如何检测用户是否已离开页面。 几乎所有内容都由数据库处理，以避免前端搞砸。

所以我要做的是，一旦页面因任何原因（窗口关闭、转到另一个页面、单击链接等）离开，就会在一个人离开之前触发 ajax 调用，以便我可以更新数据库。

这是我尝试过的：

$(window).unload(function(){
      $.post("script.php",{key_leave:"289583002"});
});

出于某种奇怪的原因，它不起作用，我已经检查了 php 代码，它工作正常。有什么建议吗？

试试这个：

$(window).unload(function(){
    $.ajax({
        type: 'POST',
        url: 'script.php',
        async:false,
        data: {key_leave:"289583002"}
    });
});

请注意async:false，这样浏览器就会等待请求完成。

使用 $.post 是异步的，因此在浏览器停止执行脚本之前，请求可能不够快。

这不是执行此操作的正确方法...假设操作系统只是挂起或浏览器进程中发生了某些事情，那么不会触发此事件。而且您永远不会知道用户何时离开，在他/她断开连接后，他/她将在线显示。取而代之的是。

    尝试连接套接字
  1. ，以便在套接字断开连接时知道用户已断开连接
  2. 您可以向服务器发送请求（例如每 1 秒一次），以便知道用户仍处于连接状态。如果您没有收到请求 - 即使在 2 秒后 - 断开用户连接。

尝试在 $.post 之后添加弹出窗口（提示（"这么早离开？"））。它可能会起作用。这可能是糟糕的用户体验。:)

这与上面的答案有关。 https://stackoverflow.com/a/10272651/1306144

这将每 1 秒执行一次 ajax 调用。 （1000）

function callEveryOneSec() {
    $jx.ajax({}); // your ajax call
}
setInterval(callEveryOneSec, 1000);

不建议使用 unload 事件来检测离开页面的用户。来自 MDN：

开发人员应避免使用卸载事件...特别是在移动设备上，卸载事件不会可靠地触发。

请改用document上的 visibilitychange 事件和/或window上的pagehide事件（有关详细信息，请参阅链接）。例如：

document.addEventListener('visibilitychange', function() {
    if (document.visibilityState === 'hidden') {
        $.ajax({
            type: 'POST',
            url: 'script.php',
            async:false,
            data: {key_leave: "289583002"}
        });
    }
});

更好的是，使用 Navigator.sendBeacon ，它是专门为向服务器发送少量分析数据而设计的：

document.addEventListener('visibilitychange', function() {
    if (document.visibilityState === 'hidden') {
         navigator.sendBeacon('script.php', {key_leave: "289583002"});
    }
});
相关文章：