CORS with Amazon S3 and CloudFront

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 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.