Setting the bucket CORS header

Some read operations require the client's domain to be whitelisted by a CORS header. We add authorized domains to cors.json and send it to Google through the CLI:

cors.json

[
    {
        "origin": ["https://imagetales.io", "http://localhost:5173"],
        "method": ["GET"],
        "maxAgeSeconds": 3600
    }
]

Register cors.json:

gcloud storage buckets update gs://abc.firebasestorage.app --cors-file=cors.json

(Debug) Describe the existing bucket CORS config:

gcloud storage buckets describe gs://abc.firebasestorage.app --format="default(cors_config)"

read operations that require a CORS whitelist

Browser reads relying on background fetch rather than navigating to the URL require a CORS whitelist:

  • getBlob(fileRef) to get a Blob, which uses fetch() under the hood.
  • getBytes(fileRef) to get an ArrayBuffer, which uses fetch() under the hood.
  • using fetch() manually with a bearer (tokenized) URL.
earlymorning logo

© Antoine Weber 2026 - All rights reserved

Setting the bucket CORS header

Some read operations require the client's domain to be whitelisted by a CORS header. We add authorized domains to cors.json and send it to Google through the CLI:

cors.json

[
    {
        "origin": ["https://imagetales.io", "http://localhost:5173"],
        "method": ["GET"],
        "maxAgeSeconds": 3600
    }
]

Register cors.json:

gcloud storage buckets update gs://abc.firebasestorage.app --cors-file=cors.json

(Debug) Describe the existing bucket CORS config:

gcloud storage buckets describe gs://abc.firebasestorage.app --format="default(cors_config)"

read operations that require a CORS whitelist

Browser reads relying on background fetch rather than navigating to the URL require a CORS whitelist:

  • getBlob(fileRef) to get a Blob, which uses fetch() under the hood.
  • getBytes(fileRef) to get an ArrayBuffer, which uses fetch() under the hood.
  • using fetch() manually with a bearer (tokenized) URL.