Navigator.sendBeacon()

navigator.sendBeacon() 方法可用于通过 HTTP POST 将少量数据异步传输到 Web 服务器。

这个方法主要用于满足统计和诊断代码的需要，这些代码通常尝试在卸载（unload）文档之前向 Web 服务器发送数据。过早的发送数据可能导致错过收集数据的机会。然而，对于开发者来说保证在文档卸载期间发送。

它主要用于将统计数据发送到 Web 服务器，同时避免了用传统技术（如：XMLHttpRequest）发送分析数据的一些问题。

语法

navigator.sendBeacon(url);
navigator.sendBeacon(url, data);

参数

• url

  url 参数表明 data 将要被发送到的网络地址。

• data 可选

  data 参数是将要发送的 ArrayBuffer、ArrayBufferView、Blob、DOMString、FormData 或 URLSearchParams 类型的数据。

返回值

当用户代理成功把数据加入传输队列时，sendBeacon() 方法将会返回 true，否则返回 false。

特点

• 数据发送是可靠的
• 数据传输是异步的
• 不影响下一次导航的载入

示例

示例代码使用 visibilitychange 事件来调用 sendBeacon() 以发送统计数据。

document.addEventListener('visibilitychange', function logData() {
  if (document.visibilityState === 'hidden') {
    navigator.sendBeacon('/log', analyticsData);
  }
});

浏览器兼容性