如果未经身份验证,则在所有路由上重定向到登录页面

17

如果有人在未经认证的情况下尝试访问任何其他路由,我该如何重定向到登录页面?在AngularJS中,有没有“最佳”方法可以做到这一点?

看起来这是个常见的问题,但我似乎找不到解决方法。提前感谢您的帮助。


2
创建一个$routeChangeStart$stateChangeStart监听器(对于UI路由器),检查身份验证状态,如果未经身份验证,则重定向到登录页面。 - Mohammad Sepahvand
感谢@martoncsukas的编辑。 - sturoid
2个回答

22

最好的方法是设置一个'$routeChangeStart'监听器,该监听器检查'authProvider'服务函数以验证是否有用户已登录。在我们的'app.js'中或在单独的文件中:

最好的方法是设置一个'$routeChangeStart'监听器,该监听器检查'authProvider'服务函数以验证是否有用户已登录。在我们的'app.js'中或在单独的文件中:

angular.module('myApp')
     .run(['$rootScope', '$location', 'authProvider', function ($rootScope, $location,     authProvider) {
        $rootScope.$on('$routeChangeStart', function (event) {

        if (!authProvider.isLoggedIn()) {
          console.log('DENY : Redirecting to Login');
          event.preventDefault();
          $location.path('/login');
        }
        else {
          console.log('ALLOW');
        }
  });
}])

那么对于我们的“authProvider”服务:

angular.module('myApp')
  .factory('authProvider', function() {
    var user;
      return {
        setUser : function(aUser){
          user = aUser;
        },
        isLoggedIn : function(){
          return(user)? user : false;
        }
      };
  });

这个解决方案是根据stackoverflow上这里的一个答案创建的。

感谢@MohammadAwwaad


谢谢@Rorschach120。这解决了我的问题。唯一让我困惑的是preventDefault()。你真的需要它才能使这个工作吗?重定向正在阻止默认操作并重定向,所以似乎不需要,但我可能没有看到什么。 - sturoid
+1 是因为它将未经授权的用户重定向到登录页面,但如何通过服务器端代码(如 PHP)使用户登录?如何使任何页面都可以访问而无需登录,例如注册页面? - RN Kushwaha
3
https://dev59.com/IWEi5IYBdhLWcg3wweqq?rq=1 - Mohammad Awwaad
我仍然可以提供完整的URL,用户将被导航到他请求的任何页面。 - user2136053

0

我现在正在使用Node.js & Express & passport模块以不同的方式进行操作,但在此之前,当我使用PHP时,我使用了几个Angular模块。我在我的<html>标签上有一个外部模块,带有ng-app,然后在某些标签上有ng-controller,例如<body>和某些<div>。在其中一个这些ng-controller中,我有一个身份验证函数,然后我有一个ng-if用于登录、注销等。如果用户未登录,则隐藏当前页面并ng-include适当的页面。否则,我会ng-include当前页面。

那可能不是最好的解决方案,但我不想使用第三方模块。如果您感到困惑或有任何问题(我知道我很困惑),请随时问我。


我也做了类似的事情。在整个控制器之外的主控制器中使用变量来控制可见模板。然后我意识到这正是 ng-view 的用途,所以我正在尝试使用它。 - tscizzle

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接