Autenticación de ruta AngularJs

El problema es que me gustaría restringir el acceso a rutas específicas y mostrar la página de inicio de sesión si el usuario no tiene JWT válido. Solo quiero decir que soy muy nuevo en AngularJs y NodeJs. Así que en definitiva tengo

LoginCtrl:

$scope.login = function(username, password){ UserSvc.login(username, password) .then(function(response){ $scope.$emit('login', response.data ); $window.location.href = '#/'; }, function(resp){ $scope.loginError = resp.data.errors; }); } 

Subo un evento, en ApplicationCtrl el evento es atrapado por este

 $scope.$on('login', function(_, user){ $scope.currentUser = user }) 

Lo que es genial y funciona perfectamente, el problema es que tengo algunas rutas en mi route.js, en las que me gustaría tener alguna validación.

 $routeProvider .when('/', {controller:'PostsCtrl', templateUrl: 'posts.html'}) .when('/register', {controller:'RegisterCtrl', templateUrl: 'register.html'} ) .when('/login', {controller:'LoginCtrl', templateUrl: 'login.html'} ) .otherwise({redirectTo: '/login'}); 

En nodejs puedo poner fácilmente un middleware, pero ¿cómo puedo hacer eso en AngularJs? Así que ahora lo que está sucediendo es que cuando aterrice en la página puedo presionar inicio de sesión. Me redirige a la página de inicio de sesión, luego, cuando presiono Publicaciones, Nodejs devuelve 401 porque no tengo un JWT válido, pero eso solo se muestra en la consola. AngulrJs no hace nada.

Como @SayusiAndo señaló que necesitas:

  • Interceptor de http que capturará el estado 401, desde su servidor de nodo.
  • y, a continuación, redirija al usuario a la ruta / login si no ha iniciado sesión.
  • Además, debe enviar su token jwt (que debe almacenar), utilizando el mismo interceptor.

Interceptor de http:

 app.factory('AuthInterceptor', function ($window, $q) { return { request: function(config) { var token = $window.localStorage.getItem('token'); if(token){ config.headers.Authorization = 'Bearer ' + token; } return config; }, response: function(response) { if (response.status === 401) { // redirect to login. } return response || $q.when(response); } }; }); // Register the AuthInterceptor. app.config(function ($httpProvider) { $httpProvider.interceptors.push('AuthInterceptor'); }); 

Puede usar el evento $ routeChangeStart que se dispara cada vez que un ángulo ingresa a una ruta. Adjunte un controlador a este evento y en el controlador haga la validación que necesita y, si falla, redirija al usuario.

https://docs.angularjs.org/api/ngRoute/service/ $ route