Enable CORS does not add Access-Control-Allow-Origin header to any method under resource, except OPTION

Serverless Framework
1

Hi,

I’m having a hard time adding Access-Control-Allow-Origin to my GET method with serverless. When I enabled CORS on resource root, I expect all of my methods will have Access-Control-Allow-Origin header under Method Response. This usually happens when I enable CORS from API GW dashboard.

Additional info: For API created by serverless, enabling CORS via Console would also fail for any of my method due to missing a response body:

image
image1501×322 25.5 KB

This is created automatically if you create new method manually from console, however serverless doesn’t create it.

Update: here’s the API config from serverless.yml

  - http:
      path: /myapi
      method: GET
      cors: true

This creates an OPTION method with CORS enabled, but nothing gets created on GET method.

2

Can you share the serverless.yml you are using to deploy your endpoint?

Usually the cors: true option is added per http event you want to enable cors for. Also,you will need to add the necessary cors headers such as Access-Control-Allow-Origin to every response from your lambdas yourself.

3

I updated my post with the http config in my serverless.yml. The lambda code is ready for it as you stated, I just need to enable CORS for method response header.

4

Your response will look something like:

return {
  statusCode: 200,
  headers: {
    'Access-Control-Allow-Origin': '*'
  }
}
5

What if I need to return a different status code rather than 200? This is why I need to return 200 for CORS using method response.

6

You can return any status code, you like. Mine was just an example. And the example is within your lambda. So if you need to return a status code indicating that the correct data was not sent with the request it would be

return {
  statusCode: 400,
  headers: {
    'Access-Control-Allow-Origin': '*'
  }
}

Or pehaps some infrastructure you are talking to errored out your response could be

return {
  statusCode: 500,
  headers: {
    'Access-Control-Allow-Origin': '*'
  }
}

Pretty much any API Gateway response from your lambda must include the cors headers. Whether you are returning success or failure status codes.

7

This is actually what I have, but still getting CORS error unless I create a 200 status code for CORS header in API method response, like this:

image
image1446×267 20.5 KB

The 200 status code is created automatically if I create the method from UI console, then when I enable CORS (also via console), it adds Access-Control-Allow-Origin header here.

8

I’m not sure what to tell you. I have multipel Lambdas returning more than 200 status codes along with all required CORS headers without issue. Perhaps your attempt at manual editing of the API Gateway settings has negatively affected the outcome.

Could you try redeploying to a different stage and include CORS headers for your non 200 status code responses and see how it goes. You can do that by adding --stage [stage name] to your sls deploy command which will spin up a different stack that won’t overwrite your current one