Sentinel AWS CORS Error

I am developing a little library and probably an app to download/process Sentinel-2 data from AWS from within browsers. It seems that I can not make any Range requests to the server. I get a CORS error. Example code:

let res = fetch(
  'https://sentinel-s2-l1c.s3.amazonaws.com/tiles/32/U/MA/2017/4/30/0/B01.jp2',
  {
    method: 'GET',
    mode: 'cors',
    headers: {
      Range: 'bytes=0-100'
    }
});

Any chance that you will enable Range requests on AWS? I did a little research and as far as I understand you might need to enable “access-control-allow-headers:Range”.

Thank you, Jan

Hi Jan,

Should be working now.

Thanks a lot Primoz, range requests do work now!

Just one other tiny thing: I am doing a HEAD request to get the content-length of the image. That seems to be disabled as well:

Access-Control-Allow-Headers Content-Length
Access-Control-Expose-Headers Content-Length

GET was the only request that had CORS response headers. I’ve added HEAD aswell. It should work now.

Hi Primoz,

Thanks, but I still get this error:

Refused to get unsafe header "Content-Length"
200 "image/jp2" null

Any idea?

Test: (fetch does not work either - seems fetch does not expose content-length at all)

let req = new XMLHttpRequest();
    req.onload = () => {
      if (req.status === 200) {
        console.log(
          req.status,
          req.getResponseHeader('Content-Type'),
          req.getResponseHeader('Content-Length')
        )
      } else {
        console.log(req.status);
      }
    };
req.open('HEAD', 'https://sentinel-s2-l1c.s3.amazonaws.com/tiles/32/U/MA/2017/4/30/0/B01.jp2');
req.send();

Sorry to keep bugging you with this issue. I did some research and it seems that for s3 you need to explicitly allow “Content-Length” e.g.

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin><!-- insert your origin here --></AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedHeader>Range</AllowedHeader>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <ExposeHeader>Accept-Ranges</ExposeHeader>
        <ExposeHeader>Content-Range</ExposeHeader>
        <ExposeHeader>Content-Encoding</ExposeHeader>
        <ExposeHeader>Content-Length</ExposeHeader>
        <AllowedHeader>Authorization</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

source: https://github.com/mozilla/pdf.js/issues/4530

I can get “content-length” with a http.request in node.js but no chance in the browser.

Hi Jan,
I’ve explicitly exposed the content-length header for HEAD requests and tested it. Should work now.

:ok_hand: Does work now!