>source

Yeoman, Grunt 및 Bower를 사용하여 Angularjs 응용 프로그램이 생성되었습니다.

인증을 확인하는 컨트롤러가있는 로그인 페이지가 있습니다. 자격 증명이 올바른 경우 i 홈 페이지로 다시 배합됩니다.

app.js

'use strict';
//Define Routing for app
angular.module('myApp', []).config(['$routeProvider', '$locationProvider',
  function($routeProvider,$locationProvider) {
    $routeProvider
    .when('/login', {
        templateUrl: 'login.html',
        controller: 'LoginController'
    })
    .when('/register', {
        templateUrl: 'register.html',
        controller: 'RegisterController'
      })
    .when('/forgotPassword', {
        templateUrl: 'forgotpassword.html',
        controller: 'forgotController'
      })
   .when('/home', {
       templateUrl: 'views/home.html',
       controller: 'homeController'
    })
    .otherwise({
       redirectTo: '/login'
    });
//$locationProvider.html5Mode(true); //Remove the '#' from URL.
}]);
angular.module('myApp').factory("page", function($rootScope){
    var page={};
    var user={};
    page.setPage=function(title,bodyClass){
        $rootScope.pageTitle= title;
        $rootScope.bodylayout=bodyClass;
    };
    page.setUser=function(user){
        $rootScope.user=user;
    }
    return page;
});

logincontroler.js

'use strict';
angular.module('myApp').controller('LoginController', function($scope, $location, $window,page) {
    page.setPage("Login","login-layout");
    $scope.user= {};
    $scope.loginUser=function()
    {
        var username=$scope.user.name;
        var password=$scope.user.password;
        if(username=="admin" &
&
 password=="admin123")
        {
            page.setUser($scope.user);
            $location.path( "/home" );
        }
        else
        {
            $scope.message="Error";
            $scope.messagecolor="alert alert-danger";
        }
    }
});

홈 페이지에 있습니다

<span class="user-info">    <small>Welcome,</small>    {{user.name}}
</span><span class="logout"><a href="" ng-click="logoutUser()">Logout</a></span>

LoginController., 로그인 정보를 확인하고 성공하면 서비스 팩토리에서 사용자 객체를 설정합니다. 이것이 올바른지 여부를 알지 못합니다.

사용자가 로그인 한 경우 다른 모든 페이지가 해당 값을 가져올 수 있도록 사용자 객체의 일부 값을 설정합니다.

경로가 변경 될 때마다 컨트롤러가 사용자가 로그인했는지 여부를 확인해야합니다. 그렇지 않은 경우 로그인 페이지로 재사용해야합니다. 또한 사용자가 이미 로그인하여 페이지로 돌아 오면 홈 페이지로 이동해야합니다. 컨트롤러는 모든 경로에서 자격 증명을 확인해야합니다.

나는 NG 쿠키에 대해 들었지만, 나는 그들을 사용하는 방법을 모른다.

