作者:rita | 来源:互联网 | 2023-07-28 20:26
我正在使用免费的 firebase 存储计划。一切正常,但图像没有加载到我的颤振网上。
我收到这个错误。
Access to XMLHttpRequest at 'https://firebasestorage.googleapis.com/v0/b/sap-app-8318e.appspot.com/o/cover%2Fimage_cropper_028D7F16-0161-4E90-B40D-EE47D310F322-5339-000003697F67306C.jpg?alt=media&token=313475a9-9728-4e61-97da-f5d5534bb008' from origin 'https://sap.nextcardpro.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
firebasestorage.googleapis.com/v0/b/sap-app-8318e.appspot.com/o/cover%2Fimage_cropper_028D7F16-0161-4E90-B40D-EE47D310F322-5339-000003697F67306C.jpg?alt=media&token=313475a9-9728-4e61-97da-f5d5534bb008:1
我在谷歌上搜索每个人都告诉需要允许来自 firebase 的 CORS 访问,但我怎么才能添加它。但是如何将其添加到我的免费 Firebase 计划中?
[
{
"origin": ["*"],
"responseHeader": ["Content-Type"],
"method": ["GET", "HEAD", "DELETE"],
"maxAgeSeconds": 3600
}
]
回答
最后,经过 2 天的谷歌搜索,通过这个帖子解决。
https://bitmovin.com/docs/encoding/faqs/how-do-i-set-up-cors-for-my-google-cloud-storage-bucket
Bravo! you saved my life. Thanks !
回答
从上面的链接回答:
如果您已经熟悉 Google Cloud 服务和工具,例如 gcloud 和/或 gsutil,您还可以查看 Google 关于 CORS 的文档。
登录您的谷歌云控制台:https : //console.cloud.google.com/home。点击右上角的“Activate Google Cloud Shell”(见下图):
在窗口底部,将显示一个 shell 终端,其中 gcloud 和 gsutil 已经可用。执行如下所示的命令。它会创建一个 json 文件,用于为您的存储桶设置 cors 配置。此配置将允许每个域在浏览器中使用 XHR-Requests 访问您的存储桶:echo '[{"origin": ["*"],"responseHeader": ["Content-Type"],"method": ["GET", "HEAD"],"maxAgeSeconds": 3600}]' > cors-config.json
如果您想限制访问一个或多个特定域,请将其 URL 添加到数组中,例如: echo '[{"origin": ["https://yourdomain.com"],"responseHeader": ["Content-Type"],"method": ["GET", "HEAD"],"maxAgeSeconds": 3600}]' > cors-config.json
YOUR_BUCKET_NAME
在以下命令中替换为您的实际存储桶名称以更新存储桶中的 cors-settingsgsutil cors set cors-config.json gs://YOUR_BUCKET_NAME
要检查一切是否按预期工作,您可以使用以下命令获取存储桶的 cors 设置: gsutil cors get gs://YOUR_BUCKET_NAME
您可以在项目 Firebase 控制台的存储面板中找到存储桶 ID:
Firebase 控制台的存储面板 以gs://
.开头的值。