如何使用visibilitychange代替beforeunload？

Question

我需要我的网络应用程序在浏览器或选项卡关闭时发送插入语句。

我目前正在使用以下代码：

function onExit() {

    var fd = new FormData();

    fd.append('postmessage', 'CALL myinsertstatement()');

    navigator.sendBeacon('insert.php', fd);

}

function sleep(delay) {

    var start = new Date().getTime();

    while (new Date().getTime() < start + delay);

}

window.addEventListener('beforeunload', function(event) {

    onExit();

    sleep(1000);

});

我使用

sleep()

方法来延迟窗口关闭，以便给它足够的时间来执行

sendBeacon()

方法，因为没有它，它大多数时候都无法工作。

使用

sleep()

方法，它一直对我有效，但我担心它可能不适用于网速较慢的人，更何况

sendBeacon()

不应该与

beforeunload

一起使用，它应该与

visibilitychange

一起使用，但我不知道如何使用

visibilitychange

来完成这个...

非常感谢您的指导！

Answer 1

看来 MDN 为您提供了支持。但现在距 OP 已经过去 3 年零 9 个月了。

document.onvisibilitychange = () => {
  if (document.visibilityState === "hidden") {
    navigator.sendBeacon("/log", analyticsData);
  }
};

（...最后更新时间：2022 年 3 月 7 日）