angularjs-为什么http请求通过resolve返回false？

Question

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

这是我关注的小提琴-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 else 中发出警告消息，无论如何它总是进入 else 条件。

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

为什么会这样？我对 Angular 很陌生。这是角度的限制吗？

Answer 1

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

您的 return 语句在 $http.post 回调中 NOT isLogin 因此 isLogin return 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

代码未经测试，仅供参考。