I'm trying to host my frontend on S3 with a CloudFront distribution, but I'm running into an Access Denied error. Here's what I've done so far:
1. Created an S3 bucket named detailinghubpk.com and uploaded my website files.
2. Set up CloudFront to redirect HTTP to HTTPS and configured it with my S3 bucket as the origin.
3. Set up a hosted zone in Route 53 for my domain and mapped the NS records in GoDaddy.
4. Requested an HTTPS certificate and created the necessary validation records in Route 53.
5. Created an alias record in Route 53 for CloudFront and added a bucket policy to allow CloudFront access.
6. Set the Default Root Object to index.html and invalidated the CloudFront cache.
Despite all this, visiting my domain or the CloudFront URL leads to a 403 Access Denied error. I've double-checked everything but still can't figure it out.
5 Answers
It looks like your CloudFront URL is working, but your root object might not be properly set up. You need to make sure that in your CloudFront distribution, the Default Root Object is set to `index.html` exactly as you mentioned. If that's done, try accessing `https://detailinghubpk.com/index.html` directly and see if that works. Sometimes, it might take a moment for settings to propagate, so be patient after caching invalidation.
Check if you have any KMS keys configured. They could be preventing access to your assets. It seems like an S3 issue since you mentioned the static web hosting feature. Also, if you have access to all your assets, ensure S3 is set up correctly to serve them. I've used a similar setup before but opted for an Application Load Balancer and Lambda instead. CloudFront can be a bit tricky!
Glad you brought this up! If you've set the Default Root Object to index.html and invalidated the cache but are still facing issues, look at the OAC configuration. Could you share any screenshots? They can really help in comparing settings and pinpointing the problem.
Resolved! I re-set the Default Root Object to `index.html` again, invalidated the CloudFront cache, and it finally worked! Thanks for the suggestions, everyone!
It’s hard to troubleshoot without details on your Origin Access Control (OAC) and bucket policy. If you can share the configuration, that would help. Also, did you enable the 'sign request' option when setting up OAC? Make sure your bucket policy allows CloudFront to fetch content.
Related Questions
Cloudflare Origin SSL Certificate Setup Guide
How To Effectively Monetize A Site With Ads