«Если рабочий хочет хорошо выполнять свою работу, он должен сначала заточить свои инструменты» — Конфуций, «Аналитики Конфуция. Лу Лингун»
титульная страница > программирование > Как я могу определить время простоя пользователя в JavaScript?

Как я могу определить время простоя пользователя в JavaScript?

Опубликовано 21 декабря 2024 г.
Просматривать:199

How Can I Detect User Idle Time in JavaScript?

Определение времени простоя в JavaScript

Введение:

В веб-разработке понимание активности пользователей имеет решающее значение для оптимизации производительности и обеспечения лучшего взаимодействия с пользователем. Обнаружение времени простоя, определяемого как период бездействия или низкой загрузки ЦП, может помочь вам инициировать такие действия, как предварительная загрузка контента или аутентификация пользователя.

Реализация JavaScript:

Для обнаружения простоя в JavaScript, вы можете использовать следующий стандартный подход JavaScript:

Код Фрагмент:

var inactivityTime = function () {
    var time;
    window.onload = resetTimer;
    // DOM Events
    document.onmousemove = resetTimer;
    document.onkeydown = resetTimer;

    function logout() {
        alert("You are now logged out.")
        //location.href = 'logout.html'
    }

    function resetTimer() {
        clearTimeout(time);
        time = setTimeout(logout, 3000)
        // 1000 milliseconds = 1 second
    }
};

Использование:

Чтобы инициализировать обнаружение времени простоя, вызовите функцию inactivityTime() после загрузки страницы:

window.onload = function() {
  inactivityTime();
}

Настройка:

Вы можете добавить больше событий DOM для мониторинга активности пользователей. Некоторые из наиболее часто используемых событий:

document.onload = resetTimer;
document.onmousemove = resetTimer;
document.onmousedown = resetTimer; // touchscreen presses
document.ontouchstart = resetTimer;
document.onclick = resetTimer;     // touchpad clicks
document.onkeydown = resetTimer;   // onkeypress is deprectaed
document.addEventListener('scroll', resetTimer, true); // improved; see comments

Для лучшей настройки вы можете использовать массив для регистрации нескольких событий:

window.addEventListener('load', resetTimer, true);
var events = ['mousedown', 'mousemove', 'keypress', 'scroll', 'touchstart'];
events.forEach(function(name) {
 document.addEventListener(name, resetTimer, true);
});

Настраивая отслеживаемые события, вы можете настроить обнаружение времени простоя в соответствии с потребностями вашего конкретного приложения.

Последний учебник Более>

Изучайте китайский

Отказ от ответственности: Все предоставленные ресурсы частично взяты из Интернета. В случае нарушения ваших авторских прав или других прав и интересов, пожалуйста, объясните подробные причины и предоставьте доказательства авторских прав или прав и интересов, а затем отправьте их по электронной почте: [email protected]. Мы сделаем это за вас как можно скорее.

Copyright© 2022 湘ICP备2022001581号-3