2

I am getting an error that I cannot find a fix for. I am sending a fetch of a CORS resource from Google Cloud Storage, but when I send WITHOUT the range request, it works. But if I add the range request, it fails. What can go wrong?

fetch("https://storage.googleapis.com/bucket/abc.pdf", {
  "headers": {
    "range": "bytes=24772608-24832146"
  },
  "referrer": "http://localhost:8000/",
  "referrerPolicy": "strict-origin-when-cross-origin",
  "body": null,
  "method": "GET",
  "mode": "cors",
  "credentials": "omit"
});

Notice the range in the headers that is causing the issue.

Here is my Google Storage CORS configuration:

[{"origin": ["*"],"responseHeader": ["Content-Type", "Accept-Ranges", "Content-Range", "Content-Encoding", "Content-Length","Access-Control-Allow-Origin"],"method": ["GET", "HEAD", "OPTIONS"],"maxAgeSeconds": 3600}]

Google Cloud Storage supports range requests but its not clear how to configure it.

dickyj
  • 1,830
  • 1
  • 24
  • 41
  • What’s the exact error message that the browser is logging in the devtools console? – sideshowbarker Dec 11 '20 at 08:02
  • Access to fetch at 'https://storage.googleapis.com/bucket/abc.pdf' from origin 'https://amiusing.httptoolkit.tech' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. – dickyj Dec 11 '20 at 08:20

1 Answers1

3

Turns out I am missing the Range in the CORS JSON. Such a trivial issue, wished Google has given better documentation.

[{"origin": ["*"],"responseHeader": ["Content-Type", "Accept-Ranges", "Content-Range", "Content-Encoding", "Content-Length","Access-Control-Allow-Origin","Access-Control-Allow-Methods","Range"],"method": ["GET", "HEAD", "OPTIONS"],"maxAgeSeconds": 3600}]
dickyj
  • 1,830
  • 1
  • 24
  • 41