简体   繁体   中英

React: Axios Error "Error: Network Error", My react app cannot receive axios.post response

I hava Nodejs Express Backend, React Frontend. I checked if frontend sends a request to the backend and that request is sent to backend. And the backend sends a response to the frontend but cannot receive.

  1. Frontend -- request --> Backend checked. and the request reaches the backend.
  2. Frontend <-- response -- Backend

During the second process, if I receive using postman, it works well. But if I receive using frontend, it is not working and just throw the error "Error: Network error", anymore information isn't provided.

Also I tried React: Axios Network Error and Post request Axios: Network error .

Node js Backend:

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

React Frontend:

const Login = async () => {
    try {
        const res = await axios.post('http://localhost:6382/auth/login', { id: "id", password: "password" }); // ERROR!
    } catch (err) {
        console.log(err); // Displays "Error: Network error"
    }

Additionally, My backend 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(
    `Server listening on : 6382`);
});

What should I do?

Previously had the same issue, I forgot to add proxy to package.json. You have to add it to package.json at front-end files and it should do the trick.

"proxy": your backend url..

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM