React: Axios错误 "Error: Network Error", 我的React应用无法接收axios.post的响应

10 浏览
0 Comments

React: Axios错误 "Error: Network Error", 我的React应用无法接收axios.post的响应

我有一个Node.js Express后端和React前端。

我检查了前端是否向后端发送了请求,并且该请求已发送到后端。

后端向前端发送了响应,但无法接收。

  1. 前端--请求-->后端检查。请求已到达后端。
  2. 前端<--响应--后端

在第二个过程中,如果我使用postman接收,则运行正常。

但是,如果我使用前端接收,则无法工作,并且只会抛出错误“错误:网络错误”,没有提供更多信息。

我还尝试了React: Axios Network Error

Post request Axios : Network error

Node.js后端:

export const Login = async (req: Request, res: Response, next:NextFunction) => {
        console.log("登录成功");
        res.json({ code: 200, token: "token" });
}

React前端:

const Login = async () => {
    try {
        const res = await axios.post('http://localhost:6382/auth/login', { id: "id", password: "password" }); // 出错!
    } catch (err) {
        console.log(err); // 显示“错误:网络错误”
    }
}

此外,我的后端

app.js

import * as express from 'express';
import * as cors from 'cors'
import * as helmet from 'helmet';
class App {
    public app: express.Express;
    constructor() {
        this.app = express();
        this.initializeMiddlewares();
    }
    private initializeMiddlewares() {
        this.app.use(helmet());
        this.app.use(cors());
        this.app.use(express.json({limit:"100mb"}));
        this.app.use(express.urlencoded({limit:"100mb", extended:true}));
    }
}
export default App;

server.ts

import App from './app';
const { app } = new App;
app.listen(6382 ,() => {
  console.log(
    `服务器监听:6382`);
});

我应该怎么做?

0
0 Comments

问题的出现原因是忘记在package.json中添加proxy。解决方法是在前端文件的package.json中添加proxy字段,并将其设置为后端的url。例如:"proxy": "http://localhost:6382/"。然而,这样做后又出现了新的错误:"WebSocket connection to 'ws://localhost:3000/ws' failed: WebSocket is closed due to suspension.",且"Error: Network error"仍然持续出现。尝试将cors的两个属性origin和credentials设置为true后,前面的错误消失了,但网络错误仍然存在。

0