Post request Axios : Network error

Question

I'm using NodeJS for the backend, and ReactJS for the frontend.

I've a problem with request Axios network. All my Get request work. But Post request don't work. I have just this error "network error"

I created a simple webservice to show you my problem :

//Serveur code

helloWs : (request:Express.Request, response:Express.Response) => {
        try {
            response.send('hello WS !')
        } catch (error) {
            console.error(error)
            response.send('error' + error + 'status : ' + error.response.status)     
            response.end()    
        }
    }

//Here I create my root 
router.post('/helloWs',DocumentController.helloWs)

//This is my front

 axios.post('http://localhost:9000/1/documents/helloWs', { 
 }) .catch(function (error) {
                if (error.response) {
                    console.log('Error data : ', error.response.data);
                    console.log('Error status : ', error.response.status);
                    console.log('Error headers : ', error.response.headers);
                } else if (error.request) {
                    console.log('Error request : ', error.request);
                } else {
                    console.log('Error message : ', error.message);
                }
                console.log(error.config);
            })

In the navigator console, I've just network error , and my webservice is in OPTION and not in "POST"

I'm trying to add header in axios, but it doesn't work. I specify that I've tested with postman, and it's okay. Do you have an idea ? Thank you

Answer 1

It is most likely a cors related error, the OPTION request is made by the browser before the actual request to check if your domain has the rights to access the resource.

Postman doesn't do the preflight request that's why you get the response

try adding this middleware in your server side code before defining the routes

app.use(function(req, res, next) {
  res.header("Access-Control-Allow-Origin", "*");
  res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
});