Cross Origin Resource Sharing (CORS) Blocked for Cloudfront

Cross Origin Resource Sharing (CORS) Blocked for Cloudfront

Cross Origin Resource Sharing is a very common issue faced.

You will usually get the message like the following.

Font from origin ‘https://k3j3jd3k2j.cloudfront.net’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘https://www.mervcodes.com’ is therefore not allowed access.

There are two ways to resolve this issue.

Solution 1: S3 Bucket Way

This is the most common solution, which is to set the CORS header in your S3 bucket.

http://docs.aws.amazon.com/AmazonS3/latest/dev/cors.html

 

Solution 2: DNS Way

Step 1

Create a subdomain like

instead of using

Step 2

Create a CNAME record that points

to

 

That’s it. You are done!

Leave a Reply

Your email address will not be published. Required fields are marked *

nineteen + 11 =