टैब या खिड़कियों के बीच संचार

Question

मैं एक तरीका खोज रहा था कि कैसे एक ही डोमेन (एक ही डोमेन पर, कॉर्स नहीं) में कई टैब या विंडो के बीच संवाद स्थापित किया जा सके। कई समाधान थे:

1. विंडो ऑब्जेक्ट का उपयोग करना
2. संदेश भेजें
3. कुकीज़
4. स्थानीय भंडार

पहला शायद सबसे खराब समाधान है - आपको अपनी वर्तमान विंडो से एक खिड़की खोलने की आवश्यकता है और तब तक आप केवल तब तक संवाद कर सकते हैं जब तक आप खिड़कियां खुली रखते हैं। यदि आप किसी भी विंडो में पृष्ठ को पुनः लोड करते हैं, तो आप सबसे अधिक संभावना संचार खो देते हैं।

दूसरा दृष्टिकोण, पोस्टमैसेज का उपयोग करते हुए, शायद क्रॉस-ऑरिजिन संचार को सक्षम करता है, लेकिन पहले दृष्टिकोण के समान समस्या को ग्रस्त करता है। आपको एक विंडो ऑब्जेक्ट बनाए रखने की आवश्यकता है।

तीसरा तरीका, कुकीज़ का उपयोग करते हुए, ब्राउज़र में कुछ डेटा स्टोर करें, जो प्रभावी रूप से एक ही डोमेन पर सभी विंडोज़ पर एक संदेश भेजने की तरह दिख सकता है, लेकिन समस्या यह है कि आप कभी भी नहीं जान सकते हैं कि सभी टैब "संदेश" पहले से ही पढ़ते हैं या नहीं सफाई करना। आपको समय-समय पर कुकी को पढ़ने के लिए किसी प्रकार का टाइमआउट लागू करना होगा। इसके अलावा आप अधिकतम कुकी लंबाई तक सीमित हैं, जो 4KB है।

चौथा समाधान, लोकलस्टोरेज का उपयोग करते हुए, कुकीज़ की सीमाओं को दूर करने के लिए लग रहा था, और यह सुनने की घटनाओं का उपयोग करने के लिए भी हो सकता है। इसका उपयोग कैसे किया जाता है इसका उत्तर स्वीकृत उत्तर में दिया गया है।

संपादित करें 2018: स्वीकृत उत्तर अभी भी काम करता है, लेकिन ब्रॉडकास्टनेल का उपयोग करने के लिए आधुनिक ब्राउज़रों के लिए एक नया समाधान है। ब्रॉडकास्टनेल का उपयोग करके टैब के बीच संदेश को आसानी से प्रसारित करने का वर्णन करने वाले एक सरल उदाहरण के लिए अन्य उत्तर देखें।

Comments

इस प्रश्न को "बहुत व्यापक" के रूप में बंद क्यों किया गया जब बहुत अधिक समान प्रश्न वर्षों से खुले हैं? JavaScript , stackoverflow.com/questions/2236828/… का उपयोग करके सभी खुली हुई खिड़कियों / टैब को संदेश भेजना , आप 2 ब्राउज़र टैब / विंडो के बीच कैसे संवाद करते हैं? और कुछ और।

— डैन डस्केल्सस्कु जूल

मैंने क्लाइंट-साइड डेटा स्टोरेज को प्रबंधित करने के लिए लोकलस्टोरेज और सेशनस्टोरेज पर एक लाइब्रेरी बनाई। आप StorageManager.savePermanentData ('डेटा', 'कुंजी') जैसे सामान कर सकते हैं; या storageManager.saveSyncedSessionData ('डेटा', 'कुंजी'); आप अपने डेटा को कैसे चाहते हैं, इसके आधार पर। यह वास्तव में प्रक्रिया को सरल करता है। पूरा लेख यहाँ: ebenmonney.com/blog/…

— adentum

danilovonline.ru/…

— zloctb

मैंने कुछ साल पहले पुस्तकालय sysend.js बनाया है , नवीनतम संस्करण में यह ब्रॉडकास्टनेल का उपयोग करता है। आप इस पृष्ठ को दो बार jcubic.pl/sysend.php खोलकर लाइब्रेरी का परीक्षण कर सकते हैं , यदि आप iframe प्रॉक्सी प्रदान करते हैं तो यह अलग मूल के साथ भी काम करता है।

— ज्यूबिक

