如何保护 AngularFire 0.6.0 中的路由（authRequired）？

Question

在以前的 angularFire 版本中，可以通过使用 Angular 的 $routeProvider 的“authRequired”和“pathTo”来保护选定的路由。这些似乎不再适用于 AngularFire 0.6.0。 Angular 0.6.0 中的等效参数/技术是什么？

Answer 1

路由从 angularFire 中移出的原因与它从 Angular 的核心中移出的原因相同——在如何进行路由以及应该使用哪个库方面不那么固执己见。

您仍然可以通过抓取module from angularFire-seed 来包含路由，即插即用。

步骤如下：

1. 将 ngRoute 和 routeSecurity 添加到您的应用依赖项
2. 声明 loginRedirectPath 常量
3. 在适当的地方添加authRequired

例子：

// add routeSecurity to your dependency libs
angular.module('myApp', [..., 'ngRoute', 'firebase', 'routeSecurity']);

// declare the loginRedirectPath variable
angular.module('myApp').constant('loginRedirectPath', '/login')

// put authRequired in your routes
$routeProvider.when('/account', {
   authRequired: true, // must authenticate before viewing this page
   templateUrl: 'partials/account.html',
   controller: 'AccountCtrl'
});

// live long and prosper

这是 0.6.0 版模块的硬拷贝，以符合 SO 政策；直接参考当前版本的来源：

(function(angular) {
   angular.module('routeSecurity', [])
      .run(['$injector', '$location', '$rootScope', 'loginRedirectPath', function($injector, $location, $rootScope, loginRedirectPath) {
         if( $injector.has('$route') ) {
            new RouteSecurityManager($location, $rootScope, $injector.get('$route'), loginRedirectPath);
         }
      }]);

   function RouteSecurityManager($location, $rootScope, $route, path) {
      this._route = $route;
      this._location = $location;
      this._rootScope = $rootScope;
      this._loginPath = path;
      this._redirectTo = null;
      this._authenticated = !!($rootScope.auth && $rootScope.auth.user);
      this._init();
   }

   RouteSecurityManager.prototype = {
      _init: function() {
         var self = this;
         this._checkCurrent();

         // Set up a handler for all future route changes, so we can check
         // if authentication is required.
         self._rootScope.$on("$routeChangeStart", function(e, next) {
            self._authRequiredRedirect(next, self._loginPath);
         });

         self._rootScope.$on('$firebaseSimpleLogin:login', angular.bind(this, this._login));
         self._rootScope.$on('$firebaseSimpleLogin:logout', angular.bind(this, this._logout));
         self._rootScope.$on('$firebaseSimpleLogin:error', angular.bind(this, this._error));
      },

      _checkCurrent: function() {
         // Check if the current page requires authentication.
         if (this._route.current) {
            this._authRequiredRedirect(this._route.current, this._loginPath);
         }
      },

      _login: function() {
         this._authenticated = true;
         if( this._redirectTo ) {
            this._redirect(this._redirectTo);
            this._redirectTo = null;
         }
         else if( this._location.path() === this._loginPath ) {
            this._location.replace();
            this._location.path('/');
         }
      },

      _logout: function() {
         this._authenticated = false;
         this._checkCurrent();
      },

      _error: function() {
         if( !this._rootScope.auth || !this._rootScope.auth.user ) {
            this._authenticated = false;
         }
         this._checkCurrent();
      },

      _redirect: function(path) {
         this._location.replace();
         this._location.path(path);
      },

      // A function to check whether the current path requires authentication,
      // and if so, whether a redirect to a login page is needed.
      _authRequiredRedirect: function(route, path) {
         if (route.authRequired && !this._authenticated){
            if (route.pathTo === undefined) {
               this._redirectTo = this._location.path();
            } else {
               this._redirectTo = route.pathTo === path ? "/" : route.pathTo;
            }
            this._redirect(path);
         }
         else if( this._authenticated && this._location.path() === this._loginPath ) {
            this._redirect('/');
         }
      }
   };
})(angular);