0

When I try to fetch a file by url:

fetch("https://storage.googleapis.com/shopify-tiers-assets-prod-us-east1/rhvhv9lacvsynpxxexs6nrtgmzan?GoogleAccessId=assets-us-prod%40shopify-tiers.iam.gserviceaccount.com&Expires=1595464519&Signature=rq%2BfkjqmLrFfH%2B5E9Br2Sdcn2I3zBr7WP4Mp%2BofUJFxjR%2BoWrLgq3KwNkZJyqxcH5f4wKZftnTVnwC5bg7BAYU8yTMzEgLl3s6i0skSoTWvt90%2BmK20Ksyl%2BODm1VlUw8W8mKRSiQTraoOBmBxjV5Fs0cSg2Be3oGfYwF%2F1uedItQgXucmhyarfWS3YNUiUqbYXdplN9nEpHqcrrygyFK0e5lqOchQz0W2aW3lmfJ%2FcGozuMRpTNLiwuyT76m1A2DPqnmWchAKegTj4hcwuyMeZzWKsjFiQxTc3y4aKMlQmqqdfGmfzyQTX6B%2BKQ2sMnItsZHr9pwQg1lyMhXlTcwQ%3D%3D&response-content-disposition=attachment%3B+filename%3D%22bulk-23974576162.jsonl%22%3B+filename%2A%3DUTF-8%27%27bulk-23974576162.jsonl&response-content-type=application%2Fjsonl")

I get a CORS error:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://storage.goo...
(Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

I don't control the remote server, so I can't change the CORS settings.

I would like to be able to request this file from the client's browser. Is this possible? If I stick the URL in a browser, I can download the file with no issue. Does this mean I'm doing something wrong? How do I download this in simple javascript??

My code:

fetch(fetchUrl, { method: "GET", headers: {'Access-Control-Allow-Origin': '*'}})
.then(response => response.blob())
.then(blob => {console.log(loc, "response:", blob)})

Thanks!

furnaceX
  • 567
  • 2
  • 8
  • 15
  • 1
    This call has to be made by your back end. – lmarqs Jul 16 '20 at 01:00
  • @Evert I don't control the remote server, so can't change the Same Origin Policy. – furnaceX Jul 16 '20 at 01:12
  • 2
    So you can't make that call, unless you proxy your requests through a server-side component you do control. This is a browser security feature and cannot be circumvented otherwise. – Evert Jul 16 '20 at 01:15

0 Answers0