Skip to content

Contact sales

By filling out this form and clicking submit, you acknowledge our privacy policy.
  • Labs icon Lab
  • A Cloud Guru
Google Cloud Platform icon

Setting Up AWS CloudFront as an HTTPS Endpoint for S3

In this hands-on lab, we'll be setting up a CloudFront distribution in front of an S3 bucket website and securing it via HTTPS provided by CloudFront. AWS CloudFront is a versatile caching service (CDN) that helps with lowering latency when accessing objects over the internet. Additionally, it can act as an HTTPS termination point for your cached website — thus, providing a secure way of distributing your content over the internet.

Google Cloud Platform icon

Path Info

Clock icon Intermediate
Clock icon 1h 0m
Clock icon Oct 18, 2019

Contact sales

By filling out this form and clicking submit, you acknowledge our privacy policy.

Table of Contents

  1. Challenge

    Upload Content to S3 Bucket

    1. Upload the index.html file to the bucket (replacing <BUCKET_NAME_PROVIDED> with the S3 bucket name listed on the lab page):

      aws s3 cp index.html s3://<BUCKET_NAME_PROVIDED>

  2. Challenge

    Create CloudFront OAI

    1. Create a CloudFront origin access identity so it can get content from your S3 bucket on your behalf (replacing <YOUR_UNIQUE_UUIDGEN_HERE> with the uuidgen):

      aws cloudfront create-cloud-front-origin-access-identity --cloud-front-origin-access-identity-config CallerReference=<YOUR_UNIQUE_UUIDGEN_HERE>,Comment=MyOAI

    2. Copy the Id and Etag in the output and paste them into a text file, as we'll need them later.

  3. Challenge

    Modify S3 Policy File in Directory and Execute It Against S3 Bucket

    1. Modify the provided policy_cloudfront.json file in the home directory of cloud_user.

    2. Execute this policy against the S3 website bucket (first changing to the home directory):

      aws s3api put-bucket-policy --bucket <BUCKET_NAME> --policy file://policy_cloudfront.json
  4. Challenge

    Create CloudFront Distribution

    1. Create a CloudFront distribution:

      aws cloudfront create-distribution --origin-domain-name <BUCKET_NAME> --default-root-object index.html

      This will give you a lengthy output. Find and note/save the ETag and Id of the CloudFront distribution from within that returned JSON string, as you'll need them later to update it.

  5. Challenge

    Get and Update the CloudFront Distribution Config

    1. Get the CloudFront distribution config and filter out the distribution-specific part:

      aws cloudfront get-distribution-config --id $CF_ID | jq -r .DistributionConfig > dist-config.json
    2. Modify the following properties in the newly created dist-config.json file:

      • OriginAccessIdentity under key Origin should be origin-access-identity/cloudfront/<OAI_ID> (don't forget to replace <OAI_ID> with the actual OAI ID).
      • PriceClass should be PriceClass_100.
      • ViewerProtocolPolicy should be redirect-to-https.
  6. Challenge

    Update CloudFront Distribution with the Modified `dist-config.json` File

    1. Update the CloudFront distribution with the dist-config.json file:

      aws cloudfront update-distribution --id $CF_ID --distribution-config file://dist-config.json --if-match $CF_ETAG
  7. Challenge

    Test and Verify

    In the CloudFront Console, copy the CloudFront distribution domain name and paste it into a browser tab to confirm the website is working.

    Note: CloudFront distributions can take about 20 minutes to be globally effective. It might work for you immediately or within a few minutes after you create it, so be patient and wait for it to deploy before you test.

The Cloud Content team comprises subject matter experts hyper focused on services offered by the leading cloud vendors (AWS, GCP, and Azure), as well as cloud-related technologies such as Linux and DevOps. The team is thrilled to share their knowledge to help you build modern tech solutions from the ground up, secure and optimize your environments, and so much more!

What's a lab?

Hands-on Labs are real environments created by industry experts to help you learn. These environments help you gain knowledge and experience, practice without compromising your system, test without risk, destroy without fear, and let you learn from your mistakes. Hands-on Labs: practice your skills before delivering in the real world.

Provided environment for hands-on practice

We will provide the credentials and environment necessary for you to practice right within your browser.

Guided walkthrough

Follow along with the author’s guided walkthrough and build something new in your provided environment!

Did you know?

On average, you retain 75% more of your learning if you get time for practice.

Start learning by doing today

View Plans