Maison >interface Web >js tutoriel >Comment faire la distinction entre l'actualisation de la page et la fermeture du navigateur en JavaScript ?

Comment faire la distinction entre l'actualisation de la page et la fermeture du navigateur en JavaScript ?

DDD
DDDoriginal
2024-11-03 17:42:29412parcourir

How to Distinguish Between Page Refresh and Browser Closure in JavaScript?

Identification de l'actualisation de la page et de la fermeture du navigateur

Lors du déclenchement de l'événement ONUNLOAD, il devient difficile de faire la distinction entre l'actualisation d'une page et la fermeture du navigateur . Cet article présente une solution à ce problème.

Solution

Cette solution utilise le stockage local HTML5 et la communication AJAX serveur-client :

  1. Gestionnaire de déchargement de fenêtre :

    • Enregistrez un gestionnaire onunload sur la fenêtre.
    • Dans ce gestionnaire, définissez un indicateur de stockage local pour indiquer le déchargement de la page ( myUnloadEventFlag).
    • Envoyer une requête AJAX au serveur, demandant de déconnecter l'utilisateur après un délai spécifié (par exemple, 5 secondes)
  2. Gestionnaire de chargement du corps :

    • Enregistrez un gestionnaire de chargement sur le corps de la page.
    • Dans ce gestionnaire, vérifiez l'indicateur de stockage local pour l'événement de déchargement.
    • Si l'écart entre l'heure actuelle et l'heure du drapeau est inférieur au délai spécifié, la page a été rechargée et la demande de déconnexion du serveur doit être annulée.
    • Sinon, il s'agit d'une fermeture du navigateur.
  3. Gestion du serveur :

    • Maintenir une liste des demandes de déconnexion.
    • Exécuter une minuterie qui inspecte régulièrement le liste.
    • Lorsque le délai d'attente d'une demande expire, déconnectez l'utilisateur.
    • Si une demande d'annulation est reçue, supprimez la demande de déconnexion correspondante de la liste.

Cette approche fait la distinction entre les fermetures d'onglets/fenêtres et les rechargements de pages en tenant compte du timing des événements de déchargement. Elle est applicable à d'autres événements tels que les liens suivis et les formulaires soumis en plaçant les gestionnaires d'événements sur les pages pertinentes.

Limitations :

Cette solution nécessite la prise en charge du stockage local HTML5 et peut ne pas l'être. fonctionner sur des navigateurs plus anciens comme MSIE7.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn