Question

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

var data = {
 name: 'test',
 uniqueId: Math.random()
};
var blob = new Blob([JSON.stringify(data)], {type : 'application/json'});
navigator.sendBeacon('http://example.in/data/post', blob);

此代码已经很好地工作了很长时间。目前，由于Chrome https://bugs.chromium.org/p/chromium/issues/detail?id=490015中的安全问题，我们发现错误＆＃34; 无法执行＆＃39; sendBeacon＆＃39; on＆＃39; Navigator＆＃39;：sendBeacon（），其Blob的类型不是CORS安全的MIME类型是不允许的。有关详细信息，请参阅http://crbug.com/490015。＆＃34;

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

Answer 1

现在，sendBeacon中Content-Type标头唯一允许的值是：

应用程序/ x-WWW窗体-urlencoded
的multipart / form-data的
文本/纯

我的项目中遇到了类似的问题，我最终将数据发送为＆text; / text;字符集= UTF-8＆＃39;并在服务器端读取流为json内容。

客户端：

const blob = new Blob([JSON.stringify(myData)], { type: 'text/plain; charset=UTF-8' });
navigator.sendBeacon(appData.ReleaseSessionUrl, blob);

服务器：

using (var reader = new StreamReader(this.Request.InputStream))
{
   var jsonData = reader.ReadToEnd();
   var sessionData = JsonConvert.DeserializeObject<MyDataType>(jsonData);
}

不确定这是否对您有所帮助。

https://github.com/GoogleCloudPlatform/stackdriver-errors-js/issues/10

Answer 2

请注意，该方法似乎在大多数浏览器中均已损坏。这是关于该主题的large data study。

由于安全问题，sendBeacon API暂时无法正常工作，有什么解决方法吗？

2 个答案: