How do I get the status code back from a failed ajax call in RxJS so I can decide what to do with it?
import { ajax } from 'rxjs/observable/dom/ajax'
ajax('https://my.url')
.map(xhr => console.log('woo', xhr.response))
.catch(err => console.log('status code??'))
there are some fields on the err response and one of them is status but it's always 0 irrespective of the statusCode.
I missed the fact that you see error.status so the question is just that why it's zero.
It's a browser thing. It's zero by default, and only gets changed when the request actually comes back. If it does not for any reason complete, it remains zero. That includes aborted requests, CORS issues, being offline, DNS issues, and any other network error. Which makes sense, cause there are no HTTP codes for most of these cases. A CORS request error might itself have a 401 (or other code) but the browser does not expose it to you programmatically.
Unfortunately, when this happens there's not much you can do programmatically to know what caused it. You can check navigator.onLine and if it's false might infer that it was caused by not being connected to the internet, though that's not 100% reliable.
In other cases, you're screwed, programmatically. There's no error message property with an explanation or other way to know. The true reason the error is typically in the dev console (so check there), but not accessible programmatically for security reasons.
Here are some additional resources about this:
In v5 (and at least in v4 too), status is available as a top-level property status of the provided error object:
import { ajax } from 'rxjs/observable/dom/ajax'
ajax('https://my.url')
.map(xhr => console.log('woo', xhr.response))
.catch(err => {
console.log('status code', error.status);
// also available as error.xhr.status (inside the raw XMLHttpRequest object)
return Observable.empty(); // switch to an empty stream i.e. swallow error
});
Note that catch is used to catch an error and then switch to a different Observable that you must return. So the error must be handled. If you do not want to handle the error, but just want to log it, you can use do:
ajax('https://my.url')
.map(xhr => console.log('woo', xhr.response))
.do({ error: err => console.log('status code', err.status) })
As per documentation: https://github.com/Reactive-Extensions/RxJS-DOM/blob/master/doc/operators/ajax.md
You do it like below:
ajax('https://my.url')
.map(xhr => console.log('woo', xhr.response))
.catch((err, status) => console.log(status))
