2016-11-25 102 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 
} 
相關問題