CODEWITHSUNDEEP
amazon-web-servicesamazon-s3corsamazon-cloudfront
Rohit Hazra
Rohit Hazra

Reputation: 667

CORS issue even with origin policies

I have some fonts hosted on AWS Cloudfront behind a custom domain.
I have this as s3 CORS policy 

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
    <CORSRule>
        <AllowedOrigin>*.dabster.io</AllowedOrigin>
        <AllowedOrigin>dabster.io</AllowedOrigin>
        <AllowedMethod>GET</AllowedMethod>
        <AllowedMethod>HEAD</AllowedMethod>
        <MaxAgeSeconds>3000</MaxAgeSeconds>
        <AllowedHeader>*</AllowedHeader>
    </CORSRule>
</CORSConfiguration>

on Cloudfront Behaviours I have following settings

The error I am getting is

Access to Font at 'https://cdn.dabster.io/assets/fonts/fontawesome-webfont.ttf?v=4.7.0' from origin 'https://dabster.io' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://dabster.io' is therefore not allowed access.

You can see the error at https://dabster.io and https://www.dabster.io

curl -I -s -X GET -H "Origin: dabster.io" https://cdn.dabster.io/assets/fonts/fontawesome-webfont.ttf\?v\=4.7.0                                 

HTTP/1.1 200 OK
Content-Type: application/octet-stream
Content-Length: 165548
Connection: keep-alive
Date: Sun, 07 May 2017 09:26:57 GMT
Access-Control-Allow-Origin: dabster.io
Access-Control-Allow-Methods: GET, HEAD
Access-Control-Max-Age: 3000
Access-Control-Allow-Credentials: true
Last-Modified: Fri, 05 May 2017 14:04:16 GMT
ETag: "b06871f281fee6b241d60582ae9369b9"
Accept-Ranges: bytes
Server: AmazonS3
Vary: Origin,Access-Control-Request-Headers,Access-Control-Request-Method
X-Cache: Miss from cloudfront
Via: 1.1 d674762e43fd40650eec6e201e4316a2.cloudfront.net (CloudFront)
X-Amz-Cf-Id: JYxW4fs2Ijgt_wEnl-DQ6Yqz_qPYbwaWZSZyRjrnKQ_yje__n3skkA==

I am also getting the headers in the response. Please shed some light on this

Upvotes: 0

Views: 604

Answers (1)

sideshowbarker
sideshowbarker

Reputation: 88066

An origin value must include a protocol part—https:// or http://. So you need to do this:

<AllowedOrigin>https://dabster.io</AllowedOrigin>

The reason your curl test works is that you’re sending the Origin header with no protocol part.

But browsers send an Origin header with the protocol part; e.g., Origin: https://dabster.io.

So as you currently have things configured, your curl test will fail too if you include the protocol:

curl -I -s -X GET -H "Origin: https://dabster.io" \
  https://cdn.dabster.io/assets/fonts/fontawesome-webfont.ttf\?v\=4.7.0

Upvotes: 3

Related Questions