क्या मैं उप डोमेन को एक ही मूल के रूप में मानता हूं? मेरा मतलब है, मेरे पास तीन डोमेन से नीचे है, क्या वे ब्रॉडकास्टनेल एपी के माध्यम से संवाद करते हैं? Alpha.firstdomain.com, beta.firstdomain.com, gama.firstdomain.com

— तेजस पटेल

Answer 1

2018 संपादित करें: आप इस उद्देश्य के लिए ब्रॉडकास्टनेल का बेहतर उपयोग कर सकते हैं, नीचे अन्य उत्तर देखें। फिर भी यदि आप अभी भी टैब के बीच संचार के लिए स्थानीय भंडार का उपयोग करना पसंद करते हैं, तो इसे इस तरह से करें:

जब कोई टैब दूसरे टैब को संदेश भेजता है, तो आपको सूचित करने के लिए, आपको बस 'स्टोरेज' इवेंट पर बांधने की जरूरत है। सभी टैब में, यह करें:

$(window).on('storage', message_receive);

message_receiveहर बार जब आप किसी अन्य टैब में लोकलस्टोरेज का कोई मूल्य निर्धारित करते हैं, तो फ़ंक्शन को कहा जाएगा। ईवेंट श्रोता में लोकलस्टोरेज के लिए नया सेट भी होता है, इसलिए आपको लोकलस्टोरेज ऑब्जेक्ट को पार्स करने की भी आवश्यकता नहीं है। यह बहुत आसान है क्योंकि आप किसी भी निशान को प्रभावी ढंग से साफ करने के लिए, उसके सेट होने के ठीक बाद मूल्य को रीसेट कर सकते हैं। संदेश भेजने के लिए यहां कार्य किए गए हैं:

// use local storage for messaging. Set message in local storage and clear it right away
// This is a safe way how to communicate with other tabs while not leaving any traces
//
function message_broadcast(message)
{
    localStorage.setItem('message',JSON.stringify(message));
    localStorage.removeItem('message');
}


// receive message
//
function message_receive(ev)
{
    if (ev.originalEvent.key!='message') return; // ignore other keys
    var message=JSON.parse(ev.originalEvent.newValue);
    if (!message) return; // ignore empty msg or msg reset

    // here you act on messages.
    // you can send objects like { 'command': 'doit', 'data': 'abcd' }
    if (message.command == 'doit') alert(message.data);

    // etc.
}

इसलिए अब एक बार जब आपका टैब ऑनस्टोरेज इवेंट में आ जाता है, और आपके पास ये दो कार्य कार्यान्वित हो जाते हैं, तो आप उदाहरण के लिए, अन्य टैब्स कॉलिंग को एक संदेश प्रसारित कर सकते हैं:

message_broadcast({'command':'reset'})

याद रखें कि एक ही संदेश को दो बार भेजने से केवल एक बार ही प्रचार होगा, इसलिए यदि आपको संदेशों को दोहराने की आवश्यकता है, तो उनके लिए कुछ विशिष्ट पहचानकर्ता जोड़ें, जैसे

message_broadcast({'command':'reset', 'uid': (new Date).getTime()+Math.random()})

यह भी याद रखें कि संदेश को प्रसारित करने वाला वर्तमान टैब वास्तव में इसे प्राप्त नहीं करता है, केवल उसी डोमेन पर अन्य टैब या विंडो।

आप पूछ सकते हैं कि यदि उपयोगकर्ता किसी भिन्न वेबपेज को लोड करता है या सेट इट के ठीक बाद उसका टैब बंद कर देता है () रिमूव इट से पहले ()। खैर, अपने स्वयं के परीक्षण से ब्राउज़र पूरे कार्य message_broadcast()समाप्त होने तक होल्ड पर उतार देता है। मैंने () चक्र के लिए कुछ बहुत लंबा डालने का परीक्षण किया और यह अभी भी बंद होने से पहले चक्र के समाप्त होने का इंतजार कर रहा था। यदि उपयोगकर्ता टैब को केवल इनबेटीव में मारता है, तो ब्राउज़र के पास संदेश को डिस्क पर सहेजने के लिए पर्याप्त समय नहीं होगा, इस प्रकार यह दृष्टिकोण मुझे सुरक्षित तरीके से लगता है कि बिना किसी निशान के संदेश कैसे भेजें। टिप्पणियाँ स्वागत है।

Comments

क्या आप JSON.parse () को लागू करने से पहले हटाए गए ईवेंट को अनदेखा कर सकते हैं?

— dandavis

पहले से मौजूद लोकलस्टोरेज डेटा सहित ईवेंट डेटा लिमिट को ध्यान में रखें। शिपिंग के बजाय केवल मैसेजिंग के लिए स्टोरेज इवेंट का उपयोग करना बेहतर / सुरक्षित हो सकता है। जैसे जब आपको पोस्टकार्ड मिलता है तो आपको पोस्ट ऑफिस में एक पैकेज लेने के लिए कहा जाता है ... साथ ही, लोकलस्टोरेज हार्ड ड्राइव पर जाता है, इसलिए यह अनजाने कैश को छोड़ सकता है और लॉग को प्रभावित कर सकता है, जो एक अलग परिवहन तंत्र पर विचार करने का एक और कारण है वास्तविक तथ्य।

— dandavis

मैंने कुछ समय पहले कुछ संबंधित किया था: danml.com/js/localstorageevents.js , कि किसी के पास एक ईमित्र आधार और "स्थानीय प्रतिध्वनि" है ताकि आप हर जगह हर चीज के लिए ईई का उपयोग कर सकें।

— डंडविस

Safari ब्रॉडकास्टचैनलाइन का समर्थन नहीं करता है - caniuse.com/#feat=broadcastchannel

— श्रीकांत

बस एक हेड अप, आप साझा श्रमिकों का भी उपयोग कर सकते हैं: developer.mozilla.org/en-US/docs/Web/API/SaringWorker (जो ब्राउज़रों में बेहतर समर्थन करता है)

— सेबलर

Answer 2

इस उद्देश्य के लिए एक आधुनिक एपीआई समर्पित है - ब्रॉडकास्ट चैनल

यह उतना ही आसान है:

var bc = new BroadcastChannel('test_channel');

bc.postMessage('This is a test message.'); /* send */

bc.onmessage = function (ev) { console.log(ev); } /* receive */

संदेश को सिर्फ DOMString होने की कोई आवश्यकता नहीं है, किसी भी प्रकार की वस्तु भेजी जा सकती है।

संभवतः, एपीआई की सफाई के अलावा, यह इस एपीआई का मुख्य लाभ है - कोई वस्तु नहीं।

वर्तमान में केवल क्रोम और फ़ायरफ़ॉक्स में समर्थित है , लेकिन आप एक पॉलीफ़िल पा सकते हैं जो लोकलस्टोरेज का उपयोग करता है।

Comments

रुको, तुम्हें कैसे पता कि संदेश कहाँ से है? क्या यह उन संदेशों को अनदेखा करता है जो एक ही टैब से आते हैं?

— AturSams

@zehelvion: प्रेषक इसे प्राप्त नहीं करेगा, उदाहरण के लिए यह अच्छा अवलोकन । इसके अलावा, आप जो चाहें मैसेज में डाल सकते हैं। जरूरत पड़ने पर भेजने वाले की कुछ आईडी।

— एस.जे.

एक अच्छी परियोजना है जो इस सुविधा को एक क्रॉस-ब्राउज़र लाइब्रेरी में

— लपेटती है

क्या सफारी के बारे में कोई सार्वजनिक संकेत आया है कि इस एपीआई के लिए समर्थन उस ब्राउज़र में आएगा या नहीं?

— केसी

@AturSams आप जाँचते हैं कि MessageEvent.origin, MessageEvent.source या MessageEvent.ports वही है जो आप चाहते हैं। हमेशा की तरह प्रलेखन शुरू करने के लिए सबसे अच्छी जगह है: developer.mozilla.org/en-US/docs/Web/API/MessageEvent

— Stefan Mihai Stanescu

Answer 3

JQuery पर आधारित समाधान की खोज करने वालों के लिए, यह थॉमस एम द्वारा प्रदान किए गए समाधान का एक सादा जावास्क्रिप्ट संस्करण है:

window.addEventListener("storage", message_receive);

function message_broadcast(message) {
    localStorage.setItem('message',JSON.stringify(message));
}

function message_receive(ev) {
    if (ev.key == 'message') {
        var message=JSON.parse(ev.newValue);
    }
}

Comments

आपने निष्कासन को क्यों छोड़ दिया?

— टॉमस एम।

मैं सिर्फ jQuery और जावास्क्रिप्ट के बीच अंतर पर ध्यान केंद्रित कर रहा था।

— नाचो कोलोमा

मैं हमेशा polyfill और समर्थित सुविधा नहीं होने की संभावना के कारण एक lib का उपयोग करता हूँ!

— अमीन रहीमी

Answer 4

Checkout AcrossTabs - क्रॉस-मूल ब्राउज़र टैब के बीच आसान संचार। यह संचार को बहुत आसान और विश्वसनीय बनाने के लिए पोस्टमेसेज और सेशनस्टोरेज एपीआई के संयोजन का उपयोग करता है ।

---

अलग-अलग दृष्टिकोण हैं और हर एक के अपने फायदे और नुकसान हैं। प्रत्येक पर चर्चा करें:

1. स्थानीय भंडार

   पेशेवरों :

   1. वेब स्टोरेज को कुकीज़ पर सुधार के रूप में सरलता से देखा जा सकता है, जिससे भंडारण क्षमता अधिक हो जाती है। यदि आप मोज़िला स्रोत कोड को देखते हैं तो हम देख सकते हैं कि 5120KB ( 5MB जो क्रोम पर 2.5 मिलियन चार्ट के बराबर है ) पूरे डोमेन के लिए डिफ़ॉल्ट भंडारण आकार है। यह आपको एक विशिष्ट 4KB कुकी की तुलना में काम करने के लिए काफी अधिक स्थान देता है।
   2. हर HTTP अनुरोध (HTML, चित्र, जावास्क्रिप्ट, सीएसएस, आदि) के लिए डेटा को सर्वर पर वापस नहीं भेजा जाता है - क्लाइंट और सर्वर के बीच यातायात की मात्रा को कम करता है।
   3. स्थानीयस्टोरेज में संग्रहीत डेटा स्पष्ट रूप से हटाए जाने तक बना रहता है। किए गए परिवर्तन सहेजे गए हैं और साइट पर सभी वर्तमान और भविष्य की यात्राओं के लिए उपलब्ध हैं।

   विपक्ष :

   1. यह समान-मूल नीति पर काम करता है । तो, संग्रहीत डेटा केवल उसी मूल पर उपलब्ध होगा।

2. कुकीज़

   पेशेवरों:

   1. दूसरों की तुलना में, वहाँ AFAIK कुछ भी नहीं है।

   विपक्ष:

   1. 4K कुकी संपूर्ण कुकी के लिए है, जिसमें नाम, मान, समाप्ति तिथि आदि शामिल हैं। अधिकांश ब्राउज़रों का समर्थन करने के लिए, नाम को 4000 बाइट्स और 4093 बाइट्स के तहत समग्र कुकी आकार के अंतर्गत रखें।

   2. डेटा को हर HTTP अनुरोध (HTML, चित्र, जावास्क्रिप्ट, सीएसएस, आदि) के लिए सर्वर पर वापस भेजा जाता है - क्लाइंट और सर्वर के बीच यातायात की मात्रा में वृद्धि।

      आमतौर पर, निम्नलिखित की अनुमति है:

      • कुल 300 कुकीज़
      • 4096 बाइट्स प्रति कुकी
      • डोमेन प्रति 20 कुकीज़
      • प्रति डोमेन 81920 बाइट्स (अधिकतम आकार 4096 = 81920 बाइट्स के 20 कुकीज़ दिए गए।)

3. sessionStorage

   पेशेवरों:

   1. के समान है localStorage।
   2. परिवर्तन केवल प्रति विंडो (या क्रोम और फ़ायरफ़ॉक्स जैसे ब्राउज़र में टैब) उपलब्ध हैं। किए गए परिवर्तन वर्तमान पृष्ठ के लिए सहेजे जाते हैं और उपलब्ध होते हैं, साथ ही भविष्य की साइट पर उसी विंडो पर जाते हैं। एक बार विंडो बंद होने के बाद, स्टोरेज डिलीट हो जाता है

   विपक्ष:

   1. डेटा केवल उस विंडो / टैब के अंदर उपलब्ध है जिसमें इसे सेट किया गया था।
   2. डेटा लगातार नहीं है यानी विंडो / टैब बंद होने के बाद यह खो जाएगा।
   3. जैसे localStorage, tt समान-मूल नीति पर काम करता है । तो, संग्रहीत डेटा केवल उसी मूल पर उपलब्ध होगा।

4. संदेश भेजें

   पेशेवरों:

   1. सुरक्षित रूप से क्रॉस-मूल संचार को सक्षम करता है।
   2. डेटा बिंदु के रूप में, WebKit कार्यान्वयन (सफारी और क्रोम द्वारा उपयोग किया जाता है) वर्तमान में किसी भी सीमा को लागू नहीं करता है (स्मृति से बाहर चलाकर लगाए गए लोगों के अलावा)।

   विपक्ष:

   1. वर्तमान विंडो से एक विंडो खोलने की आवश्यकता है और तब तक केवल तब तक संवाद कर सकते हैं जब तक आप खिड़कियां खुली रखते हैं।
   2. सुरक्षा चिंताओं - पोस्टमासेज के माध्यम से तार भेजना यह है कि आप अन्य जावास्क्रिप्ट प्लगइन्स द्वारा प्रकाशित अन्य पोस्टमैसेज घटनाओं को उठाएंगे, इसलिएtargetOriginसंदेशों के श्रोता को दिए जा रहे डेटा के लिएएकऔर एक पवित्रता जांचलागू करना सुनिश्चित करें।

5. PostMessage + SessionStorage का संयोजन

   कई टैब के बीच संवाद करने के लिए पोस्टमासेज का उपयोग करना और उसी समय सभी नए खोले गए टैब / विंडो में सेशनस्टोरेज का उपयोग करके डेटा को जारी रखना। डेटा तब तक बने रहेंगे जब तक कि टैब / विंडो नहीं खोले जाते। इसलिए, भले ही ओपनर टैब / विंडो बंद हो जाए, खुले टैब / विंडो में ताज़ा होने के बाद भी पूरा डेटा होगा।

मैंने इसके लिए एक JavaScript लाइब्रेरी लिखी है, जिसका नाम AcrossTabs है जो पोस्टमेज़ेज API का उपयोग क्रॉस- ऑरिजनल टैब / विंडो और सेशनस्टोरेज के बीच संवाद करने के लिए करती है ताकि वे खुले टैब / विंडो पहचान को तब तक बरकरार रख सकें जब तक वे रहते हैं।

Comments

उपयोग करना AcrossTabs, क्या किसी अन्य टैब में एक अलग वेबसाइट खोलना संभव है, और इससे डेटा को पैरेंट टैब पर प्राप्त करना है? मेरे पास दूसरी वेबसाइट के लिए प्रमाणीकरण विवरण होगा।

— मधुर भैया

हाँ, आप @ मादुरभैया

— सलवार

कुकी का सबसे बड़ा लाभ यह है कि यह उसी मूल डोमेन को पार करने की अनुमति देता है, जो आमतौर पर तब उपयोगी होता है जब आपके पास मूल का एक सेट होता है जैसे "a.target.com", "b.target.com" आदि

— StarPinkER

Answer 5

एक और तरीका जिसे लोगों को उपयोग करने पर विचार करना चाहिए वह साझा श्रमिक है। मुझे पता है कि यह एक अत्याधुनिक अवधारणा है, लेकिन आप एक साझा कार्यकर्ता पर एक रिले बना सकते हैं, जो लोकलस्टोरेज की तुलना में बहुत तेज है, और जब तक आप एक ही मूल पर नहीं होते हैं, तब तक माता-पिता / बच्चे की खिड़की के बीच संबंध की आवश्यकता नहीं होती है।

इस बारे में कुछ चर्चा के लिए मेरा जवाब यहाँ देखें ।

Answer 6

एक ही मूल के टैब / विंडो के बीच सिंक / संवाद करने के लिए एक छोटा सा ओपन-सोर्स घटक है (अस्वीकरण - मैं योगदानकर्ताओं में से एक हूं!) के आसपास localStorage।

TabUtils.BroadcastMessageToAllTabs("eventName", eventDataString);

TabUtils.OnBroadcastMessage("eventName", function (eventDataString) {
    DoSomething();
});

TabUtils.CallOnce("lockname", function () {
    alert("I run only once across multiple tabs");
});

https://github.com/jitbit/TabUtils

पुनश्च मैंने इसे "लॉक / म्यूटेक्स / सिंक" घटकों में से अधिकांश के लिए यहाँ सिफारिश करने के लिए स्वतंत्रता लिया था, जब घटनाएँ लगभग एक साथ घटित होती हैं

Answer 7

