जब उपयोगकर्ता उनमें से किसी एक में लॉग आउट करता है तो सभी खुले टैब स्वचालित रूप से लॉग आउट करें

Question

मैंने स्थानीय स्टोरेज के आधार पर लॉगिन पृष्ठ बनाया है। पृष्ठ लोड करने पर मैंने स्थानीय स्टोरेज के मूल्य की जांच की है। यदि मैंने एक से अधिक टैब में वेब पेज खोला है और फिर मैं किसी भी टैब से लॉगआउट करता हूं, तो शेष शेष पृष्ठों को स्वचालित रूप से लॉगआउट करना चाहिए।

यदि पुनः लोड/रीफ्रेश का अर्थ है कि यह लॉग आउट हो रहा है।

कृपया मुझे एक स्क्रिप्ट चलाने में मदद करें, जब उपयोगकर्ता पृष्ठ को देखे या इस समस्या को हल करने के किसी अन्य तरीके से कहें।

Answer 1

बस एक छोटी जावास्क्रिप्ट लिखें जो प्रत्येक 100ms (उदाहरण के लिए) की जांच करता है यदि स्थानीय स्टोरेज में संग्रहीत "सत्र" अभी भी मौजूद है। यदि नहीं, पृष्ठ को रीफ्रेश करें। इसके लिए आप setInterval का उपयोग कर सकते हैं।

Answer 2

Page Visibility API for HTML5 पर एक नज़र डालें। इससे आपको यह पता

Answer 3

"localStorage किसी भी उपयोगकर्ता के कंप्यूटर पर और संपूर्ण ब्राउज़र टैब में अनिश्चित काल के लिए डेटा सहेजा बनी रहती है" मदद कर सकते हैं ^Source

इसका मतलब यह है कि यदि आप खाली/आप एक में निर्धारित किया है लॉगिन डेटा हटाने टैब, डेटा को अन्य सभी टैबों में भी बदला जाएगा।

तो, यदि उपयोगकर्ता लॉग आउट करता है, तो स्थानीय स्टोरेज डेटा बदलता है।
फिर, अपने टैब पर, फिर 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); 
} 

Source

इसका मतलब है आप लगातार जावास्क्रिप्ट चल नहीं किया जाएगा, या पुन: लोड (एक संभवतः बड़ी मात्रा में) टैब एक ही समय में।

Answer 4

स्थानीय स्टोरेज मान बदलते समय अधिसूचित होने के लिए आप Storage events का उपयोग कर सकते हैं।

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

हैं, उदाहरण के लिए, एक टैब लॉग आउट:

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

तब सभी अन्य टैब एक StorageEvent प्राप्त करेंगे, और एक चेतावनी दिखाई देगा:

Logged in: false 

हम उम्मीद करते है कि यह आपके सवाल का जवाब दे देगा!