**navigator.sendBeacon()** 方法可用于通过HTTP将少量数据异步传输到Web服务器。
刷新/关闭页面之前发送请求。

开始

参数

navigator.sendBeacon(url, data);
——url 参数表明 data 将要被发送到的网络地址。
——data 参数是将要发送的 ArrayBufferViewBlob, DOMString 或者 FormData 类型的数据。

返回值

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

代码

  1. const data = JSON.stringify({
  2. eventSn: eventId,
  3. sendingTime: Date.now(),
  4. token: this.people.token,
  5. eventVariable: eventLevelVariables,
  6. defaultVariable: {
  7. ...this.global,
  8. ...this.page(),
  9. is_first_time,
  10. ...{
  11. open_id: this.people.open_id,
  12. udid: this.people.udid,
  13. },
  14. title: document.title,
  15. },
  16. })
  17. if (navigator.sendBeacon && parser.os.name !== 'iOS') {
  18. window.navigator.sendBeacon(URL, data)
  19. } else {
  20. var client = new XMLHttpRequest()
  21. client.open('POST', URL, async)
  22. client.setRequestHeader('Content-Type', 'text/plain;charset=UTF-8')
  23. client.send(data)
  24. }

支持

image.png

参考

  1. Navigator.sendBeacon()-MDN
  2. Hunter埋点系统