Deploy Static Website Using s3 RestAPI & Cloudfront — Without Making S3 Bucket Public
Before we begin, please understand the difference between deploying a static website via s3 website Endpoint and via s3 RestAPI.
Here are the Key differences between a website endpoint and a REST API endpoint served by a CloudFront Distribution
In addition, AWS has a cloudformation template to deploy a static site via s3 website Endpoint and a manual step by step explanation of deploying it. You can find these details here.
I didn’t find any article that will help me in deploying a static website WITHOUT making the s3 bucket PUBLIC which is the goal of this article. By following these steps, your users can ONLY access the files through CloudFront distribution, not directly from the S3 bucket. You can find a link to get into details of this configuration here.
Here are the steps recommended by AWS and how they differ between both the configurations.
✅ No change required ❌ Configuration change required
I have summarized all these steps to just 4 BUT adding a detailed Cloudfront configuration screenshots in Step 3.
Configuration Process Flow
Step 1:
Create a s3 bucket with the desired subdomain name or root domain name as the bucket name. E.g. testsite.example.com or example.com
Step 2:
Upload static content with index.html at the root. i.e. testsite.example.com/index.html
Step 3:
Create a cloudfront distribution with the following configuration. your Amazon S3 RestAPI endpoint follows the below formats.
{bucket-name}.s3.amazonaws.com
Step I:
Step II:
Step III:
Step IV:
Step 4:
Configure your DNS to redirect traffic to cloudfront distribution.
ref:
