Je cherche une meilleure approche de mon problème ici. Je me souviens de moi une fonctionnalité sur mon formulaire de connexion. Les utilisateurs cliquent sur Se souvenir de moi Box, mon API m'envoie jeton.
Ma question est la meilleure façon de stocker ce jeton et d'authentifier l'utilisateur à nouveau quand ils sont de retour sur mon site?
Qu'est-ce que je pensais,
S'il vous plaît donnez-moi des conseils qui pourraient m'aider.
4 Réponses :
J'utiliserais document.cookie avec un code d'usine comme celui-ci:
crée un cookie (par exemple celui-ci expire en une année): Cet usine Supprime le cookie: puis lorsque un utilisateur se connecte correctement au cache la clé à l'aide de $ Rappelez-vous: et toujours Vérifiez si le cookie est là lorsque vous vous connectez à l'utilisateur, utilisez la connexion AA Standard et enregistrez-la à leurs cookies. Si le souvenir de moi n'est pas activé, oubliez le document.cookie
Belle réponse :) Je vais essayer de vous faire savoir.
Pouvez-vous s'il vous plaît expliquer plus comment vérifier si mon cookie est défini? Actuellement, j'utilise un drapeau booléen mais ne fonctionne pas. Une idée?
Cookie ne retire pas du navigateur, même après avoir expiré.
@willjleong Comment nous vérifions le cookie? puis appliquer la condition selon le cookie. Pouvez-vous expliquer davantage?
Tout d'abord, vous installez des ngcookies dans votre application à l'aide de Bower alors utilisez simplement comme p> Bower Installez angular-cookies @ XYZ CODE> ou Manully. P> P> P> P> puis injecter ngcookies code> dans votre application comme
angulaire.module ('app', ['ngcookies']); code> p> angular.module('App', ['ngCookies'])
.controller('demo', ['$cookies', function($cookies) {
// Setting a cookie
$cookies.put('cookieName', 'object');
// Retrieving a cookie
var sample= $cookies.get('cookieName');
// Remove a cookie
$cookies.remove('cookieName');
}]);
Cela devrait être utilisé comme une réponse acceptée car ce n'est pas une bonne pratique d'utiliser des objets DOM à l'intérieur du code angulaire.
Si vous utilisez jeton d'authentification / API RESTful alors le meilleur moyen est d'utiliser le localStorage code>. Cependant, l'utilisation de cette approche à moins que l'utilisateur sélectionne à « Remember Me », ils seront tenus de se connecter à nouveau à chaque onglet du navigateur qu'ils ouvrent. Parce que chaque élément enregistré avec sessionStorage code> est disponible uniquement à un seul onglet.
J'ai créé une bibliothèque pour simplifier et les données de session de synchronisation dans tous les onglets ouverts. L'expérience utilisateur est similaire à celle offerte par l'authentification par cookie.
Avec ce que vous faites quelque chose comme: if (rememberMe)
storageManager.savePermanentData('data', 'key');
else
storageManager.saveSyncedSessionData('data', 'key');
<div ng-app="app" ng-controller="mainController as ctrl">
<div class="panel panel-default">
<div class="panel-heading">
<a href="https://docs.angularjs.org/api/ngCookies/service/$cookies">ngCookies</a> sample
</div>
<div class="panel-body">
Enter some value, press 'Set cookies', than refresh page. (Refresh button on right top corner)
<hr>
<form ng-submit="ctrl.setCookies()">
<div class="form-group">
<label for="var1">Cookies for VAR1</label>
<input type="text" class="form-control" id="var1" placeholder="value" ng-model="ctrl.var1">
</div>
<div class="form-group">
<label for="var2">Cookies for VAR1</label>
<input type="text" class="form-control" id="var2" placeholder="value" ng-model="ctrl.var2">
</div>
<button type="reset" class="btn btn-danger" ng-click="ctrl.clearCookies()">Clear</button>
<button type="submit" class="btn btn-primary">Set cookies</button>
</form>
</div>
</div>
<div class="alert alert-success" role="alert" ng-show="ctrl.message">
{{ctrl.message}}
</div>
</div>