【问题标题】:Angularjs: restrict access to all pages except fewAngularjs:限制对除少数页面之外的所有页面的访问
【发布时间】:2015-05-10 18:07:05
【问题描述】:

我正在将 Angularjs 与 ui-router 和 JWT(这是一种基于令牌的身份验证工具)一起使用,并希望实现身份验证。

假设我想限制对我所有页面的访问,除了三个页面:“/home”、“/about”和“/login”。怎样才能达到这个效果?

【问题讨论】:

  • 一个简单的谷歌搜索返回this你看过这些帖子吗?

标签: angularjs authentication angular-ui-router jwt


【解决方案1】:

它正在工作!享受:)

var scotchApp = angular.module('scotchApp', ['ngCookies','ngRoute','ui.bootstrap']);

    scotchApp.run(['$rootScope', '$location', 'Auth', function($rootScope, $location, Auth) {
        $rootScope.$on('$routeChangeStart', function(event, current) {
            $rootScope.pageTitle = current.$$route.title;
            if (!Auth.isLoggedIn() && current.$$route.withLogin || Auth.isLoggedIn() && current.$$route.withoutLogin) {
                event.preventDefault();
                $location.path('/');
            }
        });
    }]);

    scotchApp.config(function($routeProvider) {
        $routeProvider
        // route for the home page

            .when('/list', {
            templateUrl: 'pages/list.html',
            controller: 'mainController',
            title: 'User List',
            withLogin: true,
        })

        .when('/register', {
            templateUrl: 'pages/register.html',
            controller: 'mainController',
            title: 'Register',
            withoutLogin: true,
        });
    });

【讨论】:

    【解决方案2】:

    下面我将为您解释如何使用 angularjs Philosophy 保护访问:

    1-我们假设你有一个名为verifyLogin的工厂,这个工厂用来验证用户是否连接(在这个名为isAuth的工厂函数内部)

    2 -file config 包含以下代码:

    $stateProvider
        .state('docApp.doc_components_profiles', {
            needLogin: true,                
            url  : '/admin/page1',
            views: {
                'content@docApp': {
                    templateUrl: 'app/admin/pages/profiles.html',
                    controller : 'AdminController as vm'
                }
            }
        });
    

    在这里你看到我们写了名为needLogin的属性,我们影响到这个属性值=true,为了访问这个路径(管理页面),用户必须经过身份验证。

    3 - 现在您可以编写如下代码来验证每次用户从一个导航到另一个时的路径

     $rootScope.$on('$stateChangeStart', function (event, toState, toParams, fromState, fromParams){
         if(toState.needLogin){
             if(verifyLogin.isAuth== false)
                  {
                  console.log("Ypou must connect before you access to this url!!");
                   $location.path('/login');
                  }
          }
    }
    

    【讨论】:

      猜你喜欢
      • 2023-01-19
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-09-22
      • 1970-01-01
      • 2012-10-13
      • 1970-01-01
      • 2018-06-06
      相关资源
      最近更新 更多