Hosting a Static Website on S3 Bucket and Restricting Access to objects using CloudFront
Introduction
CloudFront is a highly efficient and reliable content delivery service that ensures data is delivered at exceptional speeds while maintaining a strong focus on security and protection against various threats. By leveraging cutting-edge technologies and integration capabilities, CloudFront offers a seamless experience for users and helps guarantee the availability of the CIA Triad: confidentiality, integrity, and availability.
CloudFront seamlessly works with other Amazon Web Services, including Amazon EC2, Amazon S3, and elastic load balancing, to provide a comprehensive and unified solution. This integration allows for the delivery of content in a secure manner, ensuring that users receive their data reliably and quickly.
To further enhance security, CloudFront offers multiple options for securely delivering content over the internet. Signed URLs or cookies can be used to serve specific users, while the origin access identity (OAI) feature provides a secure approach for protecting Amazon S3 content. Integration with an application load balancer and elastic load balancing ensures secure access to applications, and AWS WAF web ACLs allow content access restrictions based on specified conditions. Additionally, CloudFront offers geo-restriction capabilities, enabling content delivery to users from specific locations.
Lab Objective
The purpose of this lab is to showcase the process of utilizing CloudFront to control and limit access to S3 content.
Note: Before beginning this lab, it is recommended that you create an AWS Free Tier account, if you haven't already done so.
Learn how to ensure the security of your Free Tier Account by referring to this comprehensive guide.
Disclaimer
Please note that the AWS management console is subject to change over time. While the instructions provided are accurate at the time of writing, there may be updates or modifications to the console's interface or functionality. It is advisable to refer to the official AWS documentation for the most up-to-date and accurate information regarding the AWS management console.
Lab Task
Creating a static website on S3
Once you are signed in, start by creating an S3 bucket.
- On your AWS Management Console, click on Services at the top menu and search for S3 under Storage.
- On the Amazon S3 page, Click on Create Bucket.
- On the General Configuration section, give a bucket name (for this lab: “d3m0-website”) and choose an AWS Region (us-east-2).
- Under Object Ownership, Retain the default settings.
- Retain the other default settings. Scroll down to the bottom and click on Create Bucket.
- The bucket name “d3m0-website” was successfully created. The next thing is to create an object inside the S3 bucket and click on the d3m0-website bucket.
NOTE: Please ensure that you create an HTML file using VSCODE or any IDE of your choice and save it before uploading any files to the bucket.
⇒ Copy the code to VS code or Notepad and Save it as index.html
<!DOCTYPE html>
<html>
<body>
<h1>My First Website</h1>
<p>Welcome to d3m0-website !!</p>
<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">
</body>
</html>
On the d3m0-website bucket page, click on the Upload button under Objects to upload your created index.html file.
On the Upload Section page, click on Add Files and select your index.html file
Once the file is prepared for uploading, simply scroll down and select the Upload button.
Once the file is done uploading, click on index.html to see its details.
To access the file, simply copy the Object URL from the Object overview and paste it into a new browser tab.
The object (index.html) file in the bucket is not configured for public access, so you will receive an Access Denied Message.
Granting specific users permission via the CloudFront-generated URL address.
Next, you will enable access to the index.html page exclusively through CloudFront by granting specific users permission via the CloudFront-generated URL address.
- On your AWS management console, Click on Services and search for CloudFront under Networking and Content Delivery.
- Upon opening the CloudFront dashboard, click on "Create a CloudFront Distribution.”
- Now, configure the origin access identity (OAI) to set up access to the data. Under Origin on the Create Distribution page, select Origin Domain as the Amazon S3 bucket name.
- To enable access for Origins, choose the Legacy access identities option from the radio button, and then For Origin Access Identity, click on the button Create new OAI.
- Clicking on "Create" will generate a pop-up window for creating a new Origin Access Identity (OAI) with the specified name. Click Create.
- Now, to update the Bucket policy to grant read access to the OAI, select the radio button Yes, update the bucket policy.
- Under the Web Application Firewall (WAF) section, check the radio button “Do not enable security protections.”
- Next, retain all other default settings and click on Create Distribution.
- Now, the Distribution domain has successfully been created.
- Navigate to the Menu pane on the left-hand side and click on Distribution to know the status. Wait for a few minutes to complete the deployment if yours isn’t enabled.
- Click on the distribution ID to view the distribution details.
- Copy the domain name of the created S3 bucket's Distribution, which can be shared with the intended user to grant them access to objects.
- Open a new tab on your browser ****and paste the copied URL (https://ddbdipx899itu.cloudfront.net/), add /index.html to the copied URL (https://ddbdipx899itu.cloudfront.net/index.html), and then press Enter.
- Now, any user with the URL can view the content of the S3 object.
By utilizing AWS CloudFront with OAI configuration, a cloud security engineer can limit access to S3 content and ensure that it is only accessible to specific users.
Deleting Created Resources
Please make sure to delete, shut down, or terminate all resources created and utilized in this lab to avoid incurring any charges.
Please proceed with deleting the instances that were created in this lab. Go to CloudFront's "Distributions" section and choose the checkbox associated with the lab's creation. Then, click on the "Disable" button. In the ensuing pop-up window, click on the "Disable" button once again.
Still, in CloudFront's "Distributions" section, choose the checkbox associated with the lab's creation. Then, click on the "Delete" button. In the ensuing pop-up window, click on the "Delete" button once again.
In Amazon S3, go to the Buckets section and locate the specific bucket created for this lab (for this lab, d3m0-website). Select the checkbox next to it. To empty the bucket before deleting it, click on the Empty button. In the pop-up window, enter "permanently delete" and click the Empty button.
- Go to Amazon S3's Buckets section and check the box corresponding to the instance created in this lab (d3m0-website). Proceed by clicking the Delete button. In the window that appears, provide the bucket's name and select the Delete bucket button.
Lab Conclusion and a Light-hearted Joke
In conclusion, this lab has provided a comprehensive understanding of hosting a static website on an S3 bucket and effectively restricting access to objects using CloudFront. By implementing CloudFront's features, such as signed URLs and cookies, origin access identity, and AWS WAF web ACLs, we can ensure secure content delivery and controlled access to our website.
Remember, while it's important to take security seriously, a little humor never hurts. So, here's a light-hearted joke to wrap things up:
Why did the web developer go broke?
Because they lost their domain in a bet! 😄😄😄