AngularJS 直接上传到谷歌云存储错误答案

【问题标题】：AngularJS Direct Upload to Google Cloud Storage ErrorAngularJS 直接上传到谷歌云存储错误
【发布时间】：2016-07-09 12:04:51
【问题描述】：

我想直接从 AngularJS 上传大于 32MB 的文件到 GCS

当文件大小小于 32MB 时，我可以使用下面给出的代码成功上传到 Blobstore。

$http.post(uploadUrl, $scope.formData, {
    withCredentials: true,
    headers: {'Content-Type': undefined},
    transformRequest: angular.identity
});

当我尝试使用 url https://storage.googleapis.com/bucket-name/filename 上传文件时，出现以下错误。

Credentials flag is 'true', but the 'Access-Control-Allow-Credentials' header is ''. It must be 'true' to allow credentials. Origin 'http://localhost:8080' is therefore not allowed access.

当我删除 http 帖子中使用的标志 withCredentials: true 时，我得到的响应为 403，没有给出错误详细信息。

我已经为上传存储桶设置了上述的 cors [{"maxAgeSeconds": 3600, "method": ["GET", "POST", "HEAD"], "origin": ["http://localhost:8088"], "responseHeader": ["Content-Type"]}]

如何在服务器中启用Access-Control-Allow-Credentials标志？

【问题讨论】：

标签： angularjs google-app-engine google-cloud-storage

【解决方案1】：

您可以在继续使用 blobstore 的同时完成此操作，而不是切换到 Cloud Storage。谷歌文档处理得相当好。警告：在我看来，Google 将其作为一项遗留功能来支持，但建议改用 Can Storage。我个人没有这样做，但听起来Signed URLs 可能是那里的答案。

如果您想继续使用 blobstore，就像我一样，Java 中服务器端设置的说明是 here。您应该在类似的 URL 上找到其他语言的类似说明。 :)

一开始我不明白的棘手部分：直接上传请求完成它的工作，然后使用有关上传的信息直接调用您的服务器，然后使用服务器的响应作为返回给客户端的响应。例如，您可以在服务器的上传处理程序中设置 Access-Control-Allow-Origin 标头，它将被添加到来自直接上传链接的响应中。

【讨论】：

嗨@Eric，感谢您的回复。我按照建议尝试了签名的网址，但遇到了同样的错误。下载成功，但没有上传。对于通过 blobstore 上传，我遇到了不同的错误，请参考 stackoverflow.com/questions/38344261/…。我无法成功使用Access-Control-Allow-Origin 标头，使用withCredentials: false 设置修改httpProvider 默认标头$httpProvider.defaults.headers.common['Access-Control-Allow-Origin'] = '*'; 并没有多大帮助。你能指导我使用标题吗？
您需要在 server 发送的 response 上设置该标头，而不是来自您的客户端的请求。因此，在您的 Java 代码中（我认为这是您从链接的其他问题中选择的语言），您可以使用 resp.setHeader("Access-Control-Allow-Origin", "*");。
嗨@Eric，我可以坚持你的前两个解决方案。这真的很有帮助！