Loop problem with $ stateChangeStart

0

Hello, I'm creating an authentication and verifying system with Angularjs, I'm using stateChangeStart to validate the permissions in view.

Only when I use $ state.go ('app.home'); it goes into infinite loop.

My code is as follows:

$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams)
   {      
      if (typeof(toState) !== undefined){
        $templateCache.remove(toState.templateUrl);
      }

      if($rootScope.session == undefined && $cookieStore.get('user') == undefined) 
      {
        $rootScope.session =  {};
      }else if($rootScope.session == undefined && $cookieStore.get('user') != undefined) 
      {   

          $rootScope.session = {
            set:true, 
            name : $cookieStore.get('user')['name'], 
            userid : $cookieStore.get('user')['id'], 
            role: $cookieStore.get('user')['nivel'],
            email: $cookieStore.get('user')['email']
          };          
      }

      if(toState.name === "page.login" || toState.name === "page.register")
      {
        return;
      }

      var authorized = true;

      if(Object.keys($rootScope.session).length === 0) 
      {
          event.preventDefault();
          $state.go('page.login');
          return;
      }else if(Object.keys(toState.permissions).length !== 0) {

        angular.forEach(toState.permissions, function(value, key)
        {
          angular.forEach(value, function(role) 
          {            
            if(key === 'except' && role === $rootScope.session.role)
            {
              authorized = false;
            }else if(key === 'allow' && role !== $rootScope.session.role)
            {
              authorized = false;
            }; 
          });  
        });
      }

      if(!authorized){
        event.preventDefault();
        $state.go('app.home');
        return;
      }; 

   }); // Start View

I've also tried:

var array = toState.permissions['except'];

if(array.indexOf($rootScope.session.role) > 0)
{
  authorized = false;
}

Thank you.

    
asked by anonymous 31.03.2016 / 21:20

1 answer

1

First, there is nothing really preventing the code from continuing, that is, it will read your code and regardless of whether it has session or not, var authorized will be validated as true and it will pass .

You need to check within a single block and ensure that the var authorized is only validated to true if it is actually logged in.

Another note, before doing any checking for session , first check if the user is trying to access a restricted area. If it is a public area, there is no need to verify that the user is logged in. That is, the logic of your verification should be something like this:

  

Does the state require login? Home   if not - > continues
  if so - > verify ..

     

Is the user logged in? Home   if so - > continues
  if not - > return to login

     

Is the user allowed? Home   if so - > continues
  if not - > returns to permission page

I would need to do some testing to see if it will really work, but I think your code structure should follow something + - like this:

$rootScope.$on('$stateChangeStart', function(event, toState, toParams, fromState, fromParams) {
  if(toState.name === "page.login" || toState.name === "page.register") {
    return;
  } else {

    if (typeof(toState) !== undefined) {
      $templateCache.remove(toState.templateUrl);
    } else {

      if($rootScope.session == undefined && $cookieStore.get('user') == undefined) {
        $rootScope.session =  {};
        event.preventDefault();
        return $state.go('page.login');

      } else if($rootScope.session == undefined && $cookieStore.get('user') != undefined) {
        $rootScope.session = {
          set:true, 
          name : $cookieStore.get('user')['name'], 
          userid : $cookieStore.get('user')['id'], 
          role: $cookieStore.get('user')['nivel'],
          email: $cookieStore.get('user')['email']
        };

        var authorized = true;

        if(Object.keys(toState.permissions).length !== 0) {
          angular.forEach(toState.permissions, function(value, key) {
            angular.forEach(value, function(role) {            
              if(key === 'except' && role === $rootScope.session.role) {
                authorized = false;
              } else if(key === 'allow' && role !== $rootScope.session.role) {
                authorized = false;
              };
            });
          });
        }

        if(!authorized) {
          event.preventDefault();
          return $state.go('app.home');
        };
      }
    }
  }
});

I hope this helps you better understand how to organize the checks.

    
01.04.2016 / 20:45