Amazon CloudFront does not respect my S3 website index.html Rules

Question

I host a static website on Amazon S3 using a static web hosting option, so S3 will display the folder without pointing me directly to my index.html file.

For example, here is a direct link to a page in my S3 bucket: http://new.rdegges.com.s3-website-us-east-1.amazonaws.com/category/2009/ As you can see when you visit this URL Amazon S3 automatically displays the index.html file inside this directory, allowing me to have clean URLs.

All this works fine on S3. The problem I am facing is that Amazon Cloudfront handles this behavior correctly. When I create a Cloudfront distribution with my S3 slave fan listed as the source and tell it to use "index.html" as the root, the index.html behavior that S3 just stops working together.

For example, here is my same URL as indicated above in Cloudfront: http://d1mj00c6pby3gc.cloudfront.net/category/2009/

Unfortunately, the above URL does NOT work, but if I manually specify the index file, it is, for example: http://d1mj00c6pby3gc.cloudfront.net/category/2009/index.html

My question is: how do I need to configure Cloudfront so that it matches my S3 byte settings for my site?

Answer 1

S3 Site features can be shared with Amazon CloudFront. However, the S3 website uses a different domain name than regular S3 buckets. In this case, you need to set the Origin Domain Name your CloudFront distribution source configuration to new.rdegges.com.s3-website-us-east-1.amazonaws.com .

You can take this URL (endpoint) from the static web hosting panel on S3:

Once CloudFront points to the S3 website's domain name, the S3 website's features should work.

Answer 2

I would like to add a few things to the accepted answer.

First, make sure you have a Default Root Object on your cloud front. As stated in the documentation , this does not apply to subdirectories .

When setting up a new cloud distribution, it will let you choose your bucket bucket-name.s3.amazonaws.com . Please note that the region is not specified in the URL. What you need to do is grab the static URL of the site from s3 and use it as origin url (the region will be there).