How to catch NetworkError in JavaScript?

Question

In Chrome's JavaScript console, if I run this:

var that = new XMLHttpRequest();
that.open('GET', 'http://this_is_a_bad_url.com', false);
that.send();

I get an intentionally expected error:

NetworkError: A network error occurred.

I want to catch this, so I use:

var that = new XMLHttpRequest();
that.open('GET', 'http://this_is_a_bad_url.com', false);
try {
  that.send();
} catch(exception) {
  if(exception instanceof NetworkError) {
    console.log('There was a network error.');
  }
}

However, I get an error about NetworkError not being defined:

ReferenceError: NetworkError is not defined

How can I catch NetworkError?

Answer 1

I think what you meant was:

if(exception.name == 'NetworkError'){
   console.log('There was a network error.');
}

I don't believe the Error is an instance of NetworkError, but thrown in this manner:

throw {
   name: 'NetworkError',
   message: 'A network error occurred.'
   // etc...
}

Answer 2

I found this answer while looking for a way to examine a Network Error I got while using Axios, so if You are not using Axios, this answer is probably not for You.

The error object I receive through Axios has config, request and response attributes, and both the request and response have the status attribute. response object's attribute is displayed in the image below:

My axios configuration looks like this:

this.client = axios.create(options);
this.client.interceptors.response.use(this.handleSuccessResponse, this.handleErrorResponse);
this.unauthorizedCallback = () => {};

and the handleErrorResponse method is:

handleErrorResponse(error) {
  // use the information from the error object here
}

Answer 3

Look into the onreadystatechange event. You can get the status of the response.

Answer 4

exception.name returns 'Error' even on network errors a better way can be checking if error has url config like this :

if(exception.config && exception.config.url){
  // network error
} else {
  // other errors
}