skip to Main Content

I’ve setup S3 + Cloudfront to host a static website using a subdomain provided by Namecheap, but when navigating to the Cloudfront URL, or domain URL, AWS responds with a 504: "The request could not be satisfied" error.

The steps I’ve completed are:

  1. Setup the S3 bucket to have Static website hosting: Enabled with the hosting type set to "Bucket hosting". The bucket is Publicly accessible.
  2. Setup a Cloudfront distribution with its origin domain set to [bucket name].s3-website-ap-southeast-2.amazonaws.com which has completed deployment.
  3. Set [subdomain].[domain].io as an alternate domain name within the Cloudfront distribution.
  4. Assigned a Custom SSL certificate to my distribution that has a status of "Issued" from AWS Certificate Manager for my custom domain [subdomain].[domain].io
  5. Setup a CNAME within NameCheap so that [subdomain] points to [abc123].cloudfront.net. which has propagated (confimed by whatsmydns.net)

I’m new to Cloudfront + S3 hosting and trying to skill up, but not hosting in general (I usually use EC2 with either Apache or NGINX).

How can I resolve the 504 error?

4

Answers


  1. Chosen as BEST ANSWER

    The issue turned out to be that I was using [bucket name].s3-website-ap-southeast-2.amazonaws.com like the tutorials I'm using take special note to specify. Nowadays it seems you should use [bucket name].s3.ap-southeast-2.amazonaws.com instead.

    Once I made the above update and the distribution was deployed everything started working.


  2. This error 504: "The request could not be satisfied" usually means that the cloudfront distribution can’t connect to the configured source. Are you able to access your system using the website URL directly without CF?

    Have you set cloudfront, during the distribution creation, to be the only allowed to access the bucket by accident?
    https://aws.amazon.com/premiumsupport/knowledge-center/cloudfront-access-to-amazon-s3/

    Everything makes me believe that your bucket is not accessible even if you set the website hosting feature.

    Login or Signup to reply.
  3. my solution to this problem in terraform is with :
    origin_protocol_policy = "http-only"

    because s3 static website endpoint is on http, so if you choose "https-only"
    it will give 504 error.

    Login or Signup to reply.
  4. Two things solved my issue:

    1. Added s3:GetObjectVersion action to the public permission for s3

           {
           "Sid": "Allow-Public-Access-To-Bucket",
           "Effect": "Allow",
           "Principal": "*",
           "Action": [
               "s3:GetObject",
               "s3:GetObjectVersion"
           ],
           "Resource": "arn:aws:s3:::ops.freeway-camper-tests.com/*"
       }
      
    2. Ensure that NO custom headers are defined in the origin

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search