AngularJS |加载前处理路由
我希望通过外部服务为我的路由创建一个简单的身份验证检查。
我定义了路由对象的访问要求：
$routeProvider
.when('/', {
templateUrl: 'src/app/views/index.html',
controller: 'indexCtrl',
authenticated: true
})
.when('/login', {
templateUrl: 'src/app/views/login.html',
controller: 'loginCtrl',
anonymous: true
})
.otherwise({
redirectTo: '/'
})
;然后，我检查我在$routeChangeStart事件中是否有权限。
$rootScope.$on('$routeChangeStart', function (event, next) {
if(next.authenticated && !$myService.isLoggedin())
$location.path("/login");
else if(next.anonymous && $myService.isLoggedin())
$location.path("/secured");
});实际上，它是有效的-
如果用户未通过身份验证，则将其移动到登录页面；如果用户已通过身份验证，但路由仅适用于匿名用户，则将其移动到另一个页面，以此类推。
但是-这个重定向实际上发生在控制器和模板被加载之后！，它导致我的控制器对我的REST API做一些不必要的请求，即使我没有通过身份验证。
在它们处理之前，我如何处理路由？
回答 5
Stack Overflow用户
发布于 2013-09-15 03:46:47
我的解决方案是将$locationChangeStart和$routeChangeStart结合起来
$rootScope.$on('$locationChangeStart', function (event) {
//If login data not available, make sure we request for it
if($facebook.isConnected()==null) {
$facebook.getLoginStatus();
event.preventDefault();
return;
}
var next=parseRoute().$$route;
if(!Auth.loginCheck(next))
event.preventDefault();
});我从 angular-route.js 复制了 URL ，以解析要路由的给定URL。。
然后，我构建了我的登录检查处理程序(Auth.loginCheck)，如果失败，它将返回false。
我还使用$routeChangeStart来处理$route.reload()事件，所以现在在我的身份验证状态中每次更改后，我只需执行$route.reload()
$rootScope.$on('$routeChangeStart', function (event, next) {
Auth.loginCheck(next);
});最后，我只需确保此自定义服务将始终使用简单的run()方法运行。
编辑：
我们现在使用ngAuth，这是我们设计用来解决这个问题的模块(基于我之前在这里给出的答案)。
最后，我们开发了一个角度模块来解决这个问题。这个模块基于我之前在这里发布的答案。
由于这里的请求，我们发布了一个现在可以工作的测试版：http://github.com/GoDisco/ngAuth
请随意使用它。
Stack Overflow用户
发布于 2013-09-13 22:28:10
.when('/', {
templateUrl: 'src/app/views/index.html',
controller: 'indexCtrl',
resolve: function($q, $location) {
var deferred = $q.defer();
deferred.resolve();
if (!isAuthenticated) {
$location.path('/login');
}
return deferred.promise;
}
})Stack Overflow用户
发布于 2013-09-13 22:26:27
尝试使用路由的resolve属性。在加载任何控制器或模板之前，它会解析传递给它的所有函数/依赖项。以防依赖项返回一个promise，直到它被解决时才加载任何内容。
尝试在解决和重定向中传递身份验证服务，以防身份验证失败。
请看一下-> https://groups.google.com/forum/#!topic/angular/QtO8QoxSjYw
$stateProvider在底层使用$routeProvider。这个维基将给你更多的洞察力。https://github.com/angular-ui/ui-router/wiki#resolve
https://stackoverflow.com/questions/18788586
复制相似问题