Google Storage API - 可恢复上传,AJAX,CORS错误

Question

得到一个奇怪的错误.

当用户想要上传文件时,他们会向我的服务器发送AJAX请求.我的服务器使用OAuth2向服务器端验证Google服务器,创建访问令牌,开始可恢复上传,并将可恢复上传URI和访问令牌传递给浏览器.

然后,浏览器直接上传到Google Storage.

一切似乎都很好.该文件到存储桶没有问题,但我仍然在Chrome上收到CORS错误,我不知道在哪里或为什么.这是我的javascript代码的简化版本:

var file = document.getElementById("fileInput").files[0];

var request = requestUpload();
var token = request.token;
var uri = request.uri;

var r = new XMLHttpRequest();
r.open('PUT', uri, true);
r.setRequestHeader("Authorization", "Bearer "+token);
r.send(file);`

很简单 - 但我仍然遇到这个常见错误:

XMLHttpRequest cannot load https://www.googleapis.com/upload/storage/v1/b/*****. No 'Access-Control-Allow-Origin' header is present on the requested resource.

尽管它似乎完全是功能性的.Javascript是否要求查看我默认不允许的内容？我不想有错误.

完成所有内容上传后,XMLHttpRequest对象也会触发错误事件.我猜这个请求是期待谷歌的一些反馈,它没有得到,JavaScript正在成为JavaScript的拉丁语,所以我发现的大部分讨论都是关于jQuery的.

非常感谢!

Answer 1

我刚刚遇到了这个问题.让我挠了一下头,但我想出了一个解决方案.它的记录非常糟糕,并且行为并不完全有意义,但如果您查看此页面上的最后一个要点

https://cloud.google.com/storage/docs/cross-origin

使用可恢复上载协议时,即使您对后续请求使用不同的Origin,也始终使用来自第一个(开始上载)请求的Origin来确定响应中的Access-Control-Allow-Origin标头.因此,您应该对第一个和后续请求使用相同的源,或者如果第一个请求的起源与后续请求的原点不同,请使用CORS配置为*的XML API.

所以我做的是Origin: http://example.com在服务器的可恢复会话启动请求中添加了请求标头.这样,对应于该上载会话ID的所有客户端请求将检查该源.

我仍然觉得奇怪的一件事是OPTIONS浏览器做出的预检请求(至少对我而言)即使PUT请求失败也允许通过任何操作.