Обнаружение неактивности пользователя над браузером - чисто через javascript

Ответ 1

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

var IDLE_TIMEOUT = 60; //seconds
var _idleSecondsCounter = 0;
document.onclick = function() {
    _idleSecondsCounter = 0;
};
document.onmousemove = function() {
    _idleSecondsCounter = 0;
};
document.onkeypress = function() {
    _idleSecondsCounter = 0;
};
window.setInterval(CheckIdleTime, 1000);

function CheckIdleTime() {
    _idleSecondsCounter++;
    var oPanel = document.getElementById("SecondsUntilExpire");
    if (oPanel)
        oPanel.innerHTML = (IDLE_TIMEOUT - _idleSecondsCounter) + "";
    if (_idleSecondsCounter >= IDLE_TIMEOUT) {
        alert("Time expired!");
        document.location.href = "logout.html";
    }
}

Этот код будет ждать 60 секунд, прежде чем показывать предупреждение и перенаправление, и любое действие будет "reset" подсчет - щелчок мыши, движение мыши или нажатие клавиши.

Он должен быть как можно более креативным браузером и прямолинейным. Он также поддерживает показ оставшегося времени, если вы добавите элемент на свою страницу с идентификатором SecondsUntilExpire.

Ссылка: Как узнать время простоя браузера?

Ответ 2

Проблема с предложенным вами подходом заключается в том, что сеанс будет отключен, даже если пользователь перемещает мышь или вводит ввод. Поэтому, если у вас установлен тайм-аут сеанса, равный 20 минутам, и пользователь продолжает печатать в течение 21 минуты, сеанс будет по-прежнему тайм-аутом, хотя они были "активны". Единственное, что будет удерживать сессию от тайм-аута, - это новый запрос на сервер.

Решение 1. Пусть сервер будет контролировать тайм-аут сеанса

Если вы не делаете Ajax-запросы в фоновом режиме, это приведет к возобновлению сеанса, вы можете просто установить время ожидания JavaScript при загрузке страницы и предупредить пользователя таким образом. Если вы не делаете другие запросы на сервер, пока пользователь находится на вашей странице, нет необходимости затруднять его:

setTimeout(function () {
   alert("You've timed out baby!");
}, 1200000); // 20 minutes in millisec (modify to your session timeout)

Если пользователь посещает другую страницу или перезагружает страницу, сеанс возобновляется, а таймер JavaScript - reset. Если пользователь ничего не делает, сеанс будет тайм-аут, в то же время пользователь получает предупреждение.

Решение 2: позволить клиенту контролировать тайм-аут сеанса

Если вы хотите, чтобы JavaScript полностью контролировал, как долго длится сеанс, чтобы он обновлялся всякий раз, когда пользователь вводит данные, перемещает мышь или что-то еще, вы также будете продолжать делать Ajax-запросы в фоновом режиме сервера, поэтому сеанс возобновляется. (Это может быть пустой фиктивный запрос, просто что-то, что попадает на сервер)

Затем вам нужно будет отслеживать все действия, которые вы считаете "активностью пользователя" (AnhSirk предлагает один из способов ответа) и reset таймер тайм-аута всякий раз, когда происходит такое событие. Если пользователь неактивен слишком долго, вам необходимо будет сделать запрос Ajax на страницу на сервере, что приведет к недействительности сеанса, а затем вы сможете предупредить пользователя о том, что сеанс завершен.