Building a Simple, Secure Website in AWS with a Godaddy Domain Name, Part 3

Configuring CloudFront to Deliver Your Website Securely

In part 1 and part 2 we purchased a domain name in Godaddy, configured a simple website in S3, and configured Route 53 DNS to route users to the website.

The third and final component of this tutorial explains how to configure AWS CloudFront, a Content Delivery Network (CDN). A CDN stores or caches your website content on servers around the world. It improves performance by keeping your website closer to users. It also acts like a buffer so that if your website went viral, the hundreds and thousands of users requesting your content can get it without crashing your webserver.

It works by propagating or caching your content in data centers spread around the world that are designed to deliver content fast. In this case, a CDN is probably overkill for your S3 website — at least for now. At some point you may hope your traffic will grow and at that point you’ll need a CDN to serve your content to thousands of clients. But for now, besides you, who is actually looking at your little website right now?

But there is another important reason why you need to configure CloudFront for this specific configuration. In the past few years, Google Chrome, Firefox and pretty much every browser has started alerting users when they connect to a website that isn’t using the HTTPS protocol. HTTPS is similar to HTTP, but it adds two important functions. First, it validates that the user is connecting to the actual website and not some knock off version that a hacker has put up to trick users. Second, it encrypts communications between client and server so that nobody can sniff the data you transmit over the Internet while communicating with that specific web server. The browsers alert the user that they are connecting insecurely to the web server.

A website that isn’t using HTTPS is indicated by the padlock in the browser bar.

So while this simple website we built doesn’t contain any proprietary data, like logins, passwords, or credit card numbers that could get sniffed and stolen by hackers while a user interacts with it,, it’s still a good practice to use HTTPS which is why Google has emphasized this in Chrome and all the other browsers have followed suit.

AWS S3 is incapable of delivering your website in HTTPS. So we will be relying on AWS CloudFront to do it. And as an added benefit, you’ll also pick up CloudFront’s benefit of scalability and faster performance so that when you do go big, your web infrastructure will be ready to handle it. For more information see this AWS developer guide on using HTTPS with CloudFront.

Step 1: Configure a cloudfront distribution for the S3 website

Source: AWS Developer Guide — Creating a CloudFront Distribution

1. Log into the AWS console and navigate to CloudFront. Select Create a Distribution

2. Select the “Web” delivery method for your content

3. Under “Create Distribution” the S3 Bucket you provisioned in the prior tutorial will auto populate. Select the bucket with your domain name such as ‘example.com’. This directs Cloudfront to pull and cache content from the S3 bucket that holds your website. You might hear this referred to as your “origin server”. Leave Origin path, Origin ID and Origin Custom Headers blank. These are advanced options that can be configured to customize how CloudFront interacts with your origin server and content. Learn more here.

4. For Restrict Bucket Access select yes.

Note: This option requires users to always use CloudFront to access your S3 bucket, instead of accessing the bucket directly.

5. For Origin Access Identity select create new identity

6. For Comment, proceed with the default entry

7. For Grant Read Permissions on Bucket select Yes

8. Leave the remaining settings as is and select Create Distribution

9. Check the CloudFront distribution page for status. When completed it will show deployed

Step 2: Request a certificate from ACM (Amazon Certificate Manager)

Source: AWS ACM User Guide and AWS ACM DNS Validation

A certificate is a form of validation that certifies to the client’s web browser that the domain they are accessing is authentic. This is necessary in today’s world since some hackers attempt to spoof domains and route unwitting clients to fake websites where they hope to steal user data. Certificates also enable the HTTPS protocol to certify client to server communications and then encrypt it, preventing hackers from eavesdropping and stealing data as it traverses the Internet.

Under most circumstances you will be creating certificates in conjunction with HTTPS, in order to secure communications between clients and your website. When you are using a CDN like CloudFront, CloudFront terminates this HTTPS connection with the client, and so it must host the certificate that validates to the client that they are communicating with the authentic website.

