Temps d'arrêt et gestion de la session angulaire [dupliquer]
cette question a déjà une réponse ici:
- déconnexion automatique avec Angularjs basée sur l'utilisateur inactif 10 réponses
y a-t-il un moyen de gérer la session utilisateur en utilisant Angularjs?, Je veux dire::
- délai d'expiration de Session - lorsque le système est inactif.
- alerte lorsque la session est proche d'expirer avec option de reprendre la session.
- rediriger (ou toute autre action) en essayant de faire une demande si la session est Expirée.
Pourrait être Intercepteurs une bonne option pour résoudre ce problème? Pouvez-vous me donner un exemple?
Merci d'avance.
3 réponses
Try ng-idle . C'est simple composant, vous pouvez définir le délai d'attente et le temps d'avertissement avant le délai est atteint. Ensuite, vous pouvez interroger le serveur pour l'utilisateur déconnexion ou quelque chose de similaire.
myApp.config(function(IdleProvider, KeepaliveProvider) {
IdleProvider.idle(900); // 15 min
IdleProvider.timeout(60);
KeepaliveProvider.interval(600); // heartbeat every 10 min
KeepaliveProvider.http('/api/heartbeat'); // URL that makes sure session is alive
});
myApp.run(function($rootScope, Idle) {
Idle.watch();
$rootScope.$on('IdleStart', function() { /* Display modal warning or sth */ });
$rootScope.$on('IdleTimeout', function() { /* Logout user */ });
});
dans la configuration ci-dessus, lorsque l'utilisateur est inactif pour les 900s (ne déplace pas la souris, appuyez sur une touche ou un bouton, etc), avertissement est affiché. Il attendra ensuite 60s et déconnectera l'Utilisateur (envoyer la requête à un serveur qui peut éventuellement détruire la session du serveur).
afin de s'assurer que la session du serveur n'expire pas (même si tout ce que l'utilisateur fait est de déplacer la souris) le service Keepalive enverra une demande au serveur toutes les 10 minutes. Ce temps doit être inférieur au temps d'expiration de la session du serveur.
Checkout démo .
voici quelques implémentations:
https://github.com/witoldsz/angular-http-auth
https://github.com/angular-app/angular-app/tree/master/client/src/common/security
j'emploie ng-idle depuis un certain temps maintenant pour l'exigence ci-dessous.
notre exigence était lorsque l'utilisateur est inactif pendant 60 minutes. Après 55 minutes show pop up avec la boîte de confirmation disant Si vous voulez continuer votre session ou pas(j'ai utilisé sweet alert). Si l'utilisateur clique sur Continuer puis réinitialiser le temps inactif sinon déconnectez-vous avec force en appelant la méthode de diffusion.
La Configurationdoit être faite en app.js quand les utilisateurs se connectent à l'intérieur App.config comme ci-dessous
app.config(['KeepaliveProvider', 'IdleProvider', function (KeepaliveProvider, IdleProvider) {
IdleProvider.idle(TimeOut.firstAPiCall);--It will call Idle On method
IdleProvider.timeout(TimeOut.SessionTimeOut);--It will be called when the total time is (TimeOut.firstAPiCall +TimeOut.SessionTimeOut)
KeepaliveProvider.interval(TimeOut.interval);}]) --It will be called like a heart beat for mentioned timeout until the idle start has not occured.
ci-dessous est le code pour afficher pop-up
$scope.$on('IdleStart', function () {
$scope.$broadcast('SessionIdleUpdate', 'IdleStart', TimeOut.FirstApicall);
$rootScope.idleTimerSession = setTimeout(function () {
console.log("pop up appeared on : " + new Date())
$scope.timedout = SweetAlert.swal({
title: "Alert",
text: "Your session is about to expire in 5 minutes, Do you want to continue?",
type: "warning",
showCancelButton: true,
confirmButtonColor: "#DDDDD",
confirmButtonText: "CONTINUE",
cancelButtonText: "No"
}, function (isConfirm) {
if (isConfirm) {
clearTimeout(idleTimer);
}
else {
console.log("pop up closed from confirm on : " + new Date())
$scope.$broadcast('SessionTimeOutLogOut', null);
Idle.unwatch();
$scope.started = false;
}
});
//This check is to handle idle pop up if it appears and user doesnt perform any action it will simply logout.
var idleTimer = setTimeout(function () {
swal.close();
$scope.$broadcast('SessionTimeOutLogOut', null);
Idle.unwatch();
$scope.timedout = null;
}, (TimeOut.sessionTimeOut) * 1000);
}, (TimeOut.idleTimeOut - TimeOut.idleCheckDuration) * 1000);-- Time out is added to hold the pop up for that much duration . Because once the idle start is occured you wont be able to call the API
});
ci-dessous est le code pour la gestion de l'événement de fin de ralenti:
$scope.$on('IdleEnd', function () {
$scope.$broadcast('SessionIdleUpdate', 'IdleEnd', 0));
clearTimeout($rootScope.idleTimerSession);
closeModals();
});
ci-dessous est le code pour Time Out il sera appelé after- - - (TimeOut.firstAPiCall +TimeOut.SessionTimeOut)
$scope.$on('IdleTimeout', function (forceLogout) {
swal.close();
$scope.$broadcast('SessionTimeOutLogOut', null);
Idle.unwatch();
});