Tiffany B. Brown

24 January 2016

Structuring URLs for AWS Certificate Manager and CloudFront

I set up SSL/TLS on both webinista.com and this blog using AWS Certificate Manager. Certificate Manager makes makes it absolutely trivial to add SSL/TLS support to an AWS CloudFront distribution. What's more, certificates are free.

Adding a certificate is easy, but if you have a directory-style URL structure as this blog once did, you'll need to rewrite your URLs and links.

This is only a problem if you're using CloudFront and S3 over HTTPS.

Using CloudFront with an S3 endpoint over HTTP

For an HTTP-only CloudFront distribution, use an S3 endpoint URL as the Origin Domain Name. Your CloudFront distribution will behave the same way as your S3 endpoint. Redirects will stay intact. Your index document will be served when a user requests a sub-directory; e.g.: http://example.com/path-to-post/index.html will be served for requests to http://example.com/path-to-post/.

Using HTTPS with CloudFront and S3

HTTPS-only CloudFront distributions, however, work differently for two interrelated reasons.

  1. Amazon S3 does not support HTTPS for website end points; and
  2. CloudFront does not support index documents for subdirectories, only distribution roots.

Solving problem 1 is easy. Use the S3 bucket for your web site as the Origin Domain Name instead of the S3 end point. Solving problem 2 is a little tougher.

CloudFront doesn't support index documents for subdirectories

CloudFront does support default root objects. A default root object is returned whenever a user requests the root of your distribution. If your root object is homepage.file, for example, that's what visitors will see when they request https://example.com/.

CloudFront does not, however, support index documents. A request for a subdirectory will return an empty directory object to the user. To work around this problem, use and link to files.

Put another way, https://example.com/path-to-post/ won't work as a link. URLs such as https://example.com/path-to-post/index.html, https://example.com/path-to/post.html or https://example.com/path-to-post/index will.

Don't forget to set a Content-Type: text/html header.

For this blog, that meant updating all of my internal links to point to /subdirectory/index.html instead of /subdirectory/. Since Webinista.com is a single-page site, the root object was enough.

One other thing to remember: update your site's src and href attribute values to use relative (e.g. //yourdomain.com/, /css/style.css) or https:// URLs.

To make this all work with your domain, create an alias that points to your CloudFront distribution.