Cloudfront throws 504 while connecting to ELB/Elastic Beanstalk

1
votes

So I have a NextJS application hosted on Elastic Beanstalk (with it exposed on port 3000 in the docker file). Now, I have my domain registered with Godaddy. I initially had the DNS setup in Godaddy to point to Elastic Beanstalk. But then I wanted to use cloudfront for CDN/Caching.

So, I started configuring Cloudfront (using this article). I created the custom SSL certificate and got it verified through DNS as well. I set the origin in cloudfront to points to ELB.

Now, once the cloudfront distribution was deployed, I tried using the cloudfront URL xxxxx.cloudfront.net but I got a "504 ERROR - The request could not be satisfied" error.

If I go to the ELB URL I am able to access my application. So, I am not sure what's the issue here. If the cloudfront is pointed to ELB and ELB works then why would cloudfront URL won't work.

Any advice/recommendations?

1
amazon-web-servicesamazon-elastic-beanstalkamazon-cloudfrontamazon-elb
How did you setup your CF distro to communicate with EB? Maybe it tries to use https but EB supports only http, or opposite? - Marcin

1 Answers

2
votes

If you receive a 504 error you are getting a timeout whilst connecting to the origin.

You should check the following:

  • Does the security group for the ELB allow inbound traffic from anyone (on port 80/443)? If it does not CloudFront is blocked.
  • Have you misconfigured your "Origin Protocol Policy", by selecting "Match Viewer" it will expect that HTTPS requests that hit CloudFront attempt to connect to the origin via HTTPS.
  • Does your application have a start time that exceeds the value of the Origin Response Timeout? By default this is 30 seconds.
  • Ensure the origin is the correct domain name.

There are additional steps to debug a 504 in CloudFront within the HTTP 504 Status Code (Gateway Timeout) page on AWS.