मैंने एक पुस्तकालय sysend.js बनाया है , यह बहुत छोटा है, आप इसके स्रोत कोड की जांच कर सकते हैं। पुस्तकालय में कोई बाहरी निर्भरता नहीं है।

आप इसे उसी ब्राउज़र और डोमेन में टैब / विंडो के बीच संचार के लिए उपयोग कर सकते हैं। लायब्रेरी ब्रॉडकास्टनेल का उपयोग करती है, यदि समर्थित है, या लोकलस्टोरेज से स्टोरेज इवेंट।

एपीआई बहुत सरल है:

sysend.on('foo', function(message) {
    console.log(message);
});
sysend.broadcast('foo', {message: 'Hello'});
sysend.broadcast('foo', "hello");
sysend.broadcast('foo'); // empty notification

जब आपके ब्रॉयर ब्रॉडकास्टचैनल का समर्थन करते हैं तो इसने शाब्दिक ऑब्जेक्ट भेजा (लेकिन यह वास्तव में ब्राउज़र द्वारा स्वतः-सीरियल किया गया है) और यदि यह जेन्सन के लिए पहले सीरीज़ नहीं किया गया है और दूसरे छोर पर deserialized है।

हाल के संस्करण में क्रॉस-डोमेन संचार के लिए प्रॉक्सी बनाने के लिए सहायक एपीआई भी है। (यह लक्ष्य डोमेन पर एकल HTML फ़ाइल की आवश्यकता है)।

यहाँ डेमो है ।

संपादित करें :

नया संस्करण क्रॉस-डोमेन संचार का भी समर्थन करता है, यदि आप proxy.htmlलक्ष्य डोमेन पर विशेष फ़ाइल शामिल करते हैं और proxyस्रोत डोमेन से कॉल फ़ंक्शन करते हैं:

sysend.proxy('https://target.com');

(प्रॉक्सी.html यह बहुत ही सरल HTML फ़ाइल है, जिसमें लाइब्रेरी के साथ केवल एक स्क्रिप्ट टैग है)।

यदि आप दो तरह से संचार चाहते हैं, तो आपको target.comडोमेन पर भी ऐसा ही करना होगा ।

नोट : यदि आप लोकलस्टोरेज का उपयोग करके समान कार्यक्षमता लागू करेंगे, तो IE में समस्या है। संग्रहण ईवेंट को उसी विंडो पर भेजा जाता है, जिसने ईवेंट को ट्रिगर किया और अन्य ब्राउज़रों के लिए इसे केवल अन्य टैब / विंडो के लिए लागू किया गया है।

Comments

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

— ब्राउनपोन जूल

Answer 8

मुझे लगता है कि काम करता है अधिकारी के बराबर एक मॉड्यूल बनाया Broadcastchannel लेकिन LocalStorage, IndexedDB और यूनिक्स सॉकेट के आधार पर फ़ॉलबैक है। यह सुनिश्चित करता है कि यह हमेशा वेबवर्क या NodeJS के साथ भी काम करता है। पबकी देखें : ब्रॉडकास्टनेल

Answer 9

मैंने अपने ब्लॉग पर इस पर एक लेख लिखा था: http://www.ebenmonney.com/blog/how-to-implement-remember-me-functionality-use-token-based-authentication-and-localstorage-in-a-a वेब-अनुप्रयोग ।

मेरे द्वारा बनाई गई लाइब्रेरी का उपयोग करके storageManagerआप इसे इस प्रकार प्राप्त कर सकते हैं:

storageManager.savePermanentData('data', 'key'): //saves permanent data
storageManager.saveSyncedSessionData('data', 'key'); //saves session data to all opened tabs
storageManager.saveSessionData('data', 'key'); //saves session data to current tab only
storageManager.getData('key'); //retrieves data

अन्य सुविधाजनक तरीकों के साथ-साथ अन्य परिदृश्यों को भी संभालने के लिए अन्य सुविधाजनक तरीके हैं

Answer 10

यह क्रोम के लिए टॉमस एम उत्तर का एक विकास storageहिस्सा है । हमें श्रोता जोड़ना होगा

window.addEventListener("storage", (e)=> { console.log(e) } );

स्टोरेज में लोड / सेव आइटम इस घटना को नहीं चलाता है - हम इसे मैन्युअल रूप से ट्रिगर करते हैं

window.dispatchEvent( new Event('storage') ); // THIS IS IMPORTANT ON CHROME

और अब, सभी खुले टैब-एस को घटना प्राप्त होगी