Hey everyone! I'm a frontend developer looking to expand my skills with AWS by building a simple one-page website using classic HTML, CSS, and some vanilla JavaScript (with a bit of jQuery). I want to let my friend make simple updates to the site, so I'm trying to set up some backend functionality. Right now, I'm using S3 and CloudFront for hosting, and I've got Cognito working fine for user logins. However, I'm having trouble getting a basic GET method to work with API Gateway and Lambda. Despite following numerous tutorials and AI suggestions, I'm still encountering CORS errors for the GET requests. The OPTIONS method returns a 200 status, but I'm stuck on what else to check. It's just a straightforward portfolio site, so I'm happy to share code snippets and configurations if that helps!
2 Answers
Have you configured an alternate domain name in CloudFront that matches your allowed origin? Also, make sure to set up Route53 to alias the traffic to your CloudFront distribution. Getting HTTPS and cross-account issues sorted out was quite a challenge but also rewarding when it worked out!
When troubleshooting CORS, check if your browser is actually making the GET request to your API. If it isn't, make sure the 'Access-Control-Allow-Origin' header is correctly set in the OPTIONS response. That header is crucial for CORS to work.
From what you mentioned, it seems like the GET request isn't even making it through. You should definitely look for the 'Allow-Origin' header because your preflight OPTIONS call is returning 200 but missing that header might be why you're hitting a CORS block.
I haven't touched Route53 yet! I'll definitely look into that.