Comment stocker un jeton d'authentification dans Angulaire app
J'ai Angulaire de l'application (SPA) qui communique avec une API REST de serveur et je suis intéressé à trouver la meilleure méthode pour stocker un jeton d'accès qui est retourné à partir d'une API de serveur, de sorte que l'angle client peut l'utiliser pour s'authentifier les demandes futures de l'API. Pour des raisons de sécurité, je tiens à le stocker en tant que navigateur variable de session, de sorte que le jeton n'est pas conservée après la fermeture du navigateur.
Je me suis mise en œuvre d'une version légèrement personnalisée de l'authentification OAuth 2.0 à l'aide de la Ressource Mot de passe du Propriétaire de la subvention. L'angle de l'application fournit un formulaire pour l'utilisateur de saisir son nom d'utilisateur et mot de passe. Ces informations sont alors envoyées à l'API en échange d'un jeton d'accès qui doit ensuite être envoyé comme en-tête (Autorisation: Porteur %Jeton%) pour toutes les requêtes sortantes à l'API de sorte qu'il peut autoriser des demandes à d'autres voies.
Je suis assez nouveau dans le domaine Angulaire, mais le flux de travail que je voudrais mettre en œuvre pour la gestion de ces jetons est résumée comme suit.
1) Le client fait une requête à l'API en lui fournissant les informations d'identification utilisateur.
2) Si cette demande est acceptée, le jeton est stocké quelque part (où est la question)
3) Intercepter les requêtes HTTP. Si le jeton est ensemble, passer un en-tête de l'API
4) Jeton est détruit lorsque le navigateur/onglet est fermé.
Je sais Angulaire offre $de la fenêtre.sessionStorage, qui semble être ce que je recherche, mais je suis préoccupé par la possibilité pour elle de ne pas travailler sur tous les navigateurs selon les différentes ressources que j'ai lu. C'est une entreprise de qualité de l'application et doit être compatible dans un large éventail de navigateurs (IE, Chrome, Firefox). Je peux l'utiliser avec la confiance qu'elle sera stable?
Les alternatives, ce que je comprends, sont soit $de la fenêtre.localStorage ou les cookies ($cookies, $cookieStore). Ce ne serait pas une solution idéale pour moi car je ne veux pas de ces données pour persister, mais si c'est plus fiable, je vais avoir à sacrifier l'efficacité pour la compatibilité. Je pensais aussi qu'il pourrait être possible de définir simplement comme une valeur sur l' $rootScope de référence et de cette façon, mais je ne suis pas sûr si cela est possible.
J'espère que tout fait sens. Toute aide /suggestions seraient grandement appréciés.
Merci!
OriginalL'auteur The Zuidz | 2014-05-21
Vous devez vous connecter pour publier un commentaire.
Si vous êtes à la recherche de quelque chose qui va certainement pas persister alors, je voudrais simplement garder le jeton dans la mémoire et ne pas compter sur le navigateur pour le stockage. Cependant stocker à l'intérieur rootScope ne serait pas la meilleure pratique.
Je recommanderais que vous enveloppez de votre serveur de code d'accès dans Angulaire de Service si vous ne l'avez pas déjà fait. Ensuite, vous pouvez encapsuler votre jeton au sein de ce Service au moment de l'exécution (par exemple, en tant que propriété) sans se soucier d'avoir à y accéder lors de l'appel à partir d'autres parties de votre application.
Angulaire Des Services De sont singleton si votre serveur "service" sera une instance globale qui peut être consulté à l'aide de la normale de l'injection de dépendances.
si l'utilisateur actualise la page, vous pouvez vouloir vérifier délai d'attente ou de re-auth
Salut @Exzile merci pour la réponse. Pouvez-vous svp me donner un exemple?
J'ai fini par utiliser $Cookies ngCookies. lorsque la connexion je viens d'installation d'un cookie de valeur et sur les charges je l'examiner.
OriginalL'auteur Jono Hill
$window.sessionStorage
est la voie à suivre, sauf si vous êtes un ciblage très vieux navigateurs.Selon http://www.w3schools.com sessionStorage est pris en charge à partir de IE 8.0, Chrome 4.0, Firefox 3.5, Safari 4.0.
OriginalL'auteur tymtam