Question

尽管在SO上阅读并实现了各种解决方案，但我对CORS还是有疑问。

我有一个使用Express / NodeJS作为api和React JS作为前端的应用程序。在开发中，react应用word[0] == 'J'可以与word[word.length - 1] == 't'的快速后端http://localhost:3000对话。

现在我正在尝试在生产环境中使用此应用。

两个应用程序都保存在单独的git存储库中。 React被部署为AWS S3上的静态网站，并且运行良好。节点JS部署在Elastic Bean Stalk上，并且处于就绪状态。我有一个连接到ebs实例（节点应用程序）的Postgres SQL数据库，可以在pgadmin4中连接到该数据库。

两个应用都在路由53 http://localhost:9000中使用相同的基本域。

两者都配置为侦听https / 443。我可以同时访问URL app.use(cors())和myproject.com，它们看起来就像它们在我的本地主机环境中一样。

当我尝试在我的网站上注册用户时，我遇到此错误：

https://myproject.com

两个应用程序都可以互相“看到”，但这就是结束的地方。查看我的代码，我不知道问题出在哪里：

server.js

https://api.myproject.com

我尝试过的方法：这些解决方案中的大多数都来自以下SO帖子：Why doesn't adding CORS headers to an OPTIONS route allow browsers to access my API?

仅使用Access to XMLHttpRequest at 'https://api.myproject.com/users/signup/' from origin 'https://myproject.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.

使用通配符const express = require('express'); const cors = require('cors'); const logger = require('morgan'); const bodyParser = require('body-parser'); require('dotenv').config(); const PORT = process.env.PORT || 9000; // DEV const app = express(); const corsOptions = { origin: 'https://myproject.com', optionsSuccessStatus: 200 // some legacy browsers (IE11, various SmartTVs) choke on 204 } const allowCrossDomain = function (req, res, next) { res.header('Access-Control-Allow-Origin', 'https://myproject.com'); res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE'); res.header('Access-Control-Allow-Headers', 'Content-Type'); next(); } app.use(cors()); const { userRouter } = require('./routes/userRouter'); app.use(logger('dev')); app.use(bodyParser.json()); app.use(allowCrossDomain); app.use((e, req, res, next) => { res.header("Access-Control-Allow-Origin", "https://myproject.com"); res.header('Access-Control-Allow-Methods', 'DELETE, PUT, GET, POST'); res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); if (e) { console.log(e); res.status(500).send(e.message); } next(); }); app.use('/users', userRouter); app.listen(PORT, () => { console.log(`Express server is listening on PORT ${PORT}.`); });// - TESTING代替域名。

用cors白名单列出我的域名（来自此博客文章）：https://daveceddia.com/access-control-allow-origin-cors-errors-in-react-express/

app.use(cors());

我还按照另一StackOverflow帖子中的建议将*移到了我的路线上方。

在这一点上，我被困住了，不胜感激，在此先感谢您。

Answer 1

尝试通过这种方式要求cors：

const cors = require('cors')({
    origin: 'https://yourdomain.com',
});

这样，您可以添加起点，然后只需在快速应用顶部调用app.use（cors（））

const app = Express();
app.use(BodyParser.json());
app.use(cors);

这是我通常可以正常工作的方式。您可能要处理的另一个因素是，如果域尚未完全传播，这可能会导致aws的区域无法识别域的dns。不过那只是一个理论。

react / express之间的CORS标头问题

server.js

1 个答案: