CORS with Amazon S3 and CloudFront

We struggle to load fonts from CloudFront because of CORS.

CORS - Cross Origin Resource Sharing is a security measure to block macious scripts or resources loading from foreign domain origins. This security will become hurdle when want to load resources from Amazon CloudFront this is often encountered when we want to load fonts from CloudFront. Here are simple yet detailed steps to enable CORS on CloudFront.

S3

we need to enable origin header in S3 and to do that follow these steps.

  • open s3 and click on bucket properties, under "permissions" section you will see "Edit CORS Configuration"
  • open CORS Configuration and paste the following
            *
            GET
            3000
            Authorization
            Content-*
            Host
  • save it and you are done.
  • Here you can increase "MaxAgeSeconds" it defines the cache time in browser. Its better to have a greater value if you are serving static files those will not change often.

CloudFront

CloudFront will cache content from S3 bucket but we need to enable CORS headers to load fronts from it. And to do that, here are the steps to perform on CloudFront.

  • Open your CloudFront distribution and under "Behaviours", click on default behaviours and edit it.
  • Set "Forward Headers" to "whitelist"
  • enable "Origin" from "Whitelist Headers" by moving it to right side.
  • Save the settings and you are done with it, these settings will be reflected shorly based on the cache settings you had in S3 CORS Configuration.

Happy serving content with Amazon CloudFront.

Posted On 24 November 2012 By MicroPyramid


Need any Help in your Project?Let's Talk

Latest Comments
AWS Lambda - Best Practices

After Years of Developing Lambda Scripts from creating Serverless Applications to Pipelining your Tasks, Here are the Best Practices that we follow.

Continue Reading...
Autoscaling Application with AutoScaling Groups and AWS LoadBalancer

Autoscaling Application with AutoScaling Groups and AWS LoadBalancer

Continue Reading...
How to Build and verify an application using aws codepipeline and creating custom events with lambda

How to build and verify an application using aws codepipeline and creating custom events with lambda.

Continue Reading...
AWS tips and tricks to optimize cost and performance for better ROI

Best Practices of AWS cost and Performance Optimization

Continue Reading...
How to process message queuing system by amazon SQS

How to process attributes of message queuing system by amazon SQS using Boto3

Continue Reading...
Easy and Fast way to implement AWS Lambda service

We are going to use a simple application called Gordan to prevent creating a lambda function and triggering actions which involves time taking and repetitive …

Continue Reading...
How To Send And Receive Email With Django And Amazon SES

django-ses-gateway a pluggable Django application is used for sending mails from your verified domains and verified emails. We can also use django-ses-gateway for receiving messages …

Continue Reading...
Deploy Django using CloudFormation Template

CloudFormation helps in Using JSON templates to describe the resources needed from aws. With this approach, we don't have to repeat the same manual configuration …

Continue Reading...
How to Mount S3 Bucket on Local Disk

It all starts with FUSE, FUSE is File System User Space. Operating Systems have Kernel Space and User Space. Kernel Space is where low level …

Continue Reading...
Using AWS Lambda with S3 and DynamoDB

AWS lambda is handy tool for event driven computation, here we will learn how to configure and setup lambda function so to run our function …

Continue Reading...
How to access EC2 instance even if pem file is lost

Accessing the EC2 instance even if you loose the pem file is rather easy.

1. First, create a new instance by creating new access …

Continue Reading...
Deploying Django project on Elastic Beanstalk

Here You can learn about how to setup and deploy a Django application to Amazon Web Services (AWS).

Tools/technologies used:
Python v2.7
Django v1.7
Amazon …

Continue Reading...
how to setup custom domain for amazon cloudfront

We all want our own domain name to be setup for cloud front instead of amazon default cloud front domain name. We need two things …

Continue Reading...
Paginating S3 objects using boto3

When using Boto you can only List 1000 objects per request. So to obtain all the objects in the bucket. You can use s3's paginator.

Continue Reading...
Creating Elastic Search Cluster (EC2, cloud-aws Plugin)

While handling Large amounts of data with elasticsearch, you may run out of server capacity or compute power, Forming a Elasticsearch cluster will reduce the …

Continue Reading...
Configuring and Testing Load Balancer in AWS EC2

When You have an application that is serving Huge Customer Base, so will be your Traffic. Sometimes The Application simply stops responding. We can use …

Continue Reading...
Django Hosting on Amazon EC2 with wordpress on same domain

Configuring the Wordpress as subdirectory can be tricky. In this tutorial we will Setup a Django Website alongside a wordpress blog.

Continue Reading...
Amazon SES - Handling Bounces and Complaints

In general while sending emails, we will prepare some recipient addresses as our mailing list, which are valid and our recipients want and expect our …

Continue Reading...
Amazon AWS IAM Roles and Policies

When You want to Provide access to Amazon Web Services Console or if you're planning to provide REST API Keys to your Developers of a …

Continue Reading...
CORS with Amazon S3 and CloudFront

We struggle to load fonts from CloudFront because of CORS.

CORS - Cross Origin Resource Sharing is a security measure to block macious scripts or …

Continue Reading...

Subscribe To our news letter

Subscribe and Stay Updated about our Webinars, news and articles on Django, Python, Machine Learning, Amazon Web Services, DevOps, Salesforce, ReactJS, AngularJS, React Native.
* We don't provide your email contact details to any third parties