使用SAM模板配置Lambda函数时出现CORS跨域错误求助

问题描述 #

我为Lambda函数编写了template.yml配置文件，已在SAM模板中添加CORS配置，且AWS控制台能看到对应配置。SAM模板代码如下：

DenemeApi:
    Type: AWS::Serverless::Api
    Properties:
      StageName: prod
      Cors:
        AllowMethods: "'GET, OPTIONS'"
        AllowHeaders: "'Content-Type,X-Amz-Date,Authorization,X-Api-Key'"
        AllowOrigin: "'*'"
  DenemeFunction:
    Type: AWS::Serverless::Function
    Properties:
      FunctionName: DenemeFunction
      Handler: com.proton.protonservices.controller.UserController::deneme
      Runtime: java11
      CodeUri: .
      MemorySize: 512
      Role: !GetAtt CreateUserRole.Arn
      Timeout: 30
      Events:
        DenemeApi:
          Type: Api
          Properties:
            Path: /deneme
            Method: GET
            RestApiId:
              Ref: DenemeApi

从React应用发送GET请求到API地址时，出现以下CORS错误：

Access to XMLHttpRequest at 'https://72cfs1x8z0.execute-api.eu-central-1.amazonaws.com/prod/deneme' from origin 'http://localhost:6161' has been blocked by CORS policy: Request header field access-control-allow-origin is not allowed by Access-Control-Allow-Headers in preflight response.

GET https://72cfs1x8z0.execute-api.eu-central-1.amazonaws.com/prod/deneme net::ERR_FAILED

请问是需要修改SAM文件，还是存在其他环节的错误？

解决方案 #

1. 修正SAM模板的CORS配置错误 #

你的SAM模板中CORS配置项多了一层不必要的单引号，这会导致API Gateway返回的响应头包含无效引号，同时当前配置未覆盖错误提示中提到的请求头。修改后的配置如下：

DenemeApi:
    Type: AWS::Serverless::Api
    Properties:
      StageName: prod
      Cors:
        AllowMethods: "GET, OPTIONS"
        AllowHeaders: "Content-Type,X-Amz-Date,Authorization,X-Api-Key,access-control-allow-origin"
        AllowOrigin: "*"

• 移除AllowMethods、AllowHeaders、AllowOrigin值内部的单引号
• 在AllowHeaders中添加access-control-allow-origin，匹配错误提示里的请求头字段

2. 检查前端请求的错误配置 #

错误提示明确指出：请求中携带了access-control-allow-origin头，但这个头属于响应头范畴，绝对不应该出现在请求里。需要检查你的React请求代码，确认是否误加了这个请求头。比如使用axios/fetch时，不要手动设置Access-Control-Allow-Origin请求头，该头应由API Gateway返回给前端。

3. 重新部署SAM应用 #

修改完模板后，执行以下命令重新部署生效：

sam build
sam deploy --guided

部署完成后，在API Gateway控制台再次确认CORS配置已更新。

内容的提问来源于stack exchange，提问作者Bertug