Comment JavaScript peut-il détecter le temps d'inactivité de l'utilisateur ?

Détection du temps d'inactivité en JavaScript

Le temps d'inactivité, défini comme une période d'inactivité de l'utilisateur ou sans utilisation du processeur, peut être exploité à diverses fins comme la prélecture de contenu. Cet article explore les moyens d'identifier les temps d'inactivité dans JavaScript.

Implémentation de JavaScript Vanilla

Une méthode consiste à utiliser l'approche basée sur les événements de JavaScript Vanilla. En enregistrant des écouteurs pour les événements DOM qui indiquent l'activité de l'utilisateur, tels que les mouvements de la souris, les frappes au clavier ou le défilement, le système peut détecter le moment où un utilisateur devient inactif.

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
    }
};

En initialisant la fonction inactivityTime, le script JavaScript commence à l'écoute de l'activité des utilisateurs. Si aucun événement n'est déclenché dans un intervalle de temps spécifié (par exemple, 3 000 millisecondes), la fonction de déconnexion est appelée, indiquant l'inactivité de l'utilisateur.

Élargissement de la couverture de détection

Pour améliorer détection du temps d'inactivité, des événements DOM supplémentaires peuvent être enregistrés. Événements couramment utilisés inclure :

• document.onload
• document.onmousemove
• document.onmousedown
• document.ontouchstart
• document.onclick
• document.onkeydown

Pour gestion améliorée des événements pendant le défilement, le code suivant peut être utilisé :

document.addEventListener('scroll', resetTimer, true);

Le vrai paramètre passé à addEventListener garantit que l'événement est capturé pendant la phase de capture plutôt que pendant la phase de bulle, garantissant la détection même dans les éléments défilants .

En résumé

En utilisant le modèle basé sur les événements de JavaScript, les développeurs peuvent détecter efficacement le temps d'inactivité des utilisateurs. Cette fonctionnalité peut être utilisée dans divers scénarios, notamment le préchargement de contenu, la gestion de l'alimentation et les mécanismes de déconnexion automatique.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!