使用AWS API Gateway调用S3 Bucket的PUT请求失败，CORS问题求助

关键原因 #

浏览器发起PUT请求前会自动发送OPTIONS预检请求验证跨域权限，Postman不会触发该预检流程，因此Postman能正常运行但前端Axios调用失败。你的问题核心是API Gateway未正确处理OPTIONS请求，导致预检响应未返回200 OK状态。

修复步骤 #

• 必须配置API Gateway的CORS（不要仅依赖S3配置）
  进入API Gateway控制台，找到目标API及对应资源/dev/directjobfinder/listing.json：

  1. 点击Actions → Enable CORS
  2. 配置参数：
     • Access-Control-Allow-Origin: *
     • Access-Control-Allow-Headers: *
     • Access-Control-Allow-Methods: GET, PUT, OPTIONS
  3. 重点操作：重新部署API到dev阶段，未部署的配置不会生效

• 确保OPTIONS请求返回200状态
  若上述操作后问题仍存在，手动为资源添加OPTIONS方法：

  1. 选中目标资源→Create Method→选择OPTIONS，集成类型设置为Mock
  2. 配置集成响应：状态码设为200，添加以下响应头：
     Access-Control-Allow-Origin: *、Access-Control-Allow-Headers: *、Access-Control-Allow-Methods: GET, PUT, OPTIONS

• 检查S3 Bucket权限策略
  为S3 Bucket添加权限，允许API Gateway执行PUT操作：

  {
    "Version": "2012-10-17",
    "Statement": [
      {
        "Effect": "Allow",
        "Principal": { "Service": "apigateway.amazonaws.com" },
        "Action": "s3:PutObject",
        "Resource": "arn:aws:s3:::你的Bucket名称/dev/directjobfinder/listing.json"
      }
    ]
  }
  

• Axios请求优化
  显式指定Content-Type，避免触发额外预检逻辑：

  axios.put('/dev/directjobfinder/listing.json', 你的请求数据, {
    headers: { 'Content-Type': 'application/json' }
  })
  

验证方法 #

部署完成后，使用浏览器开发者工具的Network面板，确认OPTIONS请求返回200状态，且响应头包含正确的CORS配置字段。

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