带有 express 后端的 React 应用程序存在 CORS 问题。 (我正在使用 docker)

编程入门 行业动态 更新时间:2024-10-07 05:29:15

带有 express 后端的 React <a href=https://www.elefans.com/category/jswz/34/1771452.html style=应用程序存在 CORS 问题。 (我正在使用 docker)"/>

带有 express 后端的 React 应用程序存在 CORS 问题。 (我正在使用 docker)

我一直面临着 docker 和 CORS 的一个非常尴尬的问题。 相同的代码在本地机器上完美运行。 我正在使用 npm 包 cors。 我的后端在 pert 3000 上运行,前端在 4000 上运行。 这是我的 app.ts 文件中的代码。

this.app.use((req, res, next) => {
      
        // TODO Add origin validation
        res.header('Access-Control-Allow-Origin', '*');
        res.header('Access-Control-Allow-Credentials', true);
        res.header('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE');
        res.header('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept, Authorization, Cache-Control, Pragma');
      
        // intercept OPTIONS method
        if (req.method === 'OPTIONS') {
          res.sendStatus(204);
        } else {
          next();
        }
      });
    this.app.options('*', cors());

这是我的配置文件的代码

allowedDomains: ["http://localhost:3000","http://localhost:4000"]

我还在 package.json 文件中添加了代理

    "proxy": "http://localhost:3000/api"

这里是浏览器控制台的错误

编辑

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:3000/api/lighting/lighting. (Reason: CORS request did not succeed). Status code: (null).

编辑2

Access-Control-Allow-Origin *

当我仅向 api 发出请求时,即在 3000 端口上,这是在响应标头中出现的,但是当我向前端发出请求时,这不会出现。

但仍然没有运气。 我已经在这个问题上停留了 2 天多了。 非常感谢任何帮助。 谢谢

回答如下:

更多推荐

带有 express 后端的 React 应用程序存在 CORS 问题。 (我正在使用 docker)

本文发布于:2024-05-30 12:22:52,感谢您对本站的认可!
本文链接:https://www.elefans.com/category/jswz/34/1770493.html
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系,我们将在24小时内删除。
本文标签:应用程序   后端   express   React   docker

发布评论

评论列表 (有 0 条评论)
草根站长

>www.elefans.com

编程频道|电子爱好者 - 技术资讯及电子产品介绍!