AngularJS 身份验证

Question

在我说得更远之前，我希望有人能告诉我我是否正确处理了这种情况，或者是否有一个更简单的方法我只是缺少。我们有一个使用 AngularJS 和 Web API 制作的网页。我们现在正在处理用户尝试访问某些页面时的身份验证。我们有一个名为“权限”的模块，目前用于此目的，如下所示。

angular.module('permissions', []).factory('permissions', function (LoginApi, $q) {
//this is the variable which will hold the user, fetch it from the server - will return null if not authenticated
var storedUser;

function currentUser() {
    var deferred = $q.defer();

    if (!storedUser) {
        storedUser = LoginApi.get(function () {
            deferred.resolve(storedUser);
        })
    }
    else {
        deferred.resolve(storedUser);
    }

    return deferred.promise;
}

//define the permissions object that's exposed publicly
return {

    setUser: function (user) {
        storedUser = user;
    },
    isInRole: function (roleName) {
        var promise = currentUser();
        promise.then(function() {
            if (!storedUser || !storedUser.roles) {
                return false;
            }

            //if roleName is in currentUserRoles, then return true
            if (storedUser.roles.indexOf(roleName) > -1) {
                return true;
            } else {
                return false;
            }
        }, function(reason) {
            return false;
        });
    },
    isLoggedIn: function () {
        var promise = currentUser();
        promise.then(function() {
            if (!storedUser) {
                return false;
            } else {
                return true;
            }
        }, function(reason) {
            return false;
        });
    },
    firstName: function () {
        var promise = currentUser();
        promise.then(function () {
            if (!storedUser) {
                return '';
            }

            return storedUser.firstName;
        }, function (reason) {
            return '';
        });
    },
    lastName: function () {
        var promise = currentUser();
        promise.then(function () {
            if (!storedUser) {
                return '';
            }

            return storedUser.lastName;
        }, function (reason) {
            return '';
        });
    },
    email: function () {
        var promise = currentUser();
        promise.then(function () {
            if (!storedUser) {
                return '';
            }

            return storedUser.email;
        }, function (reason) {
            return '';
        });
    }
};
});

正如你所看到的，我正在使用一个 promise ，让我的电话等待我让用户登录(如果有用户登录)。我可以正常工作，但现在我的问题是，在我网站上的任何功能中，处理权限，看起来我也需要添加 promise 和延迟，因为当前调用不等待权限函数运行。使用此功能的示例位于 rootScope 上的我的routeChange 事件中，如下所示

$rootScope.$on("$routeChangeStart", function (event, next, current) {

    if (next.access == "All")
    {
        //do nothing
    }
    else if (next.access == "User") {
        if ($rootScope.permissions.isLoggedIn()) {
            //do nothign they have permissions required
        } else {
            // not going to #login, we should redirect now
            $location.path("/login");
        }
    }
    else if (next.access == "Admin") {
        if ($rootScope.permissions.isInRole('Admin_Base')) {
            //do nothign they have valid permissions
        } else {
            // not going to #login, we should redirect now
            $location.path("/403");
        }
    }
});

所以基本上，即使在权限范围内，我的功能也会推迟到用户返回为止。调用这些函数的函数不会延迟，因此每次检查权限时基本上都会返回 false。我认为我可以通过在权限调用中添加 promise 来解决这个问题，但我想知道是否有更简单的方法来处理我所缺少的这个问题。

Answer 1

尝试在登录回调中广播事件。

$rootScope.$broadcast('event:login-confirmed');

然后只需将该事件用于您的“开启” watch 即可。

$rootScope.$on("event:login-confirmed", function (event, next, current) { ...