AngularJS $http error callback not executed

Just found a solution to my problem and thought it would be a good idea to share it. Few days ago we changed our structure and we are now using factories to call our API and return promises.

Unfortunately, we realized that since we made this change our error callbacks were not executed anymore.

I first thought the problem was linked somehow to the server return as we changed the way we handle exceptions. But it was not.

The real weird thing was that we were always going into the success callback and never into the error one even with an error 500 or 404 or whatever…

So I googled it (quite a lot) and then found this brilliant stackoverflow answer which gives the right answer (for me) on the second answer.

Here was my problem. I was intercepting the errors like this:

return {
$httpProvider.interceptors.push(function ($timeout, $q, $injector) {
...
	responseError: function (rejection) {
		if (rejection.status === 403) {
			growl.error('Access denied');
			return rejection;
		}

		if (rejection.status !== 401) {
			return rejection;
		}
	}
...

But as it says on SO answer it should have been:

return {
$httpProvider.interceptors.push(function ($timeout, $q, $injector) {
...
	responseError: function (rejection) {
		if (rejection.status === 403) {
			growl.error('Access denied');
			return $q.reject(rejection);
		}

		if (rejection.status !== 401) {
			return $q.reject(rejection);
		}
	}
...

Indeed in case your promise gets rejected, you need to return it otherwise Angular thinks that everything is fine and go through the success callback!

Hope this helps!