I'm using S3 to host my static website (it's an Angular page) and Route 53 to be able to use the domain I have. (I bought the domain at Hostgator). Whenever I say and use here 'example.com', be aware that is the same name of the domain I bought. In the S3 I have to buckets. Let's call them www.example.com and example.com. The example.com holds the application itself and it's set up as a static website hosting. It also has public permission with the proper Bucket Policy. The www.example.com is a just a redirect bucket, which is set up as a static website hosting to just redirect requests. In this bucket, the 'target bucket or domain' is the 'example.com' bucket.
In Route 53, I have a hosted zone with the name 'example.com'. There, I have 4 record sets. Two for setting up the domain I bought to be used at AWS. It's an 'NS - Name server' and an 'SOA - Start of authority'. They are properly configured to host my domain name. The other two are 'A - IPv4 address', one with the name of 'example.com' and the other with the name of 'www.example.com'. In these two cases, the Alias target is my 'example.com' bucket in S3.
So far I was following the docs and it works well. I can load my domain at the browser typing 'example.com' or typing 'www.example.com', which redirects to 'example.com' and load my application. So far, so good. The application was working, but of course without an SSL certificate.
Then I created a Distribution at CloudFront to use my SSL certificate. In the distribution, I set the Origin as the endpoint of my 'www.example.com' bucket at S3. The CNAMEs property I set as www.example.com, example.com. I used my SSL certificate and all works fine to deploy the distribution. So far so good...
At AWS S3, in the www.example.com bucket, in the protocol of the redirect requests, I set it to 'https', as the docs said.
Then, in Route 53, I set the Alias Target of the two 'A - IPv4 address' record sets, mentioned earlier, with the CloudFront distribution I created.
That's it. It was supposed to be done, but always when I go to 'example.com' with the browser, I get this error:
'err_too_many_redirects'
The interesting thing is that the URL became secure, with the https and the green padlock. But the application doesn't load. The redirect from the www.example.com to example.com still works.
Docs:
https://docs.aws.amazon.com/Route53/latest/DeveloperGuide/tutorial-redirecting-dns-queries.html
https://docs.aws.amazon.com/AmazonS3/latest/dev/website-hosting-custom-domain-walkthrough.html
In the distribution, I set the Origin as the endpoint of my 'www.example.com' bucket at S3.
You have pointed the CloudFront distribution to the wrong bucket. This is the first problem. You are pointing everything to the bucket that always redirects every request.
The CNAMEs property I set as www.example.com, example.com.
You have two buckets but only one CloudFront distribution. This is the second problem. You need two CloudFront distributions, one to handle example.com and the other to handle www.example.com. Each one has only one Alternate Domain Name ("CNAME") value and points to the matching bucket.