Angular.js: HTTP Response with status 500 still gets the .success function executed

[aruizca]

Using Angularjs version 1.0.8 and 1.0.7

I have this function and at server side I just added an unchecked exception to see if my AngularJS code handles server side errors when performing Ajax request using the $http service:

this.save = function(formData, successCallback, baseRelativeUrl) {
    $http.post(baseRelativeUrl + '/save', formData)
        .success(function (data, status, headers, config) {
            successCallback(data);
        })
        .error (function (data, status, headers, config) {
            $rootScope.$emit('displayAlerts', [{type: 'error', msg: 'There was a server side error'}]);
        });
};

Despite the response status code being 500, the success function is being executed and the error function ignored.

Thank in advance for your help!

[firstdoit]

I can confirm this also happens for 404 codes, and also in angular version "1.2.0-rc.2".

[pkozlowski-opensource]

@aruizca @gadr could you please provide a minimal plunker with a reproduce scenario?

[firstdoit]

I got the problem.

http://jsfiddle.net/gadr/G3F8K/

I had a bad interceptor which didn't _reject the rejection_. It's not $http's fault at all.

I dont think the interceptor should have to do this, but still... There it is. Toggle the commented lines and watch as it works properly.

[clouddueling]

I'm running 1.2 rc2 and .error() ran instead of .success() on a 500 error.

Nothing crazy happening here, just a returned promise from a service.

[aruizca]

@gadr is right. I also had an interceptor to detect ajax request and that was causing the problem. You can see my interceptor here. I will study @gadr fiddle to see if I can fix it:

    .config(function($httpProvider) {
        var numLoadings = 0;
        $httpProvider.responseInterceptors.push(function() {
            return function(promise) {
                numLoadings++;
                $('body').css('cursor', 'wait');
                var hide = function (r) {
                    if (!(--numLoadings)) {
                        $('body').css('cursor', 'auto');
                    }
                    return r;
                };
                return promise.then(hide, hide);
            };
        });
    })

[aruizca]

My interceptor to display a loading spinner was wrong indeed. Thank you very much all for your help!!!

I got the correct code from here: http://jsfiddle.net/zdam/dBR2r/

Cheers,

[firstdoit]

You're welcome :) There's a nice gist about interceptors here: https://gist.github.com/gnomeontherun/5678505

[micronyks]

Oh God ! I faced the same problem. Cause: I was using httpRequestInterceptor for displaying spinner. I resolved my issue with the help of this thread. Many thanks !

[binarybaba]

4 years in and I also ran into this problem. Had a hacky interceptor written. Thank you @firstdoit.
Refactor time.