AngularJS 怎么做身份验证

如果要在客户端使用AngularJS做身份验证的话，推荐使用service来做，因为service是单例的，可以很方便的在所有 view，controller，directives，filters和其他service中共享数据，而不用采取暴露全局变量的方式，封装性也有一定的保障。

一个简单的例子：

services.factory('UserService', [function() {
    var sdo = {
        isLogged: false,
        username: ''
    };
    return sdo;
}]);

 AngularJS中使用service都是通过依赖声明的方式来做的，比如：

var controllers = angular.module('myApp.controllers', [])
.controller('loginController', ['$scope', '$http', 'UserService', function(scope, $http, User) {
        scope.login = function() {
            var config = { /* ... */ } // configuration object

            $http(config)
            .success(function(data, status, headers, config) {
                if (data.status) {
                    // succefull login
                    User.isLogged = true;
                    User.username = data.username;
                }
                else {
                    User.isLogged = false;
                    User.username = '';
                }
            })
            .error(function(data, status, headers, config) {
                User.isLogged = false;
                User.username = '';
            });
        }
}]);

接着，只要声明依赖了UserService的任何controller，view，filter等都可以通过UserService.isLogged来判断用户是否是已经验证过的，或者匿名用户

由于AngularJS通常会使用template把页面拆分重组，此时使用routeProvider来控制各个页面的访问规则：

app.config(['$routeProvider', function($routeProvider) {
    $routeProvider.when('/login', { templateUrl: 'partials/login.html', controller: 'loginCtrl' , access: {isFree: true}});
    $routeProvider.when('/main', { templateUrl: 'partials/main.html', controller: 'mainCtrl' });
    $routeProvider.otherwise({ redirectTo: '/main' });
}]);

有的页面是无需身份验证就可以访问的，例如login.html，有的页面是需要登录用户才能够看到的，例如main.html，此时我们就需要通过增加通用的checkUser逻辑来判断当前用户是否能看到这些页面：

directives.directive('checkUser', ['$rootScope', '$location', 'userSrv', function ($root, $location, userSrv) {
    return {
        link: function (scope, elem, attrs, ctrl) {
            $root.$on('$routeChangeStart', function(event, currRoute, prevRoute){
                if (!prevRoute.access.isFree && !userSrv.isLogged) {
                    // reload the login route
                }
                /*
                 * IMPORTANT:
                 * It's not difficult to fool the previous control,
                 * so it's really IMPORTANT to repeat the control also in the backend,
                 * before sending back from the server reserved information.
                 */
            });
        }
    }
}]);

这个directive注册在了rootScope上，并且监听了routeChangeStart，也是一种AOP的概念，在route change发生之前，织入了一个切面，来判断用户身份权限。由此，来达到在AngularJS中验证身份的整个逻辑。