Getting response code 401 causes skipping code blocks

Question

I'm writing an ionic v1/express/mongo/node app. When checking if the user is authenticated i have the following piece of code:

checkAuthentication: function(token) {
            console.log(token);
            return $http.get("http://validUrl/test", {
                headers: {
                    'testingAuth': token
                }
            }).then(function(result) {
                return result.data;
            });
        }

and am calling it like this:

checkAuthentication(token).then(function(response) {
            console.log("testing response: " + response);
            // if a valid token is already in storage = response contains "Success"(?), just $state.go to main page, else call the login() function
            if (response.content === "Success") {
                // $state.go main page
            } else {
                console.log("could not log in");
            }
        })

The problem is, when I get back code 401 from the server, I somehow skip the then block in the checkAuthentication function. Execution doesn't stop at a breakpoint at "return result.data", or "console.log("could not log").

Am I doing something obviously wrong? Is there something i need to do to force going into that block? Thanks for any advice.

Answer 1

The issue is with your error handling ! I took the liberty to modify your code and the way to do a $http call. Here is the working plunker for the same.

If you observe the $scope.login() function I've injected the service object and invoked the checkAuthentication() function which does the HTTP call.As you are using .then for http calls, angular provides provision to use two functions for success and error callbacks where your HTTP errors go when HTTP calls fail.

Here is the angular doc for the same.

In your example you don't have error callback method hence it doesn't go into your if else conditions.

var app = angular.module("App", []);
app.controller('AppCtrl', ['$rootScope', '$scope', '$http', 'Service', function($rootScope, $scope, $http, Service) {


  $scope.login = function(token) {
  //call the injected service in the function for HTTP call..
    Service.checkAuthentication(token).then(function(response) {
      console.log("testing response: " + response);
      // if a valid token is already in storage = response contains "Success"(?), just $state.go to main page, else call the login() function
      if (response.content === "Success") {
        // $state.go main page
      } 
    },function(error){
      console.log(error);
      console.log("could not log in due to error...");
    });
  };


}]);
//use angular services to do a http call for better code maintainability...
app.service('Service', ['$http', '$rootScope', function($http, $rootScope) {

  return {
    checkAuthentication: function(token) {
      return $http.get("http://validUrl/test", {
        headers: {
          'testingAuth': token
        }
      });
    }
  };
}]);