Catch() not handling 404

Question

I'm making a script to fetch some data from my api:

const success = (response) => {
  console.log(response);
};

const failed = (error) => {
  console.log(error);
};

axios.$http.get('/somedata')
  .then((response) => {
    success(response.data);
  })
  .catch((error) => {
    failed(error);
  });

/somepage is a non-existing page so it returns a 404. But the catch is not handling this. Why not? In my console I have the error TypeError: Cannot read property 'data' of undefined. Why does it not run the failed() function? I don't understand.

Possible duplicate of [Promise : then vs then + catch](http://stackoverflow.com/questions/33278280/promise-then-vs-then-catch) — CMedina, Dec 02 '16 at 22:58
seems this has potentially been an issue in the past, take a look at this thread: https://github.com/mzabriskie/axios/issues/41 and maybe check out what your 'validateStatus' config is set to (information on that can be found in the README: https://github.com/mzabriskie/axios/blob/master/README.md) — roger, Dec 02 '16 at 23:12
Thank you, see my own answer. You pointed me in the right direction ;) — Jordy, Dec 02 '16 at 23:21
Possible duplicate of [fetch resolves even if 404?](https://stackoverflow.com/questions/39297345/fetch-resolves-even-if-404) — Velimir Tchatchevsky, Oct 09 '18 at 21:22

score 1 · Answer 1 · answered Dec 02 '16 at 23:21

1

Found out it was related to a custom interceptor handling 401-errors (but not 404 errors)...

answered Dec 02 '16 at 23:21

Jordy

4,719
11
47
81

Presumably you mean "... a custom interceptor, which is designed to handle 401-errors and which *should* re-throw all others ... but doesn't"? – Roamer-1888 Dec 03 '16 at 06:53

score 0 · Answer 2 · answered Dec 02 '16 at 23:05

0

Judging by the error message, it looks like "success(response.data);" is being called. Is it possible the server is successfully returning a page that says something like "Error 404" rather than actually returning http response code 404?

answered Dec 02 '16 at 23:05

Rocky Sims

3,523
1
14
19

score 0 · Answer 3 · answered Dec 04 '16 at 01:53

You could impliment a check for 404s.

axios.$http.get('/somedata')
  .then(response => {
    if(response.status !== 404) //or any status code really
        success(response.data);
    else
        failed(response)
  })
  .catch((error) => {
    failed(error);
  });

Then again what you probably want to check for is to make sure it's a 200 that returns.

axios.$http.get('/somedata')
  .then(response => {
    if(response.status === 200)
        success(response.data);
    else
        failed(response)
  })
  .catch((error) => {
    failed(error);
  });

Catch() not handling 404

3 Answers3