Comment faire la différence de manière fiable entre les actualisations de pages et les fermetures de navigateurs dans le développement Web ?

Différencier les actions du navigateur : actualiser ou fermer

Dans le développement Web, faire la distinction entre l'actualisation des pages et la fermeture du navigateur pendant l'événement ONUNLOAD peut poser un défi. Voici une solution qui exploite le stockage local HTML5 et la communication client/serveur :

1. Déchargement sur la page :

   • Implémentez un gestionnaire d'événements onunload sur la fenêtre, comme myUnload().
   • Définissez un indicateur de stockage local myUnloadEventFlag sur l'horodatage actuel.
   • Informez le serveur qu'une déconnexion (par exemple, la fermeture du navigateur) peut se produire dans quelques secondes via un appel AJAX (askServerToDisconnectUserInAFewSeconds()).

2. On Page Load :

   • Implémenter un gestionnaire d'événements onload sur le corps, tel que myLoad().
   • Récupérez le myUnloadEventFlag du stockage local et comparez-le à l'horodatage actuel.
   • Si la durée entre l'événement de déchargement précédent et actuel est inférieure à 10 secondes, il s'agit probablement d'un rechargement (annulez la demande de déconnexion via AskServerToCancelDisconnectionRequest()).
   • Si la durée est supérieure à 10 secondes, il s'agit probablement d'une fermeture du navigateur.

3. Côté serveur :

   • Collectez les demandes de déconnexion dans une liste et définissez un thread de minuterie (par exemple, toutes les 20 secondes) pour inspecter la liste.
   • Lorsqu'une demande de déconnexion expire (par exemple, après 5 secondes), déconnectez l'utilisateur.
   • Si une demande d'annulation est reçue, supprimez la demande de déconnexion correspondante de la liste.

Cette approche peut également faire la différence entre la fermeture d'onglets/fenêtres, les liens suivis et les formulaires soumis. Il s'applique aux navigateurs prenant en charge le stockage local HTML5 et est plus fiable que de s'appuyer sur des propriétés d'événement spécifiques telles que la position du curseur.

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!