angularjs-为什么http请求会在解析时返回false?

时间:2016-07-15 08:58:54

标签: angularjs routing

我有一个登录系统......我正在尝试为网站实施登录/注销功能。

这是我跟随的小提琴 - FIDDLE

这是我的路线档案:

(function() {
  var onlyLoggedIn = function($location, $q, AuthService2) {
    var deferred = $q.defer();

    if (AuthService2.isLogin()) {
      deferred.resolve();
    } else {
      deferred.reject();
      $location.url('/login');
    }
    return deferred.promise;
  };

  angular.module('myApp', [
      'ngRoute',
      'myApp.login',
      'myApp.home',
      'myApp.logout',
      'myApp.notifications'
    ])
    .factory('AuthService2', ["$http", "$location", function($http, $location) {
      //var vm = this;
      var baseUrl = 'api/';

      return {

        isLogin: function() {
          var token;
          if (localStorage['entrp_token']) {
            token = JSON.parse(localStorage['entrp_token']);
          } else {
            token = "";
          }
          var data = {
            token: token
          };
          $http.post(baseUrl + 'validateUserToken', data).success(function(response) {
            if (response.msg == "authorized") {
              //console.log(response.msg);
              return localStorage.isLogged === "true";
            } else {
              return localStorage.isLogged === "false";
            }
          });
        }
      }
      return {
        isLogin: isLogin
      };
    }])

  .config(['$routeProvider', function($routeProvider) {
    $routeProvider
      .when('/login', {
        controller: 'LoginController',
        templateUrl: 'app/components/login/loginView.html',
        controllerAs: 'vm'
      })
      .when('/home', {
        controller: 'HomeController',
        templateUrl: 'app/components/home/homeView.html',
        resolve: {
          loggedIn: onlyLoggedIn
        },
        controllerAs: 'vm'
      })
      .when('/logout', {
        controller: 'LogoutController',
        templateUrl: 'app/components/login/loginView.html',
        resolve: {
          loggedIn: onlyLoggedIn
        },
        controllerAs: 'vm'
      })
      .when('/notifications', {
        controller: 'NotificationsController',
        templateUrl: 'app/components/notifications/notificationsView.html',
        resolve: {
          loggedIn: onlyLoggedIn
        },
        controllerAs: 'vm'
      })

    .otherwise({
      redirectTo: '/login'
    });
  }]);

})();

用户将访问登录页面。验证后,我设置了一个会话和一个本地存储令牌。

我使用resolve来检查用户是否有效。我为此定义了一个函数(你可以从代码中看到它)。

登录后,我能够验证用户并设置会话,登录控制器将有效用户重定向到主页。但是用户到达路线并且他自己停留在登录页面中。

我的http请求没问题。我检查了它,它返回了正确的结果。但我认为该函数返回false,并且只有http请求被执行。因为我可以在consoel中看到http请求并且它返回正结果,所以用户应该被导航但是它没有发生,因为http请求被延迟或者什么。

我尝试在其中发出警告信息,如果不是这样的话,无论如何,它总是会转到其他条件。

 if (AuthService2.isLogin()) {
      deferred.resolve();
    } else {
      deferred.reject();
      $location.url('/login');
    }

为什么会这样?我对ANgular非常陌生。这是角度的限制吗?

1 个答案:

答案 0 :(得分:3)

问题是isLogin函数中没有return语句。

你的return语句在$ http.post回调中不是isLogin因此isLogin返回undefined因此解析为falsy。

$http.post(baseUrl + 'validateUserToken', data).success(function(response) {
        //Notice that you are inside function(response) closure.
        if (response.msg == "authorized") {
          return localStorage.isLogged === "true";
        } else {
          return localStorage.isLogged === "false";
        }
      });

我可以建议你返回$ http.post,$ http.post返回一个你可以这样使用的promise对象,下面是一个关于你如何做的简短例子。

isLogin: function() {
      //Omitted some code
      //This method return a promise object
      return $http.post(baseUrl + 'validateUserToken', data);
      });


AuthService2.isLogin().then(function(res){
    if (response.msg == "authorized") {
      deferred.resolve();
    } else {
      deferred.reject();
      $location.url('/login');
    }
}, errorCallback); //Optional if you want to handle when post request failed

代码未经过测试,只是为了给您提供这个想法。