2016-11-25 75 views
0

第一次为我使用angularjs,我不知道如何重定向登录页面,如果未经过身份验证,如果未验证用户无法访问“用户”页面和“menu_utama”在我的状态。如何重定向到登录页面,如果没有authentificified angularjs

app.js

(function() { 

'use strict'; 

angular 
    .module('authApp', ['ui.router', 'satellizer']) 
    .config(function($stateProvider, $urlRouterProvider, $authProvider) { 

     // function to check the authentication // 
     var Auth = ["$q", "authService", function ($q, authService) { 
      authService.fillAuthData; 
      alert("authasdnaksjdhnk"); 
      if (authService.authentication.isAuth) { 
       return $q.when(authService.authentication); 
      } else { 
       return $q.reject({ authenticated: false }); 
      } 
     }]; 
     console.log(Auth); 


     alert("aweawe"); 

     // Satellizer configuration that specifies which API 
     // route the JWT should be retrieved from 
     $authProvider.loginUrl = '/api/authenticate'; 

     // Redirect to the auth state if any other states 
     // are requested other than users 
     $urlRouterProvider.otherwise('/auth'); 

     $stateProvider 
      .state('auth', { 
       url: '/auth', 
       templateUrl: '../views/authView.html', 
       controller: 'AuthController as auth' 
      }) 
      .state('users', { 
       url: '/users', 
       templateUrl: '../views/userView.html', 
       controller: 'UserController as user' 
      }) 
      .state('menu_utama', { 
       url: '/menu_utama', 
       templateUrl: '../views/menuUtama.html', 
       controller: 'UserController as user', 
       resolve: { 
        auth: Auth 
       } 
      }); 

    }); 

})(); 

authController.js

(function() { 

'use strict'; 

angular 
    .module('authApp') 
    .controller('AuthController', AuthController); 


function AuthController($auth, $state) { 
    var vm = this; 
    //console.log(vm); 

    vm.login = function() { 

     var credentials = { 
      email: vm.email, 
      password: vm.password 
     } 

     // Use Satellizer's $auth service to login 
     //console.log(credentials); 
     $auth.login(credentials).then(function(data) { 
      alert("woe"); 

      // If login is successful, redirect to the users state di file app.js 
      $state.go('users', {}); 

     }, function(error) { 
       vm.loginError = true; 
       vm.loginErrorText = error.data.error; 
      alert("Login gagal"); 

      //because we returned the $http.get request in the $auth.login 
      //promise, we can chain the next promise to the end here 
      }); 




    } 

} 

})(); 

UserController.js

(function() { 

'use strict'; 

angular 
    .module('authApp') 
    .controller('UserController', UserController); 

function UserController($http) { 

    var vm = this; 
    console.log($http); 
    vm.users; 
    vm.error; 


    vm.getUsers = function() { 
     alert("a"); 
     // This request will hit the index method in the AuthenticateController 
     // on the Laravel side and will return the list of users 
     $http.get('api/authenticate').success(function(users) { 
      vm.users = users; 
     }).error(function(error) { 
      alert("c"); 
      vm.error = error; 
     }); 
    }; 

    vm.getCoba = function() { 
     alert("woe"); 
    } 

} 

})(); 
+0

您可以通过以下方式重定向用户,您可以用app.js中的状态名替换仪表板。 –

回答

0

我不知道你是否找到了解决办法,但...

你可以改变这个:

var Auth = ["$q", "authService", function ($q, authService) { 
     authService.fillAuthData; 
     alert("authasdnaksjdhnk"); 
     if (authService.authentication.isAuth) { 
      return $q.when(authService.authentication); 
     } else { 
      return $q.reject({ authenticated: false }); 
     } 
    }]; 

此: (我已经添加了$ state.go( '登录')else语句,而不是$ q.reject(原因))

var Auth = ['$q','$state','authService', function ($q, $state, authService) { 
     var deferred = $q.defer(); 
     authService.fillAuthData; 
     if (authService.authentication.isAuth) { 
      deferred.resolve(); 
     } else { 
      $state.go('login'); 
     } 
     return deferred.promise; 
    }]; 

既然你在您为此控制器路由时添加了身份验证功能作为解决方案,它会将每个未经身份验证的用户重定向到“登录”,当他们尝试导航到您的受限制的控制器时

编辑:您可以将此添加到您的'/user'路由状态以避免未经身份验证的用户访问

resolve: { 
    auth: Auth 
} 
相关问题