我有一个React前端,它使用jwt与Django后端进行身份验证.后端工作正常,使用django视图连接正常,但当我try 代理React的请求时,它会给我一个连接拒绝错误.

代理错误:无法代理请求/api/auth/token/Acquire/from localhost:3000到http://localhost:8000(Econrefused).

连接到http://localhost:8000/api/auth/token/obtain/正常工作.使用Axios发送POST请求也可以正常工作,并返回标记json.但当我用node代理它时,它就不起作用了.

在我的package.json年中,我有:

  "proxy": {
    "/api/*":  {
      "target": "http://localhost:8000"
    }
  },

编辑:Public repo.如果安装了docker,您可以轻松运行.(使用1个图像和2个容器).克隆后只需运行docker-compose build,然后运行docker-compose up.

Edit2:请求的标题:

*General*
Request URL: http://localhost:3000/api/auth/token/obtain/
Request Method: POST
Status Code: 500 Internal Server Error
Remote Address: [::1]:3000
Referrer Policy: no-referrer-when-downgrade

*Response Headers*
HTTP/1.1 500 Internal Server Error
X-Powered-By: Express
Date: Mon, 30 Apr 2018 21:23:17 GMT
Connection: keep-alive
Transfer-Encoding: chunked

*Request Headers
POST /api/auth/token/obtain/ HTTP/1.1
Host: localhost:3000
Connection: keep-alive
Content-Length: 45
Pragma: no-cache
Cache-Control: no-cache
Origin: http://localhost:3000
User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_4) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/65.0.3325.181 Safari/537.36
Content-Type: application/json
Accept: */*
Referer: http://localhost:3000/login
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9,fr;q=0.8,ja;q=0.7

推荐答案

所以问题是因为Node dev环境和Django dev环境都在单独的docker容器中运行,所以localhost指的是 node 容器,而不是桥接网络.

所以关键是使用容器链接,当使用docker-compose时会自动创建容器链接,并将其用作主机名.所以我把它改成了

"proxy": {
    "/api":  {
        "target": "http://django:8000"
    }
},

如果要手动启动同一个文件,请指定"外部链接"与"外部链接"在同一个容器中的作用时间,否则请指定"外部链接"与"外部链接"在同一个容器中的作用时间.

Reactjs相关问答推荐

Redux向后端发送请求时出现钩子问题

可选链和useState挂钩

包装组件可以避免子组件重新渲染.?

利用OVERPASS API端点计算某建筑的表面积

当我try 部署我的Reaction应用程序时,为什么在此PrevState语句中收到语法错误?

有没有可能在next.js和ssr中使用tsps?

使用自动播放的视频组件呈现登录页面时出现JEST测试错误

ReactJS:唯一项目的数量总和

验证 Yup 中的对象项

React Native 背景动画反转

我应该如何将字符串作为props 传递给 React 组件?

React - 错误边界未捕获错误

将 useState 设置为组件内部的值

DatePicker MUI 如何在日历左侧显示清除文本

如何通过 React JS 中的映射将新元素添加到对象数据数组中

我刚刚部署了我的 Vite React 站点,但我的图标/图像没有部署

使用 react-router-dom 时弹出空白页面

渲染的钩子比预期的少.这可能是由 React Hooks 中意外的提前返回语句引起的

在 redux 工具包中使用 dispatch 发送多个操作

错误(未捕获的类型错误):无法读取未定义的属性(读取参数)