Introduction
In this article, we’ll explore how to securely host a static website on a private Amazon S3 bucket using Amazon CloudFront with Origin Access Control (OAC). By following these steps, you can ensure that your website content is accessible only through authorized channels while benefiting from the performance and scalability of CloudFront.
Prerequisites
To follow through with this article you need to meet the following requirements
- You should have registered an AWS Account
- Static website files to be uploaded (HTML, CSS, JavaScript)
Table of contents
- Amazon S3
- Amazon CloudFront
- Creating an Amazon S3 Bucket
- Uploading Static Website Files
- Setting Up CloudFront and OAC
- Testing Your Setup
- Conclusion
Amazon S3
Amazon Simple Storage Service (Amazon S3) is an object storage service used to store and retrieve any type data i.e text files, video files etc.
Amazon CloudFront
Amazon CloudFront is an Amazon web service that speeds up the distribution of your static and dynamic web contents securely using a content delivery network (CDN). CloudFront ensures your web contents are accessible globally by caching them in edge locations.
Creating an Amazon S3 Bucket
- Log in to your AWS Management Console. Navigate to the S3 service.
- Click
Create bucket
and enter a unique bucket name - Scroll down and click
Create bucket
Leave other settings as default. By default your bucket is set to private
Uploading Static Website Files
Upload your static website files to the S3 bucket.
This is all we are doing here for now
Setting Up CloudFront and OAC
Go to the CloudFront service in the AWS Management Console.
Click
Create a CloudFront distribution
Choose your s3 bucket name from the origin domain
pop up.
- Since our bucket is private we need a way to access it privately using CloudFront distribution. To achieve this we need to create an Origin Access Control (OAC) which is a newer way to establish secure connection. Unlike Origin Access Identity (OAI) which is an older way to connect CloudFront distribution to S3, Amazon CloudFront introduces Origin Access Control (OAC) which provides more functionality like signed requests, supports accessing S3 in all AWS regions which includes currently existing and future regions and more features.
You can choose to enable WAF which adds another layer of security to incoming traffic going to your CloudFront distribution
But since this is a temporal deployment you can go with the second option
Now scroll down and click on Create distribution
Copy Policy generated by CloudFront OAC
Let’s go back to our S3 bucket permission to paste our generated policy
Paste policy and save changes
Testing your setup
Go back to your CloudFront to copy your Distribution domain name
Paste on your browser
- Verify that your content is served securely via CloudFront.
Conclusion
In conclusion, by following the steps outlined in this guide, you’ve successfully set up a secure and efficient hosting environment for your static website using Amazon S3, CloudFront, and Origin Access Control (OAC). Your website content is now accessible only through authorized channels, ensuring both security and scalability.
That’s all for now, I hope you found this helpful 🙂
Let’s connect on LinkedIn
Top comments (0)