AngularJS - prévenir, non authentifié l'utilisateur d'accéder à un itinéraire donné,
Dans mon application lorsque l'utilisateur est connecté, j'ai authService
qui définit interne drapeau isAuthenticated
. Maintenant, à chaque changement d'itinéraire, j'ai auditeur attaché à $routeChangeStart
événement qui vérifie authService.isAuthenticated()
. Si non, il doit rediriger vers la connexion de l'itinéraire.
Problème, c'est quand l'utilisateur fait actualisation de la page (tout le authService
paramètres sont perdus) et il sera de retour pour vous connecter à nouveau (tout en ayant encore de session valide sur le serveur). Ce n'est pas ce que je veux.
Ce que je voudrais faire est de "bloquer" la route à modifier jusqu'à ce que je obtenir de l'information si l'utilisateur est authentifié (soit à partir de authService
qui serait immédiate, ou à partir du serveur si aucune information n'est disponible dans authService
, par exemple, après actualisation). J'ai une telle fonction dans authService
//returns promise
currentUser: function() {
if (authService.isAuthenticated()) {
return $q.when(authService.loggedUser);
}
return $http.get('/session').then(function(response) {
authService.loggedUser = response.user;
return $q.when(authService.loggedUser);
});
}
et que vous souhaitez l'utiliser dans l'écouteur d'événement.
$rootScope.$on("$routeChangeStart", function (event, next, current) {
if(isRouteRestricted(next)) {
authService.currentUser().then(null, function() {
$location.path('/login');
});
}
});
Le truc, c'est qu'il ne fonctionne pas comme prévu. J'obtiens toujours la cible de route visible que pendant un très court laps de temps, et ensuite, l'utilisateur obtient redirigé. Je crois que c'est dû à la nature de promesses, mais la façon de se débarrasser de cette "clignoter" effet?
Vous devez vous connecter pour publier un commentaire.
Je ferais quelque chose comme cela dans la haut niveau contrôleur, qui serait le premier contrôleur qui est appelée lorsque la page est actualisée (excuses pour les fautes de frappe dans le js, je suis un coffeescript guy):
Cela permettra d'assurer que le contrôleur de code ne peut pas être appelé jusqu'à ce que le authCheck est terminée.
Pour empêcher un utilisateur pour accéder à des itinéraires que vous avez à faire plusieurs choses:
Tout d'abord, définissez vos itinéraires et ajouter une propriété comme "accès": allowAnonymous : vrai ou faux
Deuxième, vous devez reconnaître un utilisateur authentifié:
Il ya plusieurs façons de le faire, mais je préfère utiliser la puissance de AngularJS tout au long de l'utilisation des "Services". Par conséquent, j'ai créé une " UserService’ où l'on conserve le nom d'utilisateur actuel et une valeur indiquant si est authentifié ou non.
Dernière chose, capturer les modifications de trajet, des événements et de les traiter en conséquence:
Après nous avoir le service est en place, il est temps de l'utiliser et de mettre en œuvre la fonctionnalité de contrôle pour une route. Il existe plusieurs méthodes d'intercepter la route de modifier l'événement, mais nous nous intéressons uniquement à ceux qui se produisent avant que l'utilisateur est redirigé afin que nous puissions vérifier si est authentifié: ‘$routeChangeStart’, ‘$locationChangeStart’. Ici, nous pouvons vérifier si la route que l'utilisateur va autorise l'accès anonyme et si l'utilisateur est connecté. Si les cas d'échec, on peut afficher un message d'erreur et rediriger l'utilisateur vers la page de connexion.
Article complet est ici: http://net-daylight.blogspot.ro/
Espère que cela aide!