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

前端之家收集整理的这篇文章主要介绍了javascript – Google Storage API – 可恢复上传,AJAX,CORS错误前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
得到一个奇怪的错误.

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

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

一切似乎都很好.该文件到存储桶没有问题,但我仍然在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无法加载https://www.googleapis.com/upload/storage/v1/b/*****.请求的资源上不存在“Access-Control-Allow-Origin”标头.

尽管它看起来似乎完全正常. Javascript是否要求查看我默认不允许的内容?我不想有错误.

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

非常感谢!

解决方法

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

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

When using the resumable upload protocol,the Origin from the first (start upload) request is always used to decide the Access-Control-Allow-Origin header in the response,even if you use a different Origin for subsequent request. Therefore,you should either use the same origin for the first and subsequent requests,or if the first request has a different origin than subsequent requests,use the XML API with the CORS configuration set to *.

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

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

猜你在找的Ajax相关文章