谷歌云存储与Rails ActiveStorage的CORS问题

Question

我将使用gsutil设置我的存储桶的CORS，我相信它应该可以工作，但我还没有解决“请求的资源上不存在'Access-Control-Allow-Origin'头”的错误。

这是我的cors json:

[
  {
    "origin": [
      "*"
    ],
    "responseHeader": [
      "Content-Type",
      "Content-MD5"
    ],
    "method": [
      "PUT",
      "POST",
      "GET",
      "HEAD",
      "DELETE",
      "OPTIONS"
    ],
    "maxAgeSeconds": 3600
  }
]

我已经验证了这个设置实际上是被设置的:

gsutil cors get gs://mah-bucket
[{"maxAgeSeconds": 3600, "method": ["PUT", "POST", "GET", "HEAD", "DELETE", "OPTIONS"], "origin": ["*"], "responseHeader": ["Content-Type", "Content-MD5"]}]

以下是请求失败时的临时标头内容：

Content-MD5: Ug6Qj+DozqmniNxTXOYnDA==
Content-Type: application/vnd.openxmlformats-officedocument.wordprocessingml.document
Origin: https://subdomain.example.com
Referer: https://subdomain.example.com/
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/67.0.3396.99 Safari/537.36

我已经按照这里的建议进行了操作：https://github.com/rails/rails/issues/31523

我也尝试过在隐身窗口中打开，因此它不会缓存任何以前的预检请求。

更新： 我已经将问题缩小到使用Google服务的ActiveStorage边缘情况。正常的文件上传表单可以使用Amazon S3和Google GCS服务。使用ActiveStorage DirectUploadController js进行上传可以使用Amazon，但无法使用Google。

每种情况下发出的请求都相同，除了服务之间的一些认证差异外，但是预检请求的响应是不同的。这是S3预检请求的响应：

Access-Control-Allow-Headers: content-md5, content-type
Access-Control-Allow-Methods: PUT, POST, GET, HEAD
Access-Control-Allow-Origin: *
Access-Control-Max-Age: 3600
Content-Length: 0
Date: Tue, 24 Jul 2018 22:32:51 GMT
Server: AmazonS3
Vary: Origin, Access-Control-Request-Headers, Access-Control-Request-Method
x-amz-id-2: xxx/x/xxx
x-amz-request-id: xxx

这是GCS飞行前请求的响应结果：

access-control-allow-headers: Content-Type,Content-MD5
access-control-allow-methods: PUT,POST,GET,HEAD,DELETE,OPTIONS
access-control-allow-origin: *
access-control-max-age: 3600
alt-svc: quic=":443"; ma=2592000; v="44,43,39,35"
cache-control: private, max-age=0
content-length: 0
content-type: text/html; charset=UTF-8
date: Tue, 24 Jul 2018 22:43:25 GMT
expires: Tue, 24 Jul 2018 22:43:25 GMT
server: UploadServer
status: 200
x-guploader-uploadid: xxx-xxx

尽管看起来很愚蠢，但这似乎是一个大小写敏感问题。

- Archonic

---

由于这是“rails gcs cors”问题的第一个搜索结果，我想说一下，在指南https://guides.rubyonrails.org/active_storage_overview.html#example-google-cloud-storage-cors-configuration中的示例文件与OP的不同。 - hungmi

Answer 1

如果有人仍然遇到这个问题，那么CORS配置缺少Origin和Content-Disposition响应头。至少对我来说是这样的。

因此，配置应该如下：

[
  {
    "origin": ["https://www.example.com"],
    "method": ["PUT"],
    "responseHeader": ["Origin", "Content-Type", "Content-MD5", "Content-Disposition"],
    "maxAgeSeconds": 3600
  }
]

来源：https://guides.rubyonrails.org/active_storage_overview.html#example-google-cloud-storage-cors-configuration

这篇文章介绍了如何在Rails应用中使用Google Cloud Storage，以及如何配置跨域资源共享（CORS）以便让浏览器能够安全地从不同的域名上加载资源。在这个例子中，我们需要创建一个JSON文件，并将其上传到Google Cloud Storage中。然后，我们需要配置CORS规则以允许其他站点访问存储桶中的资源。

- elvinas

Answer 2

原来我从Rails中复制出来的direct_uploads_controller.js文件版本存在许多与浏览器和服务兼容性相关的问题。我复制了该文件夹中的所有文件并安装了缺失的spark-md5包，现在一切都正常了： https://github.com/rails/rails/tree/master/activestorage/app/javascript/activestorage 我测试过的提交是372dda2a2950ad3ae5cf744ed8e3caa69a7ed44b。

- Archonic

Answer 3

你是否正在使用字面量：

"https://subdomain.example.com",
"https://example.com",
"https://*.example.com"

是否有来源？如果是这样，那可能就是问题所在。你很可能没有从任何这些域中调用你的 gs bucket。你应该拥有从中调用它的域名，包括本地主机：端口（如果从那里进行测试）。

- loop

---

不是字面上的意思。我正在使用一个真实的域名。虽然我已经尝试了每个迭代，但现在我只有https://subdomain.example.com（相当于这个）与请求中的来源和浏览器控制台中的`location.origin`完全匹配。 - Archonic