当我调用navigator。sendBeacon直接在控制台，我立即看到请求在Chrome开发工具的网络窗格完成成功。
当我使用下面的代码将sendBeacon附加到beforeunload事件，然后从页面导航时，我看到一行添加到Network窗格，但它的状态保持在"(pending)"并且从不发送。
我做错了什么?
window.addEventListener('beforeunload', function() {
navigator.sendBeacon(
'https://www.example.com/sendBeacon-data-collector',
'Sent by a beacon!');
}, false);
您说连接卡在"pending"状态并且永远不会发送。如果没有发送，则网络窗格中根本不会显示连接，因此这确认了它确实发送了。
至于被困在"待定"状态，这似乎是预期的行为(我仅通过观察经验建立的说法)。根据定义，sendBeacon命令不期望得到答案，所以我认为浏览器不显示连接是否工作是正常的，因为它从未从服务器读取可能的回复(纯粹是我的猜测)。
无论如何:我在我的web应用程序中有一个sendBeacon，它将最后的数据保存到数据库中，尽管存在"未决"状态，但该数据库仍能正常工作。因此，如果您的数据没有到达，问题可能出在其他地方。
例如，您需要确保以正确的格式发送数据。为了使它与从HTML表单读取数据的脚本兼容，您不能简单地发送JSON字符串，而是需要将字符串放入formdata(否则您只能从服务器端的原始post数据中获得它)
的例子:
var fd = new FormData();
fd.append('data', JSON.stringify(beaconData));
navigator.sendBeacon("inc/php/saveData.php", fd);
你还需要知道sendBeacon总是通过POST参数发送数据。如果你想使用GET，你需要自己在url中添加数据。
我也遇到过同样的问题。我有一个Node/Express服务器，我用它来收集请求记录。我在没有数据的情况下进行测试。
数据可以作为ArrayBuffer, ArrayBufferView, Blob, DOMString, FormData或URLSearchParams对象发送。所以，这不是问题所在。
问题出在我的服务器。我使用app.get( )来检查请求，而不是app.post( )。
所有sendBeacon请求都通过POST发送。
它们将始终在Chrome开发工具网络选项卡中显示为挂起。它们总是显示有一个空的text/html响应。
sendBeacon请求将通过POST发送。可以通过"unload"或"beforeunload"触发
AFAIK，当您触发navigator.sendBeacon()时，您不期望从服务器收到任何响应。在页面完全卸载之前，您只需将浏览器发出的请求"排队"。
检查请求是否正确排队的一种方法是查看sendBeacon()方法是否返回true或false。如果是true，您的请求被正确地排队，并且应该保证由浏览器运行。如果是false，则没有正确排队。有关详细信息，请参阅MDN文档