Setting Up CORS for Firebase Storage

When working with Firebase Storage, you may need to configure Cross-Origin Resource Sharing (CORS) to allow web applications from different origins to access your resources. Here’s a quick guide on how to set it up.

Setup CORS for Firebase Storage: Step-by-Step Guide

Follow the step by step instructions to apply CORS policy on Firebase storage.

Step 1: Install gsutil

First, you need to install the gsutil tool. This tool helps you manage your Google Cloud Storage. You can download and install it by following the instructions on Google Cloud’s official page.

Step 2: Log In with Your Credentials

After installing gsutil, you need to log in with your Google Cloud credentials. Open your command line interface and enter the following command:

gcloud auth login

Follow the prompts to complete the login process.

Step 3: Create the CORS Configuration File

Next, you need to create a configuration file named cors.json on your computer. Save the following content into the file:

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

This configuration allows any origin (“*”) to send GET requests to your storage bucket, with a maximum age of 3600 seconds for the preflight request.

If you like to restrict access to specific domain use JSON like below:

[
  {
    "origin": ["https://example.com"],
    "method": ["GET"],
    "maxAgeSeconds": 3600
  }
]

Save file and close it.

Step 4: Apply the CORS Configuration

Finally, you need to apply this CORS configuration to your Google Cloud Storage bucket. Use the following command, replacing <your-cloud-storage-bucket> with the name of your bucket:

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

Make sure to run this command in the directory where you saved your cors.json file.

By following these steps, you will enable CORS for your Firebase Storage, allowing your web applications to access the resources without any issues.