'Firebase Storage Access to fetch at '..' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource

For debugging purposes, I'm using the 'CORS Unblock' extension on chrome and I'm able to load without any CORS issues.

Solution 1:^[1]

To resolve this

Go to https://console.cloud.google.com and select the dashboard of the project that contains the firebase storage bucket.

On the top right, there will be a button named "Activate Cloud Shell", click on it, a terminal will open on the bottom of the page, and near the middle of the page there will be a button called "Open editor", click on it. From there you should see this:

Click on File, on the menu on top. New file. Call it cors.json, paste the following (from Firebase's documentation) and hit save.

[
  {
    "origin": ["*"],
    "method": ["GET"],
    "maxAgeSeconds": 3600
  }
]

Go to https://console.firebase.google.com/ and select "Storage" from the menu on the left, get your storage bucket url (it starts with gs://)

Then open the terminal again (Activate Shell Command) and paste

gsutil cors set cors.json gs://<your-cloud-storage-bucket>

In theory the error should be completely gone for that specified bucket.

Note, this would only apply to the storage bucket you entered, you can have CORS policies per project, as you can have multiple buckets per project. It's intuitive and flexible.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source
Solution 1	New-Way

'Firebase Storage Access to fetch at '..' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource

Solution 1:[1]

Sources

Related Questions

Solution 1:^[1]