在 MERN 应用程序中 npm run build 和 npm start 后出现 CORS 错误和意外端口

问题描述 投票:0回答:1

我正在开发 MERN 堆栈应用程序,面临两个主要问题。首先,尽管将我的应用程序配置为在端口 5000 上运行以用于生产,但在执行 npm run build 和 npm start 后,它继续在端口 3000 上运行。其次,我在尝试在前端和后端之间进行通信时遇到 CORS 错误。

更多详情: 开发环境:在开发过程中,我的后端 Express 服务器在端口 5000 上运行,React 开发服务器在端口 3000 上运行,由于 React 应用程序中的代理设置,没有 CORS 问题。 生产问题: 构建前端并启动应用程序后,意外地在 http://localhost:3000 而不是 http://localhost:5000 上提供服务。 我遇到 CORS 错误,特别指出缺少“Access-Control-Allow-Origin”标头,即使我已在 Express 应用程序中配置了 CORS。

我尝试过的: 确保 server.js 设置为监听 process.env.PORT || 5000 并验证我的 package.json 脚本是否正确。 使用 cors 包在我的 Express 应用程序中实现了 CORS,其配置允许所有来源尝试解决 CORS 错误。 在我的前端中搜索任何可能干扰预期行为的对端口 3000 的硬编码引用。 预期行为: 在生产中应该可以从 http://localhost:5000 访问整个应用程序。 前端向后端发出请求时不应出现 CORS 错误。 实际行为: 该应用程序在 http://localhost:3000 上提供服务,而不是在预期的端口 5000 上。 尝试从前端向后端发出请求时会发生 CORS 错误,表明缺少“Access-Control-Allow-Origin”标头。 问题: 如何确保我的 MERN 堆栈应用程序在生产中的端口 5000 上正确运行并解决前后端通信的 CORS 错误? 构建/启动过程中是否存在我可能遗漏的步骤或用于处理 CORS 的特定配置?

⬇️⬇️⬇️⬇️⬇️⬇️⬇️⬇️

MERN-聊天应用程序

reactjs node.js express cors
1个回答
0
投票

确保 Express 服务器侦听 process.env.PORT || 5000,在生产中设置 PORT 变量。仔细检查前端的端口 3000 引用。检查 CORS 中间件配置,避免使用 * 作为来源。

© www.soinside.com 2019 - 2024. All rights reserved.