AWS API Gateway POST/PUT请求CORS报错排查求助

问题场景 #

已配置运行正常的AWS Lambda函数，返回内容包含CORS相关响应头；在API Gateway中创建了POST/PUT方法并完成以下配置：

• 为资源启用CORS并选择所有方法
• 方法请求设置请求体类型为application/json
• 集成请求配置了application/json的映射模板
• 方法响应包含必要的CORS响应头
• 响应体类型设为application/json

API Gateway控制台测试方法成功，但部署在AWS Amplify的前端调用时出现TypeError: Failed to fetch，浏览器控制台提示：

Access to fetch at 'https://xx.execute-api.eu-north-1.amazonaws.com/prod/GoalGroup' from origin 'https://dev.xy.amplifyapp.com' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: The 'Access-Control-Allow-Origin' header has a value 'https://dev.xy.amplifyapp.com/' that is not equal to the supplied origin.

同一资源下的GET方法正常工作，仅PUT/POST方法报错。

问题根源 #

浏览器报错明确指出：预请求响应的Access-Control-Allow-Origin头值带有末尾斜杠（https://dev.xy.amplifyapp.com/），但实际请求的Origin不带斜杠（https://dev.xy.amplifyapp.com），两者不匹配导致CORS校验失败。GET方法正常是因为其预请求逻辑或响应头未出现该格式差异。

修复步骤 #

1. 修正API Gateway的CORS配置 #

• 进入API Gateway控制台，找到对应资源，重新执行启用CORS操作：
  • 填写Access-Control-Allow-Origin为https://dev.xy.amplifyapp.com（不带末尾斜杠），注意当Access-Control-Allow-Credentials设为true时，不能使用通配符*，否则会触发CORS规则冲突。
  • 确认Access-Control-Allow-Methods包含OPTIONS, PUT, POST, GET, DELETE，与Lambda返回的配置一致。
  • 保存配置后必须重新部署API到prod阶段，否则新配置不会生效。

2. 调整Lambda函数的CORS响应头 #

确保Lambda返回的Access-Control-Allow-Origin直接指定Amplify域名（无斜杠），避免通配符与Access-Control-Allow-Credentials: true冲突：

return {
    statusCode: 200,
    headers: {
      'Access-Control-Allow-Origin': 'https://dev.xy.amplifyapp.com',
      'Access-Control-Allow-Credentials': true,
      'Access-Control-Allow-Headers': 'Content-Type',
      'Access-Control-Allow-Methods': 'OPTIONS, PUT, POST, GET, DELETE',
    },
    body: JSON.stringify('Success'),
};

更新后重新部署Lambda函数。

3. 检查OPTIONS方法的集成响应 #

PUT/POST请求会触发OPTIONS预请求，需确认自动生成的OPTIONS方法响应头配置正确：

• 进入OPTIONS方法的集成响应页面，检查Access-Control-Allow-Origin的值是否为无斜杠的正确域名。
• 确保响应头包含所有必要的CORS字段，与Lambda返回的配置一致。

4. 清除浏览器缓存 #

浏览器可能缓存了旧的CORS响应头，测试前清除缓存或使用隐私模式发起请求。

验证 #

重新部署API和Lambda后，用前端发起PUT/POST请求，查看浏览器控制台是否仍有CORS错误。若问题持续，可打开浏览器网络面板，查看OPTIONS预请求的响应头，确认Access-Control-Allow-Origin与请求Origin完全一致（无格式差异）。

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