Can't access API with Lambda and API Gateway

Question

I have an aws lambda function that returns the following response:

var responseBody = { cost: price };
var response = {
 statusCode: 200,
 headers: {
 "Access-Control-Allow-Origin": "*"
 },
 body: JSON.stringify(responseBody),
 isBase64Encoded: false
};
callback(null, response);

But I get the following error in my frontend Angular application.

Access to XMLHttpRequest at 'https://xxxxxxxxx.execute-api.us-east-1.amazonaws.com/dev/price' from origin 'http://127.0.0.1:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

• Darren Forsythe: You are being blocked at the API level. Not your lambda. You may want to add that configuration.

Answer 1

If you are using API Gateway HTTP APIs (not sure if this is relevant for the REST APIs):

Lets say I have an endpoint at /POST products. I had to add another endpoint at /OPTIONS products and integrate it with a simple Lambda function that just returns the HTTP 200 OK (or HTTP 204 No Content), and the "Access-Control-Allow-Origin": "*" header (or even better, specify the URL of your origin/client).

This is because browsers issue a preflight /OPTIONS request to the same endpoint, before issuing the actual request (see more), for all HTTP requests except GET and POST with certain MIME types (source).

• judep: Could not find this information anywhere else. Thanks
• Steven Lacks: Just to add to this, I also didn't see it anywhere else, I really assumed API Gateway would know what to do with a req method OPTIONS. if the lamba is small/cheap, you can check for options at the beginning of execution. Be aware the OPTIONS object has a different signature than the API Gateway object, instead of event.httpMethod, I had to use event.requestContext.http.method

Answer 2

You need to enable CORS on your resource using API gateway, check this link to more information https://docs.aws.amazon.com/apigateway/latest/developerguide/how-to-cors.html

• danimal: don't forget to deploy the api after updating this setting!
• Simon Guldstrand: Should you really configure CORS on the API GW level as well as on the Lambda?

Answer 3

It is years later, but I ran into this problem with an API deployed via CDK. Perhaps this will help someone else in my same situation.

If you are using an ANY route, instead try switching to specific method routes : [GET, PUT, POST, DELETE].

In my situation (when using an ANY route), the preflight for my POST was failing with the error:

...has been blocked by CORS policy: Response to preflight request doesn't pass access control check: It does not have HTTP ok status.

When I switched from one ANY route to specific [GET, PUT, POST, DELETE] routes, my preflight, and POST requests both worked as expected.