API网关，被CORS策略阻止：没有“ Access-Control-Allow-Origin”标头

Question

I know this question might be duplicated, but none of the existing question point to anything I'm not doing...

I've deployed an API using the serverless framework, but I'm having trouble with CORS.

I'm doing a get request using axios:

axios.get('https://test.execute-api.us-west-1.amazonaws.com/dev/test?from=2012-01-09T21:40:00Z')
     .then(response => {
       this.data = response.data;
     })
     .catch(error => console.log(error))

And I'm getting the following error:

Access to XMLHttpRequest at 'https://test.execute-api.us-west-1.amazonaws.com/dev/test?from=2012-01-09T21:40:00Z' from origin 'http://localhost:8080' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

What I've already done:

• Made sure there's an OPTIONS method in API Gateway with a method response that looks like this:

• Made sure I deployed those changes.

Also, the response of my Lambda function is returning the following headers:

return events.APIGatewayProxyResponse{
    StatusCode: http.StatusOK,
    Headers: map[string]string{
        "Access-Control-Allow-Origin":      "http://localhost:8080",
        "Access-Control-Allow-Credentials": "true",
    },
    Body: string(jsonEvents),
}, nil

I also tried setting Access-Control-Allow-Origin to '*'

My serverless.yml file has cors: true on each of the function events:

functions:
  deploymentFrequency:
    handler: bin/update/deployment-frequency
    events:
      - http:
          path: deployment-frequency
          method: post
          cors: true
  fetchDeploymentFrequency:
    handler: bin/fetch/deployment-frequency
    events:
      - http:
          path: deployment-frequency
          method: get
          cors: true

What am I missing? Nothing seems to work. The request works fine from Postman and it looks to be including the headers, so this seems to be an issue with the OPTIONS method.

Answer 1

My configuration is:

(event, context, callback) => {
   callback(null, {
      statusCode: (code || 200),
      body: JSON.stringify(resp),
      headers: { 'Access-Control-Allow-Origin': '*'},
   });
}

and it works fine for me. I use to have the same issue as you before, but as long as you define your function with CORS: true and your response contains the header, you should be fine.

Note: Im didnt understand the sintax "map[string]string" and credentials should not be necessary at this case.