方法一、
function log() {
let xhr = new XMLHttpRequest();
xhr.open('post', '/log', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send('foo=bar');
}
window.addEventListener('unload', function(event) {
log();
// a time-consuming operation
for (let i = 1; i < 10000; i++) {
for (let m = 1; m < 10000; m++) { continue; }
}
});
上面代码中,强制执行了一次双重循环,拖长了unload
事件的执行时间,导致异步 AJAX 能够发送成功。
方法二、
window.addEventListener('unload', function (event) {
navigator.sendBeacon('/log', 'foo=bar');
});
上面代码中,navigator.sendBeacon()
方法可以保证,异步请求一定会发出。第一个参数是请求的网址,第二个参数是发送的数据。
注意,Beacon API 发出的是 POST 请求。