使用axios向DynamoDB表POST条目遇404及CORS错误问题求助

一、404错误修复 #

你提供的axios代码存在配置错误：请求头Content-Type直接放在了axios配置的根层级，没有放到headers字段中，axios不会识别该配置，会导致请求格式不符合API要求，可能触发404。修正后的基础配置如下：

axios({
  method: 'post',
  url: 'https://na9blqj5y5.execute-api.us-east-1.amazonaws.com/test',
  // 把请求头放到headers对象中
  headers: {
    'Content-Type': 'application/json'
  },
  data: {
    body: eraseThis
  }
})
.then((response) => {
  console.log('axiosResp', response);
})
.catch((err) => console.error('axios', err))

另外请核对以下两点：

• 确认axios请求的URL和Postman中使用的URL完全一致，包括路径后缀，比如Postman如果请求的是/test/xxx，axios也要对应加上后缀
• 确认Postman中没有额外配置的请求头或者鉴权参数，如果有需要同步加到axios的headers中

二、CORS错误修复 #

仅在API Gateway控制台开启CORS不够，还需要排查两个常见漏配项：

• 你的后端Lambda函数的返回值必须主动携带CORS相关响应头，示例如下：

// Lambda返回值示例
exports.handler = async (event) => {
  return {
    statusCode: 200,
    // 必须加以下CORS头
    headers: {
      'Access-Control-Allow-Origin': '*', // 可以替换为你的前端域名
      'Access-Control-Allow-Headers': 'Content-Type',
      'Access-Control-Allow-Methods': 'OPTIONS,POST,GET'
    },
    body: JSON.stringify('success')
  };
};

• 确认API Gateway对应资源的OPTIONS请求方法没有配置鉴权，预检请求会被浏览器自动发送，不能携带身份信息，一旦OPTIONS请求需要鉴权就会报错，需要在API Gateway中把OPTIONS方法的鉴权设置为NONE，修改后记得重新部署API阶段。

三、关于是否需要使用AWS SDK的说明 #

如果你的API Gateway配置的是IAM身份验证，才需要对请求做AWS SigV4签名，这种场景可以选择使用aws-sdk，或者给axios添加签名插件。如果你的API是公开访问、使用API Key或者Cognito鉴权，不需要引入AWS SDK，直接用axios请求即可。

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