Getting CORS issue on wildcard CORS enabled gcs bucket with fetch

Viewed 619

I have a publicly available file stored in Google Cloud Storage and am having issues when retrieving the resource from a SPA using fetch. Lets say the bucket name is pub-bucket and the full resource URL is https://storage.googleapis.com/pub-bucket/v1/example.mid. I've enabled CORS using the following JSON config for the bucket

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

and yet I still receive the same CORS error Access to fetch at 'https://storage.googleapis.com/pub-bucket/v1/example.mid' from origin 'http://localhost:3001' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. I'm unsure if something is misconfigured as previously I was using DO Spaces with the same CORS config and never saw this issue. I've also tried expanding my CORS config with more options as mentioned in this answer but nothing changed.

1 Answers

It turns out this issue is due to Google not clearly defining which endpoints can be accessed using CORS. This URI version of the resource https://storage.googleapis.com/[YOUR-BUCKET]/[OBJECT-PATH] does not allow CORS access while https://[YOUR-BUCKET].storage.googleapis.com/[OBJECT-PATH] does.

Related