Firebase存储和允许访问控制的来源

86

我正在尝试通过XMLHttpRequest从Firebase存储下载文件，但是未在资源上设置Access-Control-Allow-Origin，因此是不可能的。有什么方法可以在存储服务器上设置此标头？

  (let [xhr (js/XMLHttpRequest.)]
    (.open xhr "GET" url)
    (aset xhr "responseType" "arraybuffer")
    (aset xhr "onload" #(js/console.log "bin" (.-response xhr)))
    (.send xhr)))

Chrome错误消息：

XMLHttpRequest无法加载 https://firebasestorage.googleapis.com/[EDITED] 所请求的资源上没有“ Access-Control-Allow-Origin”标头。因此，不允许访问源' http：// localhost：3449 '。

— 布莱克萨德
source

1

没有足够的代表发表评论，但是上述方法仍然是正确的方法。只是想分享这一个官方的火力文档：firebase.google.com/docs/storage/web/...

— 安德鲁McOlash

171

在关于Firebase-talk组/列表的这篇文章中：

为CORS配置数据的最简单方法是使用gsutil命令行工具。有关安装说明，gsutil请访问https://cloud.google.com/storage/docs/gsutil_install。安装gsutil并通过身份验证后，就可以使用它来配置CORS。

例如，如果您只想允许从自定义域下载对象，请将此数据放在名为cors.json的文件中（替换"https://example.com"为您的域）：
[
  {
    "origin": ["https://example.com"],
    "method": ["GET"],
    "maxAgeSeconds": 3600
  }
]
然后，运行以下命令（替换"exampleproject.appspot.com"为存储桶的名称）：
gsutil cors set cors.json gs://exampleproject.appspot.com
并且你应该被设置。

如果您需要更复杂的CORS配置，请访问https://cloud.google.com/storage/docs/cross-origin#Configuring-CORS-on-a-Bucket上的文档。

— 弗兰克·范普菲伦
source

5

有没有办法允许所有类似于Access-Control-Allow-Origin的来源：*？

— dooderson '16

5

如何找到我的Firebase存储桶的确切名称？

— 吉姆（Jim）

11

@ user1311069仅使用"origin": ["*"],代替"origin": ["https://example.com"],

— rigdonmr

8

Firebase确实需要找出一种用户友好的方式来执行此操作。在实际的Firebase数据库上设置权限几乎不会令人沮丧，也不会设置S3存储桶权限。在这一点上，强烈希望使用S3。

— 马特·詹森

43

如果您不想安装该实用程序，一种简便的方法是转到console.cloud.google.com/home，然后单击右上角的“激活Google Cloud Shell”。这将打开一个已安装gsutil的外壳，并可以访问您的Firebase存储项目。（在shell中，我使用pico创建了一个json，然后gsutil cors set myjson.json gs://projectname.appspot.com如上所述进行了操作）

— Eindbaas

46

Google Cloud现在具有一个内联编辑器，可以使此过程更加轻松。无需在本地系统上安装任何东西。

单击顶部导航栏中的图标按钮，打开GCP控制台并启动云终端会话>_。
单击铅笔图标以打开编辑器，然后创建cors.json文件。
跑 gsutil cors set cors.json gs://your-bucket

— 杰夫·D23
source

卡在第1步。请解释“并开始云终端会话”，我打开控制台，看不到任何按钮，或链接到“开始云终端会话”

— fortesl

3

这是右上角导航中的图标，看起来像是>_

— JeffD23 '19

是否有一种直接的方法可以在需要时先拉现有的cors配置以进行还原？

— David

我试过了，但是没用。

— user683742

18

只想添加到答案。只需在Google控制台（console.cloud.google.com/home）中转到您的项目，然后选择您的项目即可。在那里打开终端，仅创建cors.json文件（touch cors.json），然后按照答案进行操作并按照vim cors.json@ frank-van-puffelen的建议编辑此文件（）

这对我有用。干杯!

— 阿卡什
source

位于console.cloud.google.com/home的网络控制台给我一个错误，但可以与Google Cloud SDK Shell一起正常工作。

— FiringBlanks

3

...打开终端，然后...如何打开终端？我在链接上没有看到“打开终端”按钮

— fortesl

确保您使用的是cloud子域，而不是子域firebase（“ console.cloud.google.com/home”），然后>_在右上角查找图标按钮。

— 克里斯·维拉

1

另一种方法是使用Google JSON API。第1步：获取用于JSON API的访问令牌要获取令牌，请访问：https : //developers.google.com/oauthplayground/ 然后搜索JSON API或存储选择所需的选项，例如read，write，full_access（勾选那些这是必需的），请按照以下过程获取访问令牌，该令牌将在一个小时内有效。第2步：使用令牌访问Google JSON API以更新CORS

样品卷曲：

    curl -X PATCH \
  'https://www.googleapis.com/storage/v1/b/your_bucket_id?fields=cors' \
  -H 'Accept: application/json' \
  -H 'Accept-Encoding: gzip, deflate' \
  -H 'Authorization: Bearer ya29.GltIB3rTqQ2tJgh0cMj1SEa1UgQNJnTMXUjMlMIRGG-mBCbiUO0wqdDuEpnPD6cbkcr1CuLItuhaNCTJYhv2ZKjK7yqyIHNgkCBup-T8Z1B1RiBrCgcgliHOGFDz' \
  -H 'Content-Type: application/json' \
  -H 'Postman-Token: d19f29ed-2e80-4c34-85ee-c46c9058fac0' \
  -H 'cache-control: no-cache' \
  -d '{
  "location": "us",
  "storageClass": "Standard",
  "cors": [
      {
          "maxAgeSeconds": "360000000",
          "method": [
             "GET",
             "HEAD",
             "DELETE"
          ],
          "origin": [
             "*"
          ],
          "responseHeader":[
            "Content-Type"
         ]
      }
  ]
}'

— 尼梅什·马克瓦纳
source

0

我想补充那些急需解决方案的人，就像我尝试了所有这些而不解决问题之后一样。我在网上找到了一篇很棒的文章，提供了3种解决方案，第一个对我有用。.一个Google chrome插件..是的！

moesif CORS扩展名确保安装后将其打开

— 罗兰多·纽伯（RolandoNiubó）
source

2

对于真正的未知用户而言，这并不能真正解决问题，仅适用于一台机器。

— 元素

0

访问与CORS头应用的任何资源，你可以使用一个小项目，我在做Golang为自己- https://proxify-cors.herokuapp.com/

— 罗什内特
source