一种(略显笨拙的)方法是用AJAX调用服务器端来替换和链接，指示用户离开，然后使用相同的javascript块将用户带到他们所请求的外部站点。

当然，如果用户只是关闭浏览器窗口或输入新的URL，这是行不通的。

为了解决这个问题，您可能需要在页面上使用Javascript的setTimeout()，每隔几秒钟进行一次AJAX调用(取决于您想要知道用户是否已经离开的速度)。

多亏了Service Workers，在浏览器支持的情况下，完全在客户端实现类似于Adam的解决方案成为可能。只需绕过心跳请求:

// The delay should be longer than the heartbeat by a significant enough amount that there won't be false positives
const liveTimeoutDelay = 10000
let liveTimeout = null

global.self.addEventListener('fetch', event => {
  clearTimeout(liveTimeout)
  liveTimeout = setTimeout(() => {
    console.log('User left page')
    // handle page leave
  }, liveTimeoutDelay)
  // Forward any events except for hearbeat events
  if (event.request.url.endsWith('/heartbeat')) {
    event.respondWith(
      new global.Response('Still here')
    )
  }
})

Mozilla Developer Network对onbeforeunload有一个很好的描述和示例。

如果你想在离开页面之前警告用户你的页面是脏的(即如果用户输入了一些数据):

window.addEventListener('beforeunload', function(e) {
  var myPageIsDirty = ...; //you implement this logic...
  if(myPageIsDirty) {
    //following two lines will cause the browser to ask the user if they
    //want to leave. The text of this dialog is controlled by the browser.
    e.preventDefault(); //per the standard
    e.returnValue = ''; //required for Chrome
  }
  //else: user is allowed to leave without a warning dialog
});

这里有一个替代的解决方案-因为在大多数浏览器的导航控件(导航栏，选项卡等)位于页面内容区域的上方，你可以检测到鼠标指针通过顶部离开页面，并显示一个“离开前”对话框。它完全不引人注目，它允许你在用户实际执行离开操作之前与他们进行交互。

$(document).bind("mouseleave", function(e) {
    if (e.pageY - $(window).scrollTop() <= 1) {    
        $('#BeforeYouLeaveDiv').show();
    }
});

缺点是，这当然是一种猜测，用户真的想要离开，但在绝大多数情况下，这是正确的。

页面可见性API

✅页面可见性API提供了可以观察的事件，以了解文档何时变得可见或隐藏。

✅当用户最小化窗口或切换到另一个选项卡时，API触发可见性变化事件。

✅我们可以根据visibilityState执行操作

function onVisibilityChange() {
  if (document.visibilityState === 'visible') {
     console.log("user is focused on the page")
  } else {
     console.log("user left the page")
  }
}

document.addEventListener('visibilitychange', onVisibilityChange);

你能做的就是在页面加载时打开一个WebSocket连接，可以选择通过WebSocket发送数据来标识当前用户，然后在服务器上检查连接何时关闭。