Axios returns a generic "Network Error" even when the request got a response code

Describe the bug

When making a request to my API, the catch block has a generic “Network Error” message, but when checking in the network inspector the request got a response code 413. This causes my users to incorrectly report that ‘the website thinks i dont have a solid internet connection’. I suspect this happens for other codes too because this has been going on for a while.

To Reproduce

Make a request with a very large payload to trigger a 413 response

Expected behavior

The catch block should have the response code

Environment

• Axios Version: 0.25.0 and 0.21.2
• Adapter: xhr (i think? i dont remember changing this, so i guess whatever is default?)
• Browser: Chrome
• Browser Version: 97.0.4692.99
• Node.js Version: 14.18.1
• OS: OSX 12.1

Additional context/Screenshots

axiosInstance
    .post("/results/add", {
      result: completedEvent, //this is very big
    })
    .then((response) => {
      // handle response
    })
    .catch((e) => {
        console.log(e);
        //this console logs Error: Network Error
        // at createError (monkeytype.js:formatted:35086:25)
        // at XMLHttpRequest.handleError (monkeytype.js:formatted:34457:28)
    });

My axios instance code: https://github.com/Miodec/monkeytype/blob/master/src/js/axios-instance.js

[lincolnzera1]

In my case, the CORS was blocking the frontend from acessing the backend. My Solution: Add this in the server-side:

                 Using npm, install 'cors':
                  npm i cors
                  
                  And add this lines to the code:

                  let cors = require("cors");
                  app.use(cors());

[orengatigno]

it’s CORS problem, once you resolve the CORS issue (for example install CORS Unblock extension plug in Chrome) it will retrieve the response code (for me it was 504)