Amazon S3 CORS Settings with CloudFront

If you are serving static content directly Amazon S3 via CloudFront (CDN) you should probably get an error about fonts, images or other static contents to deliver for your users. Actually, it’s not complicated. You can fix this issue on your Amazon S3 Bucket CORS settings.

What is Amazon S3 CORS?

Cross Origin Resource Sharing (aka CORS). The CORS specification gives you the ability to build web applications that make requests to domains other than the one which supplied the primary content.

Step 1: Open your Bucket Permission settings on AWS Web Console

Visit https://s3.console.aws.amazon.com page and sign in with your credentials to your S3 console and than, select your bucket which one is connected to your CloudFront.

Step 2: Apply CORS Configuration

In Permissions tab, you can see “CORS configuration” section. Please select this section and apply the code below:

<CORSConfiguration>
<CORSRule>
<AllowedOrigin>https://YOURWEBSITEADDRESS.com</AllowedOrigin>
<AllowedMethod>PUT</AllowedMethod>
<AllowedMethod>POST</AllowedMethod>
<AllowedHeader>*</AllowedHeader>
</CORSRule>
<CORSRule>
<AllowedOrigin>*</AllowedOrigin>
<AllowedMethod>GET</AllowedMethod>
</CORSRule>
</CORSConfiguration>

After the paste, change the <AllowedOrigin></AllowedOrigin> with your website address and click the “Save” button.

Conclusion

Hooray! Now, you have successfully set your CORS settings and now your users can able to view your content which one is located in your Amazon S3 Bucket.

Working as a DevOps. If you need anything, just contact me. Lover of; #linux #centos #debian #aws #gcp #terraform #automation #python #bash

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

A story of Understanding

Western Shooter Devblog #2 | Instantiating & Destroying Gameobjects in Unity

Mutation testing

Are there any issues on the horizon or areas that the Code should consider in the longer term?

Get control of your energy usage with Tibber and theirs GraphQL API

Abstractive Summarization Using Pytorch

ProForma Forms & Templates for Jira: What You Need to Know

Infinity Skies Claimpool and LP Farming Explained

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Ercan Ermis

Ercan Ermis

Working as a DevOps. If you need anything, just contact me. Lover of; #linux #centos #debian #aws #gcp #terraform #automation #python #bash

More from Medium

Make one EC2 instance unique in AWS Auto-Scaling Group

AWS Lambda with Real-world examples

How to Choose a Database on AWS?

Working in AWS: Creating Users and S3 Buckets