내가 보았던 많은 예들이별로 명확하지 않고 어떤 종류의 액세스 역할이나 무언가를 사용합니다. 나는 그것을 원하지 않는다. 나는 로그인 필터 만 원한다. 누군가 나에게 어떤 아이디어를 주실 수 있습니까?

  • 답변 # 1

    개별 노선에 대한 사용자 정의 동작을 정의하는 가장 간단한 방식은 꽤 쉽습니다.

    1)routes.js.: 새 속성을 만듭니다 (예 :requireAuth.) 원하는 경로

    angular.module('yourApp').config(function($routeProvider) {
        $routeProvider
            .when('/home', {
                templateUrl: 'templates/home.html',
                requireAuth: true //our custom property
            })
            .when('/login', {
                templateUrl: 'templates/login.html',
            })
            .otherwise({
                redirectTo: '/home'
            });
    })
    

    2) 내부의 요소에 묶이지 않은 상위 ​​계층 컨트롤러에서ng-view.(Angular와의 충돌을 피하십시오$ loutprovider.), 그인지 확인하십시오뉴우 루그다requireAuth.그에 따라 재산 및 행동

    angular.module('YourApp').controller('YourController', function ($scope, $location, session) {
         //intercept the route change event
         $scope.$on('$routeChangeStart', function (angularEvent, newUrl) {
             //check if the custom property exist
             if (newUrl.requireAuth &amp;
    &amp;
     !session.user) {
                 //user isn’t authenticated
                 $location.path("/login");
             }
         });
     });
    

    우리는 한 곳의 모든 경로에 'requireAuth : True'속성을 지정할 수 있습니까? 내 시나리오에서는 로그인 페이지가 아니라 제 3 자 REST 호출에서 인증을받지 못하기 때문입니다. 그래서 나는 한 곳에서 지정하고 싶었고 미래의 추가 된 경로도 신청해야합니다.

    Raghuveer2021-09-18 00:52:58

    내가 알기로는 아니야. 아마도 routes.js에 정의 된 특수 속성이없는 모든 경로를 확인할 수 있습니다.

    DotBot2021-09-18 00:52:58
  • 답변 # 2

    사용할 수 있습니다해결하다:

    angular.module('app',[])
    .config(function($routeProvider)
    {
        $routeProvider
        .when('/', {
            templateUrl  : 'app/views/login.html',
            controller   : 'YourController',
            controllerAs : 'Your',
            resolve: {
                factory : checkLoginRedirect
            }
        })
    }
    

    , 해결 기능 :

    function checkLoginRedirect($location){
        var user= firebase.auth().currentUser;
        if (user) {
            //User is signed in.
            if ($location.path()== "/"){
                $location.path('dash');
            }
            return true;
        }else{
            //No user is signed in.
            $location.path('/');
            return false;
        }
    }
    

    Firebase는 또한 관찰자를 설치하는 데 도움이되는 방법을 가지고 있으며, 내면에 설치하는 것이 좋습니다..운영:

    .run(function(){
        firebase.auth().onAuthStateChanged(function(user) {
            if (user) {
                console.log('User is signed in.');
            } else {
                console.log('No user is signed in.');
            }
        });
      }
    

  • 답변 # 3

    여기에 다른 가능한 해결책이 있습니다.해결하다그 또는 그 또는 그 속성$ loutprovider ...에 예제$ StateProvider.:

    .config(["$stateProvider", function ($stateProvider) {
      $stateProvider
      .state("forbidden", {
        /* ... */
      })
      .state("signIn", {
        /* ... */
        resolve: {
          access: ["Access", function (Access) { return Access.isAnonymous(); }],
        }
      })
      .state("home", {
        /* ... */
        resolve: {
          access: ["Access", function (Access) { return Access.isAuthenticated(); }],
        }
      })
      .state("admin", {
        /* ... */
        resolve: {
          access: ["Access", function (Access) { return Access.hasRole("ROLE_ADMIN"); }],
        }
      });
    }])
    

    ​​액세스현재 사용자 권한에 따라 약속을 해결하거나 거부합니다.

    .factory("Access", ["$q", "UserProfile", function ($q, UserProfile) {
      var Access= {
        OK: 200,
        //"we don't know who you are, so we can't say if you're authorized to access
        //this resource or not yet, please sign in first"
        UNAUTHORIZED: 401,
        //"we know who you are, and your profile does not allow you to access this resource"
        FORBIDDEN: 403,
        hasRole: function (role) {
          return UserProfile.then(function (userProfile) {
            if (userProfile.$hasRole(role)) {
              return Access.OK;
            } else if (userProfile.$isAnonymous()) {
              return $q.reject(Access.UNAUTHORIZED);
            } else {
              return $q.reject(Access.FORBIDDEN);
            }
          });
        },
        hasAnyRole: function (roles) {
          return UserProfile.then(function (userProfile) {
            if (userProfile.$hasAnyRole(roles)) {
              return Access.OK;
            } else if (userProfile.$isAnonymous()) {
              return $q.reject(Access.UNAUTHORIZED);
            } else {
              return $q.reject(Access.FORBIDDEN);
            }
          });
        },
        isAnonymous: function () {
          return UserProfile.then(function (userProfile) {
            if (userProfile.$isAnonymous()) {
              return Access.OK;
            } else {
              return $q.reject(Access.FORBIDDEN);
            }
          });
        },
        isAuthenticated: function () {
          return UserProfile.then(function (userProfile) {
            if (userProfile.$isAuthenticated()) {
              return Access.OK;
            } else {
              return $q.reject(Access.UNAUTHORIZED);
            }
          });
        }
      };
      return Access;
    }])
    

    userprofile.현재 사용자 속성을 복사하고 그를 구현합니다$ hasrole.,$ hasanyrole,$ Isanony.그리고$ ISauthenticated.메소드 논리 (A.$ 새로 고침나중에 설명 된 방법 :

    .factory("UserProfile", ["Auth", function (Auth) {
      var userProfile= {};
      var clearUserProfile= function () {
        for (var prop in userProfile) {
          if (userProfile.hasOwnProperty(prop)) {
            delete userProfile[prop];
          }
        }
      };
      var fetchUserProfile= function () {
        return Auth.getProfile().then(function (response) {
          clearUserProfile();
          return angular.extend(userProfile, response.data, {
            $refresh: fetchUserProfile,
            $hasRole: function (role) {
              return userProfile.roles.indexOf(role) >= 0;
            },
            $hasAnyRole: function (roles) {
              return !!userProfile.roles.filter(function (role) {
                return roles.indexOf(role) >= 0;
              }).length;
            },
            $isAnonymous: function () {
              return userProfile.anonymous;
            },
            $isAuthenticated: function () {
              return !userProfile.anonymous;
            }
          });
        });
      };
      return fetchUserProfile();
    }])
    

    auth.서버 요청을 담당하고 사용자 프로파일 (예 : 요청에 첨부 된 액세스 토큰에 연결됨)을 알아야합니다.

    .service("Auth", ["$http", function ($http) {
      this.getProfile= function () {
        return $http.get("api/auth");
      };
    }])
    

    서버가 요청할 때 이러한 JSON 객체를 반환 할 것으로 예상됩니다.API /AUTH를 얻으십시오:

    {
      "name": "John Doe", //plus any other user information
      "roles": ["ROLE_ADMIN", "ROLE_USER"], //or any other role (or no role at all, i.e. an empty array)
      "anonymous": false //or true
    }
    

    마침내, 언제접속하다사용하는 경우 약속을 거부합니다ui.router., NS$ StateChangeError.이벤트가 해고됩니다.

    .run(["$rootScope", "Access", "$state", "$log", function ($rootScope, Access, $state, $log) {
      $rootScope.$on("$stateChangeError", function (event, toState, toParams, fromState, fromParams, error) {
        switch (error) {
        case Access.UNAUTHORIZED:
          $state.go("signIn");
          break;
        case Access.FORBIDDEN:
          $state.go("forbidden");
          break;
        default:
          $log.warn("$stateChangeError event catched");
          break;
        }
      });
    }])
    

    사용하는 경우Ngroute., NS$ RouteChangeError.이벤트가 해고됩니다.

    .run(["$rootScope", "Access", "$location", "$log", function ($rootScope, Access, $location, $log) {
      $rootScope.$on("$routeChangeError", function (event, current, previous, rejection) {
        switch (rejection) {
        case Access.UNAUTHORIZED:
          $location.path("/signin");
          break;
        case Access.FORBIDDEN:
          $location.path("/forbidden");
          break;
        default:
          $log.warn("$stateChangeError event catched");
          break;
        }
      });
    }])
    


    사용자 프로파일은 컨트롤러에서 액세스 할 수도 있습니다.

    .state("home", {
      /* ... */
      controller: "HomeController",
      resolve: {
        userProfile: "UserProfile"
      }
    })
    

    userprofile.그런 다음 요청시 서버가 반환 한 속성을 포함합니다.API /AUTH를 얻으십시오:

    .controller("HomeController", ["$scope", "userProfile", function ($scope, userProfile) {
      $scope.title= "Hello " + userProfile.name; //"Hello John Doe" in the example
    }])
    


    userprofile.사용자가 흔들리거나 아웃하면 새로 고침해야합니다.접속하다새로운 사용자 프로필을 사용하여 라우트를 처리 할 수 ​​있습니다. 전체 페이지를 다시로드하거나 호출 할 수 있습니다.userprofile. $ 새로 고침 ()...에 로그인 할 때의 예 :

    .service("Auth", ["$http", function ($http) {
      /* ... */
      this.signIn= function (credentials) {
        return $http.post("api/auth", credentials).then(function (response) {
          //authentication succeeded, store the response access token somewhere (if any)
        });
      };
    }])
    

    .state("signIn", {
      /* ... */
      controller: "SignInController",
      resolve: {
        /* ... */
        userProfile: "UserProfile"
      }
    })
    

    .controller("SignInController", ["$scope", "$state", "Auth", "userProfile", function ($scope, $state, Auth, userProfile) {
      $scope.signIn= function () {
        Auth.signIn($scope.credentials).then(function () {
          //user successfully authenticated, refresh UserProfile
          return userProfile.$refresh();
        }).then(function () {
          //UserProfile is refreshed, redirect user somewhere
          $state.go("home");
        });
      };
    }])
    

    나는이 답변이 없다는 것을 좋아한다. API 호출 (한계가 초과)에 예약 할 것입니다. 사용자에게 액세스 할 때 사용자의 관점에서 확인되거나 승인되지 않은 페이지에서.

    Leblanc Meneses2021-09-18 00:52:58

    @leblancmeneses 감사합니다 :) 단지 그것을 더 명확하게 만드십시오 : 무단은 "당신이 누구인지 알지 못합니다. 그래서 우리는이 자원에 액세스 할 권한이 있거나 아직이 자원에 액세스 할 수있는 권한이있는 경우 말할 수 없습니다. "우리는 당신이 누구인지 알고 있으며, 귀하의 프로필 이이 자원에 액세스 할 수 없게 해주는 것을 의미합니다.

    sp00m2021-09-18 00:52:58

    멋진 솔루션, 서버 측에 스프링 인증과 함께 가능성

    Jan Peter2021-09-18 00:52:58

    @ jsbisht all은 액세스 토큰을 저장하는 위치에 따라 다릅니다 (마지막 스 니펫 참조). JS 메모리에만 저장하는 경우 예 : F5는 인증 정보를 제거합니다. 그러나 영구 저장소 (예 : cookie /localstorage /sessionstorage)에 저장하는 경우 No : F5는 모든 $ http 요청에 토큰을 첨부하거나 적어도에 저장된 요청에 토큰을 첨부하는 한 서버가 첨부 된 토큰에 연결된 사용자의 프로파일을 반환 할 것으로 예상되는 서버가 rest /users /profile). 쿠키 저장소를 사용할 때 CSRF를 조심하십시오.

    sp00m2021-09-18 00:52:58

    @deanwhitehouse 어디서나 userProfile을 inject를 삽입 한 다음 userprofile.then (function (userprofile) {$ scope.userprofile= userprofile; /* + Watching ... * /}을 사용하십시오.

    sp00m2021-09-18 00:52:58
  • 답변 # 4

    이런 식으로 느끼는 느낌이 가장 쉽지만, 아마도 그것은 단지 개인적인 취향입니다.

    로그인 경로 (및 다른 익명 경로)를 지정하면 ex : /등록 /로그 아웃, /regitor 등록 등을 추가하십시오.

    allowAnonymous: true
    

    그래서, 이와 같은 것 :

    $stateProvider.state('login', {
        url: '/login',
        allowAnonymous: true, //if you move this, don't forget to update
                              //variable path in the force-page check.
        views: {
            root: {
                templateUrl: "app/auth/login/login.html",
                controller: 'LoginCtrl'
            }
        }
        //Any other config
    }
    

    "AllowAnonymous : False"를 지정할 필요가 없으면 확인하지 않으면 수표에서 False 가정됩니다. 대부분의 URL이 인증 된 대부분의 앱에서 이것은 적은 작업이 적습니다. 더 안전; 새 URL에 추가하는 것을 잊어 버리면 익명 URL이 보호되는 최악의 상황은 보호됩니다. 다른 방법으로, "requireAuthentication : true"를 지정하면 URL에 추가하는 것을 잊어 버리면 민감한 페이지가 공개됩니다.

    code 디자인을 가장 잘 어울리는 곳에서는 이것을 실행합니다.

    //I put it right after the main app module config. I.e. This thing:
    angular.module('app', [ /* your dependencies*/])
           .config(function (/* you injections */) { /* your config */})
    //Make sure there's no ';' ending the previous line. We're chaining. (or just use a variable)
    //
    //Then force the logon page
    .run(function ($rootScope, $state, $location, User /* My custom session obj */) {
        $rootScope.$on('$stateChangeStart', function(event, newState) {
            if (!User.authenticated &amp;
    &amp;
     newState.allowAnonymous != true) {
                //Don't use: $state.go('login');
                //Apparently you can't set the $state while in a $state event.
                //It doesn't work properly. So we use the other way.
                $location.path("/login");
            }
        });
    });
    

  • 답변 # 5

    내 솔루션은 3 부분으로 나뉩니다. 사용자의 상태는 라우트가 변경 될 때보고있는 실행 메소드에서 사용자가 요청 된 페이지에 액세스 할 수 있는지 확인한 실행 방법에서 주 컨트롤러에있는 서비스에 저장됩니다. 사용자가 변경되는지 확인합니다.

    app.run(['$rootScope', '$location', 'Auth', function ($rootScope, $location, Auth) {
        $rootScope.$on('$routeChangeStart', function (event) {
            if (!Auth.isLoggedIn()) {
                console.log('DENY');
                event.preventDefault();
                $location.path('/login');
            }
            else {
                console.log('ALLOW');
                $location.path('/home');
            }
        });
    }]);
    

    서비스를 만들어야합니다 (나는 이름을 지정할 것입니다.인증사용자 객체를 처리하고 사용자가 로그인했는지 여부를 알 수있는 방법이 있습니다.

    서비스 :

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

    app.Run., 당신은 그를 듣어야합니다$ rorechangestart.이벤트. 경로가 변경되면 사용자가 로그인했는지 확인합니다 (isLaged메소드가 처리해야합니다). 사용자가 기록되지 않고 사용자를 올바른 페이지로 리디렉션하는 경우 요청 된 경로를로드하지 않습니다.

    LoginController.로그인을 처리하려면 로그인 페이지에서 사용해야합니다. 그것은 단지 그와 상호적을 가져야합니다인증서비스를 기록한대로 사용자를 설정하십시오.

    logincontroller :

    .controller('loginCtrl', [ '$scope', 'Auth', function ($scope, Auth) {
      //submit
      $scope.login= function () {
        //Ask to the server, do your job and THEN set the user
        Auth.setUser(user); //Update the state of the user in the app
      };
    }])
    

    메인 컨트롤러에서 사용자 상태가 변경되고 리디렉션과 반응하는지 듣게 될 수 있습니다.

    .controller('mainCtrl', ['$scope', 'Auth', '$location', function ($scope, Auth, $location) {
      $scope.$watch(Auth.isLoggedIn, function (value, oldValue) {
        if(!value &amp;
    &amp;
     oldValue) {
          console.log("Disconnect");
          $location.path('/login');
        }
        if(value) {
          console.log("Connect");
          //Do something when the user is connected
        }
      }, true);
    

    LoginController는 사용자가 로그인 페이지에서 로그인 할 수있게합니다. 로그인 양식을 처리합니다. 양식은 LoginController의 일부인 제출 방법을 호출해야합니다. 이 방법은 설명 된 AUTH 서비스를 사용하여 사용자의 상태를 업데이트합니다 (양식이 올바른 경우 사용자가 로그인해야 함).

    gab2021-09-18 00:52:58

    매력처럼 일했다! 제공된 서비스 대신 Angularjs와 Auth0을 사용했습니다.

    Nikos Baxevanis2021-09-18 00:52:58

    사용자가 F5를 히고 새로 고침하면 어떨까요? 그럼 당신의 메모리 인증은 사라졌습니다.

    Gaui2021-09-18 00:52:58
  • 답변 # 6

    app.js

    'use strict';
    //Declare app level module which depends on filters, and services
    var app= angular.module('myApp', ['ngRoute','angularUtils.directives.dirPagination','ngLoadingSpinner']);
    app.config(['$routeProvider', function($routeProvider) {
      $routeProvider.when('/login', {templateUrl: 'partials/login.html', controller: 'loginCtrl'});
      $routeProvider.when('/home', {templateUrl: 'partials/home.html', controller: 'homeCtrl'});
      $routeProvider.when('/salesnew', {templateUrl: 'partials/salesnew.html', controller: 'salesnewCtrl'});
      $routeProvider.when('/salesview', {templateUrl: 'partials/salesview.html', controller: 'salesviewCtrl'});
      $routeProvider.when('/users', {templateUrl: 'partials/users.html', controller: 'usersCtrl'});
        $routeProvider.when('/forgot', {templateUrl: 'partials/forgot.html', controller: 'forgotCtrl'});
      $routeProvider.otherwise({redirectTo: '/login'});
    }]);
    app.run(function($rootScope, $location, loginService){
        var routespermission=['/home'];  //route that require login
        var salesnew=['/salesnew'];
        var salesview=['/salesview'];
        var users=['/users'];
        $rootScope.$on('$routeChangeStart', function(){
            if( routespermission.indexOf($location.path()) !=-1
            || salesview.indexOf($location.path()) !=-1
            || salesnew.indexOf($location.path()) !=-1
            || users.indexOf($location.path()) !=-1)
            {
                var connected=loginService.islogged();
                connected.then(function(msg){
                    if(!msg.data)
                    {
                        $location.path('/login');
                    }
                });
            }
        });
    });
    

    loginservices.js

    'use strict';
    app.factory('loginService',function($http, $location, sessionService){
        return{
            login:function(data,scope){
                var $promise=$http.post('data/user.php',data); //send data to user.php
                $promise.then(function(msg){
                    var uid=msg.data;
                    if(uid){
                        scope.msgtxt='Correct information';
                        sessionService.set('uid',uid);
                        $location.path('/home');
                    }
                    else  {
                        scope.msgtxt='incorrect information';
                        $location.path('/login');
                    }
                });
            },
            logout:function(){
                sessionService.destroy('uid');
                $location.path('/login');
            },
            islogged:function(){
                var $checkSessionServer=$http.post('data/check_session.php');
                return $checkSessionServer;
                /*
                if(sessionService.get('user')) return true;
                else return false;
                */
            }
        }
    });
    

    sessionservices.js

    'use strict';
    app.factory('sessionService', ['$http', function($http){
        return{
            set:function(key,value){
                return sessionStorage.setItem(key,value);
            },
            get:function(key){
                return sessionStorage.getItem(key);
            },
            destroy:function(key){
                $http.post('data/destroy_session.php');
                return sessionStorage.removeItem(key);
            }
        };
    }])
    

    loginctrl.js

    'use strict';
    app.controller('loginCtrl', ['$scope','loginService', function ($scope,loginService) {
        $scope.msgtxt='';
        $scope.login=function(data){
            loginService.login(data,$scope); //call login service
        };
    }]);
    

  • 답변 # 7

    클라이언트 측에서 세션을 걱정하고있는 이유는 무엇이 큰 솔루션을 제안했습니다. 주 /URL이 변경 될 때 Tempelate의 데이터를로드하기 위해 Ajax 호출을 수행하고 있다고 가정합니다.

    Note :-To Save user's data you may use `resolve` feature of `ui-router`.
     Check cookie if it exist load template , if even cookies doesn't exist than
    there is no chance of logged in , simply redirect to login template/page.
    

    이제 AJAX 데이터는 API를 사용하여 서버에서 반환됩니다. 이제 요점이 재생되고 사용자의 로그인 상태에 따라 서버를 사용하여 표준 반환 유형을 반환합니다. 이러한 리턴 code를 확인하고 컨트롤러에서 요청을 처리하십시오. 참고 : -AJAX 호출이 기본적으로 필요하지 않은 컨트롤러의 경우 공백 요청을 서버로 호출 할 수 있습니다.server.location /api /checksession.php.그리고 이것은 checksession.php 입니다.

    <?php/ANY_LANGUAGE
    session_start();//You may use your language specific function if required
    if(isset($_SESSION["logged_in"])){
    set_header("200 OK");//this is not right syntax , it is just to hint
    }
    else{
    set_header("-1 NOT LOGGED_IN");//you may set any code but compare that same
    //code on client side to check if user is logged in or not.
    }
    //thanks.....
    

    컨트롤러 내부의 클라이언트 측 또는 다른 답변과 같이 어떤 서비스를 통해 모든 서비스를 통해

      $http.get(dataUrl)
        .success(function (data){
            $scope.templateData= data;
        })
        .error(function (error, status){
            $scope.data.error= { message: error, status: status};
            console.log($scope.data.error.status);
    if(status== CODE_CONFIGURED_ON_SERVER_SIDE_FOR_NON_LOGGED_IN){
    //redirect to login
      });
    

    참고 : -나는 더 많은 내일을 업데이트 할 것입니다.

  • 답변 # 8

    예를 들어 응용 프로그램에는 AP 및 AUC라는 두 개의 사용자가 있습니다. 나는 각 경로에 추가 속성을 전달하고 내가 $ RouteChangestart에 들어가는 데이터를 기반으로 라우팅을 처리하고 있습니다.

    이 작업을 수행하십시오.

    angular.module("app").config(['$routeProvider',
    function ($routeProvider) {
        $routeProvider.
                when('/ap', {
                    templateUrl: 'template1.html',
                    controller: 'template1',
                    isAp: 'ap',
                }).
                when('/auc', {
                    templateUrl: 'template2.html',
                    controller: 'template2',
                    isAp: 'common',
                }).
                when('/ic', {
                    templateUrl: 'template3.html',
                    controller: 'template3',
                    isAp: 'auc',
                }).
                when('/mup', {
                    templateUrl: 'template4.html',
                    controller: 'template4',
                    isAp: 'ap',
                }).
                when('/mnu', {
                    templateUrl: 'template5.html',
                    controller: 'template5',
                    isAp: 'common',
                }).
                otherwise({
                    redirectTo: '/ap',
                });
       }]);
    

    app.js :

    .run(['$rootScope', '$location', function ($rootScope, $location) {
        $rootScope.$on("$routeChangeStart", function (event, next, current) {
            if (next.$$route.isAp != 'common') {
                if ($rootScope.userTypeGlobal== 1) {
                    if (next.$$route.isAp != 'ap') {
                        $location.path("/ap");
                    }
                }
                else {
                    if (next.$$route.isAp != 'auc') {
                        $location.path("/auc");
                    }
                }
            }
        });
    }]);
    

  • 답변 # 9

    사용자 등록 및 로그인 기능을 각도로 설정하는 방법에 대해 몇 개월 후에 게시물을 썼습니다.

    사용자가 로그인한지 확인합니다.$ locationchangestart.이벤트, 여기에 내 주요 app.js가 있습니다.

    (function () {
        'use strict';
     
        angular
            .module('app', ['ngRoute', 'ngCookies'])
            .config(config)
            .run(run);
     
        config.$inject= ['$routeProvider', '$locationProvider'];
        function config($routeProvider, $locationProvider) {
            $routeProvider
                .when('/', {
                    controller: 'HomeController',
                    templateUrl: 'home/home.view.html',
                    controllerAs: 'vm'
                })
     
                .when('/login', {
                    controller: 'LoginController',
                    templateUrl: 'login/login.view.html',
                    controllerAs: 'vm'
                })
     
                .when('/register', {
                    controller: 'RegisterController',
                    templateUrl: 'register/register.view.html',
                    controllerAs: 'vm'
                })
     
                .otherwise({ redirectTo: '/login' });
        }
     
        run.$inject= ['$rootScope', '$location', '$cookieStore', '$http'];
        function run($rootScope, $location, $cookieStore, $http) {
            //keep user logged in after page refresh
            $rootScope.globals= $cookieStore.get('globals') || {};
            if ($rootScope.globals.currentUser) {
                $http.defaults.headers.common['Authorization']= 'Basic ' + $rootScope.globals.currentUser.authdata; //jshint ignore:line
            }
     
            $rootScope.$on('$locationChangeStart', function (event, next, current) {
                //redirect to login page if not logged in and trying to access a restricted page
                var restrictedPage= $.inArray($location.path(), ['/login', '/register'])=== -1;
                var loggedIn= $rootScope.globals.currentUser;
                if (restrictedPage &amp;
    &amp;
     !loggedIn) {
                    $location.path('/login');
                }
            });
        }
     
    })();
    

  • 답변 # 10

    두 사이트의 사용자 인증을 확인해야합니다.

    • 사용자가 상태를 변경하고 사용하여'$ RouteChangestart'콜백
    • 는 $ http 요청이 각도에서 인터셉터를 사용하여 각도에서 전송 될 때입니다.
  • 이전 Angularjs -$ TemplateCache가 정의되지 않았습니다
  • 다음 javascript : 필요할 때까지 콘텐츠를 렌더링하지 않습니다