angularjs Interceptor:why is it not receiving the proper status code and message in $http interceptor

Question

I am making a simple get request using $http .and it fails with 503-service unavailable error which is clearly shown in the network tab .But the rejection object in the responseError interceptor object shows status: 0.

Here is my Interceptor

angular.module("app", []).config(function($httpProvider){
$httpProvider.interceptors.push(function($q) {
  return {
   'responseError': function(rejection) {
       console.log(rejection);
    }
  }
})
});

I am expecting status code 503 in the interceptor but i am getting 0.Please help me to understand and resolve the issue.

Here is a fiddle illustrating the issue.

The request is a cross domain request.

Answer 1

The service you are using does return any data. Angular $http expects some data to be returned, and in this case "GetStatusCode" just stops and does not return anything.

Also, fyi - your fiddle does not respect angular's method of binding to a controller, which expects a string for the controller name.

See http://plnkr.co/edit/x46D5FIsgaKsaSocYjpz?p=preview for proper markup.. where we name the controller as a string, for ex:

angular.module("plunker", [])

    .config(function ($httpProvider) {
        $httpProvider.interceptors.push(function () {
            return {
                'responseError': function (rejection) {
                    console.log('rejection = ', rejection);
                },
                'response': function (response) {
                    console.log('response = ', response);
                }
            }
        })
    })

    .controller('Controller', function Controller($scope, $http) {
        $scope.getCode = function () {
            var req = 'http://www.reddit.com/r/catpictures.json?limit=50&jsonp=JSON_CALLBACK';
            return $http.jsonp(req);
        };
        $scope.get = function () {
            return $scope.getCode()
        };
    })
;