Serving a Hugo Site Through S3 and CloudFront

Okay. Getting my Hugo site published.

Looks like I can’t host a static website on AWS S3 alone and serve it up via HTTPS. For that I need CloudFront to serve the content.

First, getting the content onto a bucket.

aws s3 sync <source> s3://<destination>

Then create a CloudFront distribution.

I already have a Custom SSL Certificate for nielmclaren.com in AWS Certificate Manager so adding it as an alternate domain name for the distribution was easy.

Now create an A record in Route53 to direct traffic to nielmclaren.com to that CloudFront distribution.

Seemed easy enough but I got stuck with an access denied error.

It happens when I hit https://nielmclaren.com It happens when I hit the distribution domain name https://d32j1ownt84hf9.cloudfront.net It does not happen when I hit the bucket directly (with static website hosting enabled and block public access disabled) http://nielmclaren.com.s3-website-us-west-2.amazonaws.com/

Do I need to have static website hosting enabled for CloudFront to work? I imagine not.

I tried creating an invalidation for the entire site on CloudFront but still getting access denied. Hmm.

I created a bucket policy to allow access to everything in the bucket:

{
    "Version": "2012-10-17",
    "Statement": [
        {
            "Sid": "GrantPublicAccess",
            "Effect": "Allow",
            "Principal": "*",
            "Action": "s3:GetObject",
            "Resource": "arn:aws:s3:::nielmclaren.com/*"
        }
    ]
}

…

Oh. I need to make the objects themselves public.

There are sure a lot of safeguards against exposing bucket contents publicly. (-:

That can’t be it, though, otherwise static website hosting wouldn’t’ve worked.

Still doesn’t work.

Create an invalidation?

Nope.

Encryption? It’s encrypted at rest, though. That wouldn’t be it.

This page has been great for troubleshooting, by the way. Lots of possible issues and how to solve them: https://repost.aws/knowledge-center/s3-website-cloudfront-error-403