jahed.dev

Setting Up CORS for Firebase Storage

Firebase Storage needs CORS permissions set up if you ever want to use XHR or Fetch APIs in the browser to request files from it. However, this isn't easily available via Firebase's web interface. Instead, configuration needs to be done via the Google Cloud SDK and gsutil.

To make things easier, use Google's Web Shell which has everything installed and configured.

  1. Go to https://ssh.cloud.google.com/cloudshell/editor
  2. Choose the correct project.
  3. Create a cors.json file with the following (change as needed):
[
  {
    "origin": ["https://yourdomain.com"],
    "method": ["HEAD", "GET"],
    "maxAgeSeconds": 3600
  }
]
  1. Run the following (change PROJECT_ID as needed):
gsutil cors set cors.json gs://PROJECT_ID.appspot.com

That's about it. It's strange that Firebase doesn't have this process available on its web interface. Maybe it will, one day.

Thanks for reading.