How do I get the HTTP response status code in AngularJS 1.2

Question

Using ngResource in AngularJS 1.2rc(x), how do I get the status code now?

RestAPI.save({resource}, {data}, function( response, responseHeaders )         


        

Answer 1

You must add an interceptor inside your resource declaration. Like this:

var resource = $resource(url, {}, {
    get: {
        method: 'GET'
        interceptor: {
            response: function(response) {      
                var result = response.resource;        
                result.$status = response.status;
                return result;
            }
        }
    }                            
});

Usage:

resource.get(params, function(result) {
    console.log(result.$status)
});

IMO status code should have been provided by default. There is an issue for this https://github.com/angular/angular.js/issues/8341

Answer 2

I'm using AngularJS v1.5.6, and I do it like this (in my case I put the "getData" method inside a service):

function getData(url) {
    return $q(function (resolve, reject) {
        $http.get(url).then(success, error);

        function success(response) {
            resolve(response);
        }
        function error(err) {
            reject(err);
        }
    });
}

then in the controller (for example), call that like this:

function sendGetRequest() {
    var promise = service.getData("someUrlGetService");
    promise.then(function(response) {
        //do something with the response data
        console.log(response.data);
    }, function(response) {
        //do something with the error
        console.log('Error status: ' + response.status);
    });
}

As documentation says, the response object has these properties:

• data – {string|Object} – The response body transformed with the transform functions.
• status – {number} – HTTP status code of the response.
• headers – {function([headerName])} – Header getter function.
• config – {Object} – The configuration object that was used to generate the request.
• statusText – {string} – HTTP status text of the response.

See https://docs.angularjs.org/api/ng/service/$http

Hope it helps!

Answer 3

For anyone using a newer version of Angular, looks like we've had access to the status code as a 3rd param to the transformResponse function since angular 1.3, but it was never documented properly in the $resource docs.

Answer 4

You can get response status like this:

$http.get(url).then(function(response){
  console.log(response.status); //successful status like OK
}, function(response){
  console.log(response.status); //error status like 400-Bad Request
})

Answer 5

You can use the promiss callbacks then, catch and finally after the $resource call.

For example. If you want to catch an error after a call, you would do something like this:

RestAPI.save({resource}, {data}, callbackFunction).$promise.catch(function(response) {
    //this will be fired upon error
    if(response.status == 500) alert('Something baaad happend');
}).then(function() {
    //this will be fired upon success
});

The response object will have status and the statusText properties. status being an integer status code and statusText the text. You'll also have the data property containing the server response.

edit: as suggested, it was response.status

Answer 6

I think the right answer is a combination of Bardiel's and Ara's answers.

After adding an interceptor inside your resource declaration. Like this:

var resource = $resource(url, {}, {
    get: {
        method: 'GET'
        interceptor: {
            response: function(response) {      
                var result = response.resource;        
                result.$status = response.status;
                return result;
            }
        }
    }                            
});

Use it as below:

RestAPI.save()
.query(function(response) {
    // This will return status code from API like 200, 201 etc
    console.log(response.$status);
})
.$promise.catch(function(response) {
    // This will return status code from server side like 404, 500 etc
    console.log(response.status);
});