问题标签 [sendbeacon]

我有以下代码使用 sendBeacon 方法发送异步 HTTP 请求，

这段代码已经运行了很长时间。目前，由于 chrome https://bugs.chromium.org/p/chromium/issues/detail?id=490015中的安全问题，我们看到错误“无法在 'Navigator' 上执行 'sendBeacon': sendBeacon()实验上不允许类型不是 CORS-safelists MIME-type 的 Blob。有关详细信息，请参阅http://crbug.com/490015。 “

是否有任何解决方法可以通过使用相同的 sendBeacon API 修改请求标头来发送 JSON 数据，直到问题得到解决？这对于依赖此 API 的站点将很有用，可以继续使用直到修复完成。关于使用 XHR 发布数据的建议没有用。

Beacon Post 消息将在后台运行，甚至可以在用户转到新页面时发送数据。Fetch 有类似的功能吗？有人说它在单独的后台进程中运行，但我找不到任何可以验证这一点的文档。

我在加载页面时调用此函数：

这在桌面上完美运行。我在 generateFormSendBeacon() 函数中使用 navigator.sendBeacon。它正确发送它（我的服务器中有一个断点接收它）。然而，在移动设备上，在 safari 和 chrome 中，“beforeunload”事件不存在。但根据苹果的说法，我们应该使用 pagehide 来代替。“页面隐藏”警报显示；iOS 确实有权访问此事件。但是，该事件从未被触发，因为我从未到达服务器中的断点。再次; 在桌面上测试相同的代码路径，它工作正常。如何检测 iOS 上的页面卸载？

如何从navigator.sendBeacon获取响应代码？我需要一些指标来告诉我请求失败了吗？特别是，我正在寻找一种方法来识别错误请求（使用“错误”格式错误的 json 发送的请求并获得 4xx 响应代码）。使用 sendBeacon 时有什么办法吗？

从文档：

如果用户代理能够成功地将数据排队等待传输，则 sendBeacon() 方法返回 true，否则返回 false。

因此，如果请求无效，它不会返回 false。（并且响应代码是 4xx）

navigator.sendBeacon(that.sushiEndpoint, sushiPayload)

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

背景：

beforeunload我想在 JavaScript 代码的处理程序中发送 HTTP GET 请求。Navigator.sendBeacon的文档讨论了它对于这个用例有多好，但是

sendBeacon() 方法不提供自定义请求方法的能力

显然，几年前有很多对此类功能的请求，最终推荐使用fetch()，内部调用的浏览器方法sendBeacon，并设置了一些特定的标志来解决unload请求问题：

需要对此类请求进行非默认设置的应用程序应使用FETCHAPI 并将 keep-alive 标志设置为 true

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

显然，HTML<img>标签也 根据规范使用（强调我的）：keep-alive: true

一个请求有一个相关联的keepalive标志...这可以用来允许请求比环境设置对象更长寿，例如navigator.sendBeacon和HTML img元素设置这个标志

我对本文档的理解是，通过元素的属性发出GET请求在功能上等同于调用with ，它本身在功能上等同于调用（如果可以发出请求）。unloadimgsrcfetch()keep-alive: truesendBeaconsendBeaconGET

这是准确的吗？

我目前正在尝试让 Angular 应用程序在用户尝试离开我的页面时进行 API 服务调用。通过关闭选项卡/窗口，或输入外部 URL。

我已经尝试实现我在这里看到的关于 stackoverflow 问题的几种不同方式，但似乎都没有达到预期的效果。有些人提到同步 ajax 请求在 Chrome 上的 onbeforeunload 中已经或正在被弃用。其他人建议使用 XMLHttpRequests，这似乎遭遇了同样的命运。我曾尝试 @HostListener('window:onbeforeunload', ['$event'])在 HTML 中使用 , 和等价物(window:beforeunload)="doBeforeUnload($event)"，但都拒绝合作。我可以让 console.logs 显示出来，但 API 从未收到任何注销用户的调用。我也使用过navigator.sendBeacon，尽管它的函数返回 true，表示作业已发送到浏览器队列，但没有任何实现。

目前，注销功能是这样的：

反过来，它是一个通用的 http get 函数：

使用 HttpInterceptor 添加完整的 url。注销功能本身正在工作，因为它在手动使用时按预期工作的菜单选项中使用。所以功能应该不是问题。

我要做的就是以同步或异步方式调用 userLogout 函数，并通知后端用户已经离开。

我正在使用 navigator.sendBeacon() api，我了解它在 onunload 时发送数据的好处，但是当它只返回数据是否正在排队的值并且无助于我们检查是否数据成功发送到服务器端。有人可以帮助我理解这一点并提供一个解决方案来检查数据是否已成功发送到服务器。

我navigator.sendBeacon在前端使用来告诉服务器用户何时进入和离开页面（通过window.load和window.unload）。我正在记录到达/离开服务器端的时间。我注意到一些有到达时间但没有出发时间的情况。

window.unload是否存在事件无法触发的常见情况，即不是浏览器/系统崩溃？也许在所有内容加载之前重定向、返回按钮或导航离开页面？

我一直在尝试发送信标beforeunload，它似乎适用于几乎所有现代浏览器，除了处于隐身模式的 Chrome。

这是适用于所有现代浏览器的代码，除了处于隐身模式的 Chrome：

甚至这段代码似乎也不起作用：

我做错了什么还是只是 Chrome 的错？

Recently chrome stop support for synchronos xmlhttprequest on page unload or beforeunload event https://www.chromestatus.com/feature/4664843055398912

i try this solution Perform an asynchronous service get when closing browser window / tab with Angular but not seems to be working in latest chrome versions

Now i am using navigator.sendbeacon api like this

Api is throwing 401 so seems like authorization is not working, Is there any other alternative to navigator.sendBeacon