Part V: How to distribute content using AWS CloudFront

5 min readMar 3, 2021

Using HTTPS with Cloudfront

Since AWS S3 does not support HTTP, it is better to distribute the content through CloudFront and use the public SSL certificate that can be created with the Certificate Manager.

Creating an OAI
Creating a distribution
Updating bucket policy in S3
Updating hosted zone
Testing the domain
Uploading files in S3

Creating an OAI

Navigate to the Cloudfront dashboard in the AWS console.

Click Origin access identity under Security in the sidebar and click Create OAI. An OAI is a virtual user who has permission to fetch the content from an S3 bucket and pass it on to the CloudFront distribution.

Type a comment and click Create

An Origin Access Identity will be created

Creating a distribution

Click Distributions from the sidebar

Click Create Distribution

Click Get Started

Origin domain name: Click on the text box. From the dropbox choose the S3 bucket name that needs distribution
Origin ID: This field will be filled automatically when the origin domain name is chosen
Restrict bucket access: Yes
Origin access identity: Use an Existing Identity
Your identities: Choose the identity created in the previous step
Grant Read Permissions on Bucket: Yes, Update Bucket Policy
Origin Connection Attempts and Timeout: Leave the default values in place

Viewer Protocol Policy: Redirect HTTP to HTTPS
Allowed HTTP Methods: GET, HEAD
Cache and smooth streaming: Leave the default values in place

Restrict viewer access: No
Compress objects automatically: Yes
Enable Real-time logs: No
Price class: Use All Edge Locations
Alternate domain names: Type your domain name. (For me, it is millastellan.com and on next line, it is www.millastellan.com)

SSL Certificate: Custom SSL Certificate
Click the text box. A dropdown box with the previously created certificate will show up. Choose it.
Custom SSL Client Support: Clients that support Server Name Indication (SNI) Recommended
Security Policy: Whichever is recommended. Here it is TSLv1.2_2019(recommended)

Supported HTTP Versions: HTTP/2, HTTP/1, HTTP/1.0
Default root object: index.html (This is the default root object created while creating the bucket in S3)
Standard logging: No
Enable IPv6: Yes
Distribution state: enabled
Click Create Distribution

Updating bucket policy in S3

The bucket policy will be updated automatically if its permission is set to public. If it is not, then the bucket policy has to be manually updated. Navigate to the AWS S3 dashboard and choose the domain. Click the Permissions tab and edit the bucket policy.

{
  “Version”: “2012–10–17”,
  “Id”: “PolicyForCloudFrontPrivateContent”,
  “Statement”: [
    {
      “Effect”: “Allow”,
      “Principal”: {
        “AWS”: “arn:aws:iam::cloudfront:user/CloudFront Origin Access Identity <<OAI ID>>”
      },
      “Action”: “s3:GetObject”,
      “Resource”: “arn:aws:s3:::<<BUCKET NAME>>/*”
    }
  ]
}

This is what the bucket policy should look like. Replace the <<OAI ID>> and <<BUCKET NAME>> with your information.
OAI ID: This is the identity created in the CloudFront console.
BUCKET NAME: Name of the S3 bucket

It will take a while for the status to change from In-Progress to Deployed.

Updating hosted zone

This step is to make changes in the Route 53 hosted zones. Navigate to the Route 53 dashboard.
Click Hosted zones from the sidebar.

Click the domain name that needs to be distributed with CloudFront.
In the next screen, there will be two record names that are of Type ‘A’. One will be something like website.com and the other will be www.website.com
Click the checkbox in front of website.com and click Edit

The traffic will be originally routed to the S3 bucket. We have to make some changes and point it to the CloudFront Distribution.

Record name: Leave it as it is

Value route traffic to:

Endpoint: Alias to Cloudfront Distribution
Regin: Choose your region
Distribution: Click on the third text box and a dropdown list will show the necessary distribution information. Choose it.
Record type: A — Routes traffic to an IPv4 address and some AWS resources
Routing policy: Simple routing
Evaluate target health: No
Click Save Changes
Follow the previous step for www.website.com with Type ‘A’. Click on the checkbox in front of www.website.com and click Edit.
Record name: leave it as it is
Value route traffic to:
Endpoint: Alias to Cloudfront Distribution
Regin: Choose your region
Distribution: click on the third text box and from the dropdown list, choose the necessary distribution information.
Record type: A — Routes traffic to an IPv4 address and some AWS resources
Routing policy: Simple routing
Evaluate target health: No
Click Save Changes

Testing the domain

Test the changes by visiting website.com or www.website.com. In my case, it is millastellan.com and www.millastellan.com. The website will have HTTPS and be secure.

Uploading files in S3

When new files are added or if the old files are updated in the S3 bucket, it will not automatically reflect on the domain. For that to happen, go to CloudFront dashboard.