Angularjs：限制对除少数页面之外的所有页面的访问

Posted 2023-03-08

【中文标题】Angularjs：限制对除少数页面之外的所有页面的访问

【英文标题】：Angularjs: restrict access to all pages except few

【发布时间】：2015-05-10 18:07:05

【问题描述】：

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

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

【问题讨论】：

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

【参考方案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');