Есть ли способ управлять сеансом пользователя с помощью Angularjs?, я имею в виду::
Могут ли быть перехватчики одним хорошим вариантом для решения этой проблемы? Можете ли вы привести пример?
Спасибо заранее.
Попробуйте ng-idle. Это простой компонент, в котором вы можете установить время ожидания и время предупреждения до достижения таймаута. Затем вы можете запросить сервер для выхода пользователя или что-то подобное.
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 */ });
});
В приведенной выше конфигурации, когда пользователь простаивает на 900 секунд (не двигает мышью, нажимает любую клавишу или кнопку и т.д.), отображается предупреждение. Затем он будет ждать 60 секунд и выйти из системы (отправить запрос на сервер, который, возможно, уничтожит сеанс сервера).
Чтобы убедиться, что сеанс сервера не истекает (даже если все, что делает пользователь, перемещает мышь), служба Keepalive отправит запрос на сервер каждые 10 минут. Это время должно быть меньше времени окончания сеанса сервера.
Ознакомьтесь с демонстрацией .
Вот несколько реализаций:
https://github.com/witoldsz/angular-http-auth
https://github.com/angular-app/angular-app/tree/master/client/src/common/security
Я использую ng-idle в течение некоторого времени для ниже требования.
Наше требование состояло в том, что пользователь простаивает 60 минут. После 55 минут показывается всплывающее окно с подтверждением, что вы хотите продолжить сеанс или нет (я использовал сладкое предупреждение). Если пользователь нажмет на продолжение, то reset время простоя еще раз выйдет из строя, вызвав метод широковещания.
Конфигурация должна быть выполнена в app.js, когда пользователь входит в систему внутри app.config, как показано ниже
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.
Ниже приведен код отображения всплывающих окон
$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
});
Ниже приведен код для обработки события завершения в режиме ожидания:
$scope.$on('IdleEnd', function () {
$scope.$broadcast('SessionIdleUpdate', 'IdleEnd', 0));
clearTimeout($rootScope.idleTimerSession);
closeModals();
});
Ниже приведен код Time Out, который будет вызываться после --- (TimeOut.firstAPiCall + TimeOut.SessionTimeOut)
$scope.$on('IdleTimeout', function (forceLogout) {
swal.close();
$scope.$broadcast('SessionTimeOutLogOut', null);
Idle.unwatch();
});