Is It Possible To Use A Download URL From GCS In JavaScript?

This new question is just because my old question was closed. So I can't even answer it.

Javascript fetch using a download URL from GCS

I seldom get into situation where I have to consider CORS so I forget about it. But here is what is happening.

  1. I get a download URL for a file on GCS, using fileRef.getDownloadURL().

  2. This URL works when opening it in a Chrome tab.

  3. However trying to use JavaScript fetch fails because of (bad) CORS.

  4. In principle this could be cured with gsutil cors set ... (see the question above).

  5. However because I am using the test environment (firebase serve, localhost) it does not seem possible to set a value for the origin in the request header that is accepted by gsutil.

So if someone knows a solution to 5 above I would be grateful. (I can use a workaround, of course, but I would prefer not.)

BTW, I tried to use the suggested proxy server, but it seems to be blocked here.

EDIT: I have also filed a bug report to Google. But it would be nice if I was wrong and this was not a bug in the interplay between Firebase local testing and GCS.



Your question is: How to fetch content from GCS using a Javascript script from client side.

The question is a duplicate, since this has already been answered here. Please take a moment to actually read the answers, you will see is the same issue you are facing. You have an alternative that you can use without having to modify the bucket's cors policy or fetching from server side:

  1. Using a Heroku proxy server (I have tried this one using the online demo and it worked for me)


  • This solution's implementation is shown on the question I refer at the beginning along with their explanation.
  • Be sure that the object you are trying to access is public.
  • You could also use the "{ mode: 'no-cors'}" and it will retrieve the content but you won't be able to access to it through the client script since the response will be "opaque".