javascript - 卸载前的HTTP请求:sendBeacon与img.src

在beforeunload处理程序的上下文中，fetch(keep-alive: true)和设置src标记的img属性之间的功能区别是什么？哪种是发出GET请求的首选方法？

背景:

我想在JavaScript代码的beforeunload处理程序中发送HTTP GET请求。 Navigator.sendBeacon的文档讨论了此用例but的性能如何



显然，几年前有很多用于这种功能的requests，culminated中的recommendation使用fetch()(sendBeacon内部调用的浏览器方法)，并设置了一些特定的标志来解决unload请求问题:

fetch(url, {
  method: ...,
  body: ...,
  headers: ...,
  credentials: 'include',
  mode: 'cors',
  keep-alive: true,
})

据我所知，这种调用在功能上等同于Navigator.sendBeacon，键设置为keep-alive: true。

显然，根据规范(重点是我的)，HTML <img>标签也为uses keep-alive: true :



我对本文档的理解是，通过GET元素的unload属性对img发出src请求在功能上等效于使用fetch()调用keep-alive: true，其功能上等效于调用sendBeacon(如果sendBeacon可以发出GET请求)。

这个准确吗？

最佳答案

根据https://fetch.spec.whatwg.org/#request-class，它是keepalive，不是keep-alive。

除此之外，是的。此功能已添加到fetch()中，从而不再需要sendBeacon()。