Javascript Girl
  1. Javascript Girl
  3. Déconnectez tous les onglets ouverts automatiquement lorsque l'utilisateur se déconnecte dans l'un d'entre eux
Intereting Posts
Impossible de rendre deux éléments du même composant React, réagir spécifiquement-google-chart Est-il possible de programmer tous les événements sur la page dans le navigateur? Comment jouer à la musique dans Android – phonegap Comment puis-je obtenir un résultat d'une boîte de dialogue modale dans JQuery Détecter entre un navigateur mobile ou une application PhoneGap Notification HTML5 avec PHP Comment réparez-vous automatiquement une zone de texte lorsqu'une page Web est chargée? Gulp renvoie 0 lorsque les tâches échouent Configuration de la barre de progression AJAX Existe-t-il un moyen d'obtenir un élément <button> pour lier un emplacement sans l'enrouler dans une balise <a href …? Convertir les données json en tablette html Comment afficher les valeurs de données du graphique circulaire de chaque tranche dans chart.js Détection de visages javascript / html5 / flash Jquery: this.not (': animated') && that.is (': visible') ne suit pas les règles, problème de syntaxe? Seulement quelques lignes de code Éléments contournables et non

Déconnectez tous les onglets ouverts automatiquement lorsque l'utilisateur se déconnecte dans l'un d'entre eux

J'ai créé une page de connexion, basée sur localStorage. En chargeant la page, j'ai vérifié la valeur de localStorage. Si j'ai ouvert la page Web dans plus d'un onglet, puis je me suis déconnecté de l'un des onglets, toutes les pages restantes doivent se déconnecter automatiquement.

Si le rechargement / rafraîchissement signifie qu'il se déconnecte.

Aidez-moi à exécuter un script, lorsque l'utilisateur affiche la page ou indiquez toute autre façon de résoudre ce problème.

Vous pouvez utiliser les événements de stockage pour être averti lorsque les valeurs locales de stockage sont modifiées. 

function storageChange (event) { if(event.key === 'logged_in') { alert('Logged in: ' + event.newValue) } } window.addEventListener('storage', storageChange, false)

Si, par exemple, l'un des onglets se déconnecte: 

 window.localStorage.setItem('logged_in', false)

Ensuite, tous les autres onglets recevront un StorageEvent , et une alerte apparaîtra: 

 Logged in: false

J'espère que cela répond à votre question!

"LocalStorage persiste toutes les données enregistrées indéfiniment sur l'ordinateur de l'utilisateur et sur les onglets du navigateur" Source

Cela signifie que si vous videz / supprimez les données de connexion que vous avez définies dans un onglet, les données seront également modifiées dans tous les autres onglets.

Donc, si l'utilisateur se déconnecte, les changements de données locales sont enregistrés.
Ensuite, sur vos onglets, détectez quand un utilisateur change de focus sur cet onglet à l'aide de l'événement onfocus : 

 function onFocus(){ //Reload Page if logged out (Check localStorage) window.location.reload(); }; if (/*@cc_on!@*/false) { // check for Internet Explorer document.addEventHandler("focusin", onFocus); } else { window.addEventHandler("focus", onFocus); }

La source

Cela signifie que vous n'utiliserez pas simultanément des javascript, ou recharger (éventuellement une grande quantité de) les onglets.

Il suffit d'écrire un petit javascript qui vérifie tous les 100 ms (p. Ex.) Si la «session» mémorisée dans localStorage existe encore. Si non, actualisez la page. Vous pouvez utiliser setInterval pour cela.

Consultez l' API de visibilité de la page pour HTML5 . Cela peut vous aider