Тайм-аут сеанса Javascript с всплывающим предупреждением для нескольких вкладок

Question

Тайм-аут сеанса Javascript с всплывающим предупреждением для нескольких вкладок

Я использую javascript setInterval (), чтобы проверить время простоя пользователя и показать всплывающее предупреждение перед автоматическим выходом из системы. Но это не работает для нескольких вкладок (работает нормально для одной вкладки)

Ниже приведен мой код:

localStorage.removeItem("idleTimeValue");
var idleInterval    = setInterval(timerIncrement, 1000);function timerIncrement()
{
if(localStorage.getItem("idleTimeValue")) {
idleTime            = parseInt(localStorage.getItem("idleTimeValue")) + 1; //increments idle time by one second
} else {
idleTime            = 1;
}

localStorage.setItem("idleTimeValue", idleTime);

var timeDiff            = 600;
var totTimeRemaining    = timeDiff-idleTime;if(totTimeRemaining > 0) {

$('#timeoutWindow').modal('show');
var minutes = Math.floor(totTimeRemaining / 60);
var seconds = totTimeRemaining - minutes * 60;
$('#timeoutRemainingTime').html(minutes+" minutes and "+seconds+" seconds");
} else {
window.location = httpHost+"/account/index/logout";
}

}$(this).click(function (e)
{
localStorage.removeItem("idleTimeValue");
$('#timeoutWindow').modal('hide');
});

Я устанавливаю время простоя в localStorage, как —

localStorage.setItem("idleTimeValue", idleTime);

Поэтому, если я открою 3 вкладки, функция setInterval () будет запущена на всех вкладках, а также idleTime с шагом 3 секунды вместо 1 секунды, и время вычислений происходит неправильно.

Мне нужно показать всплывающее окно на всех вкладках, и нажатие кнопки «Продолжить» на одной вкладке должно отражаться на всех остальных вкладках.

Кто-нибудь может предложить решение для этого? Помогите пожалуйста ребята

3

javascript php session-timeout setinterval tabs

Решение

Другие решения

Вы можете настроить существующую реализацию, как показано ниже, чтобы удовлетворить ваши требования.

Шаг 1: Настройка среды — Создание уникального идентификатора таймера, чтобы изолировать его от других таймеров

var timerId = 'timer-'+(new Date().getTime());
localStorage.setItem(timerId, '0');
modifyAllIdleTime('0');//i.e resetting all timers

var idleInterval    = setInterval(timerIncrement, 1000);

function timerIncrement(){
// increament & Set only localStorage.getItem(timerId) so that it will not affect others
// Add logic to showHide
}

Шаг 2: Изменение времени простоя — вызывать всякий раз, когда необходимо изменить другой экземпляр таймера

function modifyAllIdleTime(idleTime) {
for(var i = 0; i < localStorage.length; i++) {
if(localStorage.key(i).indexOf('timer-') !== -1) { //if timer instance
localStorage.setItem(localStorage.key(i), idleTime);
}
}
}

Шаг 3: Выход — выходить из любого таймера всякий раз, когда оставшееся время становится равным 0 для любого таймера

modifyAllIdleTime('600');// where 600 is the max allowed idle time in sec
deleteTimer();//call this to cleanup localStorage before navigating user to logout screen

1

Источник

Accepted Answer

Спасибо, ребята, у меня есть решение для этого.

Я использовал значение localStorage с текущим временем в нем. Если в localStorage [«currentTime»] нет значения, текущее время сохраняется в localStorage.

var currentTime         = new Date();

if ( !(localStorage.getItem("currentTime")) || (localStorage.getItem("currentTime") == "") )
{
idleTime        = 0;
setTimeout(function() { localStorage.setItem("currentTime", currentTime)},5000); // current time is set to localStorage after  seconds (it is for setting in multiple tabs)
}

Все вычисления для отображения всплывающего окна выполняются с использованием значения localStorage.getItem («currentTime»).

Затем я устанавливаю для localStorage [«currentTime»] значение null, если пользователь не находится в режиме ожидания (когда пользователь щелкает где-то)

$(this).click(function (e)
{
$('#timeoutWindow').modal('hide');
localStorage.setItem("currentTime", "");
idleTime = 0;
});

3