AWS Elastic beanstalk 上的 CORS

Question

我是 AWS 的新手并且使用过

• Elastic beanstalk在节点中部署我的 rest API (api.example.com)
• 我在 React 中的静态网站 (example.com)和带有cloudfront 的S3 存储桶。

从网站调用 API 端点时，浏览器给出 CORS 错误。我怎样才能防止这种情况？

我在 CORS 的节点项目中使用以下代码

app.use((req, res, next) => {
  res.header('Access-Control-Allow-Origin', '*')
  res.header('Access-Control-Allow-Credentials', true)
  res.header('Access-Control-Allow-Methods', 'POST, GET, OPTIONS')
  res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept')
  next();
});

编辑- 基于 arudzinska 的评论

我还在bucket中配置了CORS

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>*</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
</CORSRule>
</CORSConfiguration>

并且服务器在nginx 上

在此先感谢您的帮助

PS - 另外，我已经看到很少有帖子给出原因，因为项目代码中会有一些错误，但所有端点都在POSTMAN上正常工作。

Answer 1

我已将 AWS 中的 CORS 配置更新为并且有效

<?xml version="1.0" encoding="UTF-8"?>
<CORSConfiguration xmlns="http://s3.amazonaws.com/doc/2006-03-01/">
<CORSRule>
    <AllowedOrigin>http://localhost:3000</AllowedOrigin>
    <AllowedOrigin>https://example.com</AllowedOrigin>
    <AllowedMethod>GET</AllowedMethod>
    <AllowedMethod>HEAD</AllowedMethod>
    <AllowedMethod>DELETE</AllowedMethod>
    <AllowedMethod>PUT</AllowedMethod>
    <AllowedMethod>POST</AllowedMethod>
    <AllowedHeader>*</AllowedHeader>
</CORSRule>
</CORSConfiguration>