AWS Elastic Beanstalk上的CORS

Question

我是一个新手，使用AWS并使用以下工具：

• Elastic Beanstalk 部署我的Node Rest API（api.example.com）。
• S3 Bucket 以及 Cloudfront 来呈现我的React静态网站（example.com）。

在从网站调用API端点时，浏览器会给出CORS错误。如何防止这种情况发生？

在Node项目中，我正在使用以下代码进行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的评论

我还在存储桶中配置了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

感谢您提前的帮助。

附言 - 我也看到有些帖子给出了项目代码中可能存在的错误，但是所有端点在 POSTMAN 上都可以正常工作。

- Aman Kumar

---

你在存储桶上也配置了CORS吗？ - arudzinska

是的，我已经在桶里完成了那个操作，请查看更新后的问题。 - Aman Kumar

你找到解决方案了吗，@Aman？ - ZeferiniX

请检查我的答案 @ZeferiniX - Aman Kumar

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>

- Aman Kumar

---

我也遇到了同样的问题。请问这个文件在哪里可以找到？ - RZKY

@RZKY 前往 S3 -> 您的 Bucket -> 权限 -> CORS 配置 - Aman Kumar

两者都对我不起作用，尝试添加配置和添加app.use(cors())。 - zIronManBox