Let's Serve a Static Website Over HTTPS
Last updated
Last updated
As an IAM User sign in to AWS Management Console.
Go to Route 53 Dashboard.
Select Hosted zones.
Click Create hosted zone.
Fill in Domain name input with your domain name.
Click Create hosted zone.
Update Nameservers values of your domain on the DNS registrar of your choice (record of type NS, make sure addresses contain periods at ends).
Take a break and use DNS checker to check how is DNS propagation going.
Go to AWS Certificate Manager Dashboard, make sure the N.Virginia region is selected (CloudFront requires certificates created in this region).
Click Request.
Select Request a public certificate and click Next.
Fill in Fully qualified domain name input with your domain name.
Leave DNS validation - recommended selected and click Request.
A record of type CNAME will be added to your hosted zone. It's a type of record that maps one domain name to another.
Go to Amazon S3 Dashboard.
Click Create bucket.
Fill in Bucket name input with a unique name, this bucket will store static files of your website.
Select desired AWS Region.
Leave the rest defaults selected and click Create bucket.
Upload a simple index.html file to the bucket, an example you can find here.
Proceed to create another bucket, this one will be used to store logs.
Fill in Bucket name and select AWS Region.
This time, select ACLs enabled.
Leave the rest defaults selected and click Create bucket.
S3 ACL (access control list) is a legacy access control mechanism. It defines which AWS accounts or groups are granted access and the type of access. As a general rule, AWS recommends using S3 bucket policies or IAM policies for access control.
Go to Amazon CloudFront Dashboard.
Click Create distribution.
As Origin domain, select your S3 bucket's domain.
Select Yes use OAI.
Click Create new OAI and Create.
Select Yes, update the bucket policy.
Select Redirect HTTP to HTTPS.
Under Alternate domain name (CNAME) - optional, click Add item and fill in input with your domain name.
In Custom SSL certificate - optional, select your SSL certificate created with AWS Certificate Manager.
Type index.html in Default root object - optional input.
Select On under Standard logging and select your S3 bucket.
Leave the rest defaults selected and click Create distribution.
CloudFront distribution needs a few minutes to be deployed.
OAI stands for Origin Access Identity is a special CloudFront user, when using OAI only CloudFront can access files in your bucket. Go to your origin bucket and see the bucket's policy.
Check the ACL of your logs bucket. Read and Write access has been granted to the AWS account with ID c4c1ede66af53448b93c283ce9448c4ba468c9432aa01d700d3878632f77d2d0
it's the awslogsdelivery account,
Go to Route 53 Dashboard and details of your hosted zone.
Click Create record.
Select Record type A and switch on Alias.
In Route traffic to select Alias to CloudFront distribution.
Select your distribution.
Click Create records.
The A record type is the most fundamental type of DNS record. It indicates the IP address of a given domain. Amazon Route 53 alias record is a Route 53-specific extension to DNS functionality. It lets you route traffic to selected AWS resources, such as CloudFront distribution in our case.
Wait a couple of minutes and try to visit your domain in a web browser. You should see your index.html page.
If you try to visit a page that doesn't exist on your site you will see an ugly 403 XML error. Let's add a simple 404 page. You can find an example here.
Upload a 404.html file to your origin S3 bucket.
Go to Amazon CloudFront Dashboard and details of your distribution.
Select Error pages tab.
Click Create custom error response.
In HTTP error code, select 403: Forbidden.
Select Yes under Customize error response.
Type /404.html in Response page path.
Select 404: Not Found under HTTP Response code.
Click Create custom error response.
404 page should be returned instead of the ugly 403 XML once changes are deployed.