Amazon CloudFront with custom certificate

Hi there.

I recently wrote a javascript app with some dash of html for my wife and sister in law. They are personal trainers in their sparetime and announce their activities on Facebook and link to a page where one can sign up. The code resides in a S3 bucket and can be served from there. The app uses the web-based Facebook login.

Select the bucket, mark index.html and then click on the Properties button in the upper right side. The link can then be pasted into the announcement on FB. Which we also did to begin with but the URL is neither very pretty nor easy to remember. But good enough just to get started with the sign up process and get some feedback.

https://s3-eu-west-1.amazonaws.com/timebooking.gnome.no/index.html

Amazons CloudFront is a CDN (Content Delivery Network). CloudFront is build for speed and S3 buckets for storage. When you create a CloudFront distribution you can connect to your S3 bucket in the wizard. Log in to your Amazon account and select CloudFront from the leftmost column.

AmazonFBauthentication01

Then click on the top most ‘Get Started’ button in the section Web.

AmazonFBauthentication46

When you enter ‘Origin Domain Name’ a list with your S3 buckets appears. Select the bucket you want to add to the CloudFront distribution.

Then select ‘Redirect HTTP to HTTPS’ in ‘Default Cache Behaviour Settings’ so it always serves encrypted https.

In ‘Allowed HTTP methods’ you can change the value as needed. Use the bottom option if you need to write content.

Leaving the rest of the settings at their default will create a distribution and assign it a domain name. I got d3ejguxaohfe01.cloudfront.net, shorter than the S3 bucket URL but still odd looking.

https://d3ejguxaohfe01.cloudfront.net/index.html

AmazonFBauthentication54

To use your own domain name enter this in ‘Alternate Domain Names (CNAMESs)’ in the section ‘Distribution Settings’, in my case it’s pt-amok.gnome.no. Head over to your DNS and add the CNAME pt-amok.gnome.no and point it to d3ejguxaohfe01.cloudfront.net.

AmazonFBauthentication53

Then click on ‘Request an ACM certificate’ to have Amazon create a certificate for this domain.

AmazonFBauthentication50

Enter the domain name, use an asterix (*) so you can add any subdomains and click on ‘Review and request’.

AmazonFBauthentication51

Click on ‘Confirm and request’ and a mail is sent to the domain, and hostmaster is one of the recipients. Just make sure that one of the recipients have their mail forwarded to your account. When the mail arrives confirm you want to create this certificate. I selected the region N. Virginia when I requested the certificate.

AmazonFBauthentication52

Select ‘Custom SSL Certificate (example.com):’ and the appropriate certificate. When these changes are saved the distribution settings must be propagated throughout CloudFront and this step take some minutes. You can specify the default html file to be served by adding the filename to ‘Default Root Object’, in my case index.html. So now the link is prettier.

https://pt-amok.gnome.no/