In this part of the tutorial, we aren’t activating HTTPS yet, but CloudFront still needs a certificate before Route53 can forward requests from your URL such as example.com to the CloudFront URL. Once you have the certificate provisioned in this step, activating HTTPS is a simple check box. More on that later.

1. Go to your AWS CloudFront instances and select your instance
2. Select Edit
3. Select Custom SSL Certificate
4. Select Request or Import a Certificate with ACM

5. In the domain name field, enter the domain names for your website such as example.com and www.example.com

6. Select Next

7. Select the DNS Validation method

8. Select Next

9. You don’t need any tags so select Review

10. Select Confirm and Request

11. Select export DNS to a configuration file and save the file to your local computer.

Step 3. Add the certificates to Route 53

1. Go to Route 53 and select the Hosted Zone you created in the prior tutorial for this project
2. Select Create Record Set
3. Select CNAME

Since you added Route 53 nameservers to your Godaddy DNS records in step 2, you have already validated Route 53 as a trusted DNS provider for your domain. So now you just need to add the certificates to Route 53 so that as requests are routed from Route 53 to CloudFront, CloudFront is recognized as a trusted intermediary.

4. Copy the certificate from the Record Value in the DNS configuration file, omitting the period at the end of the value.

5. Paste the certificate in Name and Value

6. Click Create

7. Repeat for the second certificate

8. Return to ACM and check validation

Validation may take several minutes. You can proceed to the next step while the certificates are still being validated.

Step 4. Add CNAMEs to CloudFront and Verify Certificates are Deployed in CloudFront

Source: AWS Developer Guide — CloudFront Alternate Domain Names

1. Return to CloudFront
2. Select edit distribution
3. Add CNAMEs: example.com, www.example.com
4. Verify you have selected Custom SSL Certificate
5. Once your certificate is issued, the certificate automatically updates into the form field

Step 5. Add CloudFront URL to Route 53

Source: AWS Developer Guide — Routing to CloudFront Distributions

In this step you are instructing Route 53 to route requests for your domain name such as example.com to your CloudFront URL.

1. Go to Route 53 and select the Hosted Zone you created in the prior tutorial
2. Select Type A-IPv4 address
3. Select Alias Yes
4. Select Alias Target — CloudFront distributions (select your distribution which should automatically appear here)
5. Select Create

Step 6: Verify CloudFront is Serving Your Website

In this step you are using your terminal to validate that your website is being served by CloudFront. The Dig command is a useful function for troubleshooting since it can help you see where the DNS system is configured to route your website.

1. Test your website in a new browser window
2. Open your command line / terminal app
3. If you are running windows you need to install BIND
4. Enter dig your_domain.com

Dig will return the DNS settings and IP Address of your website. In this case, we are verifying that the DNS is sending your request through CloudFront. So we take the IP address that has been returned in Dig, copy it into your browser and see if it returns an error page from CloudFront.

When you attempt to access the IP Address, AWS returns an error because it is only configured to return a response to clients using example.com and www.example.com. So, this error screen is ok — it’s just confirming that CloudFront is the provider behind the IP Addresses returned from your dig command.

Step 7: Activate HTTPS

Source: AWS CloudFront Developer Guide, Requiring HTTPS for Communications between CloudFront and your AWS S3 Origin

1. Select your CloudFront Distribution
2. Select the Behaviors tab

3. Select the Origin Group

4. Select Edit

5. In Viewer Protocol Policy select Redirect HTTP to HTTPS

6. Select Yes, Edit

7. Test your website

CloudFront now redirects to HTTPS and the browser indicates you are using a secure connection.

Congratulations. You finished the three part tutorial. If you aren’t planning on doing anything else with your website, go back into AWS and delete the things you created so that you don’t keep getting billed for the services.

But you can also keep your website running so you can continue learning how to do other things in AWS, such as in the next tutorial where I’ll show you how to build serverless functions with Lambda@Edge.