Serve your website's static content from S3 through CloudFront.

To reduce the traffic from your webserver, you can serve your static content from S3 by using CloudFront.

Service Requirement:

• S3
• CloudFront

S3 bucket creation and configuration:
Create a S3 bucket by providing a unique name and allowing the public access. Then go to the permission tab, edit the bucket policy, and allow the get object action. You can do it by using the policy generator tool.

Generate the policy and copy the policy.

Now use this policy in your bucket policy.

To mitigate the CORS error, you can allow Headers, Methods, Origins and Expose Headers.

Now upload your content in this bucket.

CloudFront distribution create and configuration:

Select your S3 in the origin domain field and choose ssl certificate from the from the drop-down list if you have. Then create the distribution.

Assign rule in the load balancer:

Finally, from the load balancer, redirect the static traffic to CloudFront and rest of traffic to web server.

Wrap up
In this blog, I try to show you how we can serve static content from S3 by using CloudFront. It will reduce your web server traffic, increase site performance, and reduce the cost.