ब्राउज़र सत्र। टैब के बीच साझा करें?

Question

मेरी साइट में मेरे कुछ मान हैं जो ब्राउज़र के बंद होने पर मैं स्पष्ट करना चाहता हूं। मैंने sessionStorageउन मूल्यों को संग्रहीत करने के लिए चुना । जब टैब बंद हो जाता है तो वे वास्तव में साफ हो जाते हैं, और रखा जाता है यदि उपयोगकर्ता f5 दबाता है; लेकिन अगर उपयोगकर्ता एक अलग टैब में कुछ लिंक खोलता है तो ये मान अनुपलब्ध हैं।

मैं sessionStorageअपने एप्लिकेशन के साथ सभी ब्राउज़र टैब के बीच मान कैसे साझा कर सकता हूं?

उपयोग का मामला: कुछ भंडारण में एक मूल्य डालें, सभी ब्राउज़र टैब में उस मूल्य को सुलभ रखें और यदि सभी टैब बंद हैं, तो इसे साफ़ करें।

if (!sessionStorage.getItem(key)) {
    sessionStorage.setItem(key, defaultValue)
}

Comments

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

— काजागमनस

यह कुकीज़ का उपयोग संभव है? जो डिफ़ॉल्ट रूप से ऐसा व्यवहार करता है? (लेकिन वास्तव में - प्राप्त और सेट कार्रवाई के लिए वे आगे कार्यान्वयन की मांग करेंगे) डेवलपर.

— mozilla.org/en-US/docs/Web/API/Document/cookie

Answer 1

आप सेशनस्टोरेज डेटा को एक टैब से दूसरे में ट्रांसफर करने के लिए लोकलस्टोरेज और इसके "स्टोरेज" इवेंटलिस्ट का उपयोग कर सकते हैं।

इस कोड को सभी टैब पर मौजूद होना चाहिए। यह आपकी अन्य लिपियों से पहले निष्पादित होना चाहिए।

// transfers sessionStorage from one tab to another
var sessionStorage_transfer = function(event) {
  if(!event) { event = window.event; } // ie suq
  if(!event.newValue) return;          // do nothing if no value to work with
  if (event.key == 'getSessionStorage') {
    // another tab asked for the sessionStorage -> send it
    localStorage.setItem('sessionStorage', JSON.stringify(sessionStorage));
    // the other tab should now have it, so we're done with it.
    localStorage.removeItem('sessionStorage'); // <- could do short timeout as well.
  } else if (event.key == 'sessionStorage' && !sessionStorage.length) {
    // another tab sent data <- get it
    var data = JSON.parse(event.newValue);
    for (var key in data) {
      sessionStorage.setItem(key, data[key]);
    }
  }
};

// listen for changes to localStorage
if(window.addEventListener) {
  window.addEventListener("storage", sessionStorage_transfer, false);
} else {
  window.attachEvent("onstorage", sessionStorage_transfer);
};


// Ask other tabs for session storage (this is ONLY to trigger event)
if (!sessionStorage.length) {
  localStorage.setItem('getSessionStorage', 'foobar');
  localStorage.removeItem('getSessionStorage', 'foobar');
};

मैंने इसे क्रोम, एफएफ, सफारी, यानी 11, यानी 10, यानी 9 में परीक्षण किया

यह विधि "IE8 में काम करना चाहिए" लेकिन मैं इसे परीक्षण नहीं कर सका क्योंकि मेरा IE हर बार जब मैं एक टैब खोल रहा था .... किसी भी टैब ... किसी भी वेबसाइट पर। (अच्छा ol IE) PS: यदि आप IE8 का समर्थन चाहते हैं तो आपको स्पष्ट रूप से JSON शिम को शामिल करना होगा। :)

इस पूरे लेख का श्रेय जाता है: http://blog.guya.net/2015/06/12/sharing-sessionstorage-between-tabs-for-secure-multi-tab-authentication/

Comments

यह समाधान कितना विश्वसनीय है? चूंकि यह घटना आधारित है, क्या किसी घटना को याद करने का कोई मौका है?

— vivek241

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

— adentum

@ vivek241 जेएस फ़ाइल का आकार छोटा होने और ऊपर दी गई "समाधान स्क्रिप्ट" पृष्ठ में पहली स्क्रिप्ट के रूप में लोड होने पर समाधान ने मेरे लिए बहुत काम किया। जब मेरी जेएस फाइल बहुत बड़ी हो गई, तो 1000 या उससे अधिक लाइनों का कहना है, इसने अचानक काम करना बंद कर दिया और मेरे कुकीज़ और विशिष्ट स्थानीय डेटा को भी हटा दिया। मुझे यकीन नहीं है कि यह एक विश्वसनीय या क्रॉस-ब्राउज़र समाधान है जिस पर भरोसा किया जा सकता है। तो, अकेले कुकी के साथ समस्या को हल करने के लिए सभी तर्क को फिर से लिखें।

— वेबब्लोवर

क्या घटना पहले के सभी खुले टैब में ट्रिगर नहीं होगी?

— ४

ऐसा लग रहा है BroadcastChannelकि अब यह करने के लिए एक अच्छा उपकरण है। Developers.google.com/web/updates/2016/09/broadcastchannel

— alexbea

Answer 2

इसके लिए उपयोग करना sessionStorageसंभव नहीं है।

से MDN डॉक्स

एक नया टैब या विंडो में एक पेज खोलने से एक नया सत्र शुरू होगा।

इसका मतलब है कि आप टैब के बीच साझा नहीं कर सकते, इसके लिए आपको उपयोग करना चाहिए localStorage

Comments

ठीक है, मुझे यह मिल गया, लेकिन जब सभी ब्राउज़र टैब बंद हो जाते हैं तो मैं स्थानीयस्टोर को कैसे साफ़ कर सकता हूं?

— व्लादिमीर गोर्डिएन्को

path='/'ब्राउज़र विंडो बंद होने पर आप दस्तावेज़ को कुकी को इस प्रकार बदलने के लिए मजबूर कर सकते हैं। लेकिन टैब के लिए, मुझे अभी कोई पता नहीं है।

— हेनरिक एंडर्सन

ठीक है, मैं गहरी खुदाई करूँगा और आपको बता दूंगा कि अगर मुझे कोई हल मिल गया, तो अब सोचें कि यह क्या असंभव है))

— व्लादिमीर गोर्डिएन्को

@Anmol हाँ, लेकिन मैं पहले से ही कोई कोड प्रदान नहीं कर सकता, यह बहुत पहले था। यह बदसूरत समाधान है, लेकिन यह मेरे लिए पूरी तरह से काम करता है। वहाँ कुंजी स्थानीय भंडारण में tabsOpened काउंटर रखने के लिए और पेज लोड पर इसे बढ़ाने के लिए है, लेकिन पेज अनलोड पर कमी। इसलिए जब पेज अनलोड हो जाए और tabsOpen == 1 इसका आखिरी टैब हो और हम सारा सामान साफ ​​कर सकें। कुछ मामूली चीजें थीं जिन्हें मुझे संभालने की जरूरत थी लेकिन खिचड़ी याद है कि वास्तव में क्या है। आशा है इससे आपकी मदद होगी!

— व्लादिमीर गोर्डिएन्को

@VladimirGordienko अगर localStorageडेटा को हटाने वाली अनलोड घटना होती है तो क्या होता है क्योंकि कोई व्यक्ति एक ही टैब में एक अलग डोमेन पर नेविगेट करता है। मुझे लगता है कि यह गलत तरीके से localStorageडेटा को हटा देगा - टैब बंद नहीं हुआ, और यदि व्यक्ति वापस नेविगेट करता है, तो वह डेटा फिर से, सही चाहेगा। वैसे भी, यह एक दिलचस्प दृष्टिकोण है, इस बारे में नहीं सोचा: -)

— काजाग्नस

Answer 3

1. आप केवल localStorageउस तिथि को उपयोग कर सकते हैं और याद कर सकते हैं जिसे पहली बार बनाया गया था session cookie। जब localStorage"सत्र" कुकी के मूल्य से पुराना होता है तो आप इसे साफ़ कर सकते हैंlocalStorage

   इसमें से यह है कि कोई व्यक्ति ब्राउज़र बंद होने के बाद भी डेटा को पढ़ सकता है, तो यह एक अच्छा समाधान नहीं है यदि आपका डेटा निजी और विश्वासपात्र है।

2. आप localStorageकुछ सेकंड के लिए अपना डेटा स्टोर कर सकते हैं और किसी storageईवेंट के लिए इवेंट श्रोता जोड़ सकते हैं । इस तरह से आपको पता चल जाएगा कि जब किसी भी टैब ने कुछ को लिखा था localStorageऔर आप उसकी सामग्री को कॉपी कर सकते हैं sessionStorage, तो बस इसे साफ़ करेंlocalStorage

Answer 4

वास्तव में अन्य क्षेत्रों को देखते हुए, यदि आप _blank के साथ खुलते हैं, तो यह सेशनस्टोरेज को तब तक बनाए रखता है, जब तक कि आप पैरेंट को खोलते समय टैब खोल रहे हों:

इस कड़ी में, इसका परीक्षण करने के लिए एक अच्छा jsfiddle है। नई विंडो पर sessionStorage खाली नहीं है, जब लक्ष्य के साथ एक लिंक का अनुसरण करते हुए = "_ blank"

Answer 5

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

Answer 6

यहाँ एक जावा अनुप्रयोग के लिए ब्राउज़र टैब के बीच सत्र को रोकने के लिए एक समाधान है। यह IE (JSP / सर्वलेट) के लिए काम करेगा

1. आपके पहले JSP पेज में, ऑनलोड इवेंट एक सर्वलेट (ajex कॉल) को एक "window.title" और इवेंट ट्रैकर को सेशन में सेट करने के लिए (सिर्फ एक पूर्णांक चर को पहली बार 0 के रूप में सेट करने के लिए कहता है)
2. सुनिश्चित करें कि अन्य पृष्ठों में से कोई भी विंडो सेट नहीं करता है। शीर्षक
3. पृष्ठ लोड होने के बाद सभी पृष्ठ (प्रथम पृष्ठ सहित) एक जावा स्क्रिप्ट जोड़ते हैं ताकि विंडो शीर्षक की जाँच की जा सके। यदि शीर्षक नहीं मिला है, तो वर्तमान पृष्ठ / टैब बंद करें (ऐसा होने पर "window.unload" फ़ंक्शन को पूर्ववत करना सुनिश्चित करें)
4. पेज रिफ्रेश इवेंट को कैप्चर करने के लिए पेज window.onunload java स्क्रिप्ट इवेंट (सभी पेजों के लिए) सेट करें, अगर किसी पेज को इवेंट ट्रैकर को रीसेट करने के लिए सर्वलेट कॉल किया गया हो।

1) पहला पेज जेएस

BODY onload="javascript:initPageLoad()"

function initPageLoad() {
    var xmlhttp;

    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {                           var serverResponse = xmlhttp.responseText;
            top.document.title=serverResponse;
        }
    };
                xmlhttp.open("GET", 'data.do', true);
    xmlhttp.send();

}

2) सभी पृष्ठों के लिए सामान्य जेएस

window.onunload = function() {
    var xmlhttp;
    if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else {
        // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    }
    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {             
            var serverResponse = xmlhttp.responseText;              
        }
    };

    xmlhttp.open("GET", 'data.do?reset=true', true);
    xmlhttp.send();
}

var readyStateCheckInterval = setInterval(function() {
if (document.readyState === "complete") {
    init();
    clearInterval(readyStateCheckInterval);
}}, 10);
function init(){ 
  if(document.title==""){   
  window.onunload=function() {};
  window.open('', '_self', ''); window.close();
  }
 }

3) web.xml - सर्वलेट मैपिंग

<servlet-mapping>
<servlet-name>myAction</servlet-name>
<url-pattern>/data.do</url-pattern>     
</servlet-mapping>  
<servlet>
<servlet-name>myAction</servlet-name>
<servlet-class>xx.xxx.MyAction</servlet-class>
</servlet>

4) सर्वलेट कोड

public class MyAction extends HttpServlet {
 public void doGet(HttpServletRequest request, HttpServletResponse response)
        throws IOException {
    Integer sessionCount = (Integer) request.getSession().getAttribute(
            "sessionCount");
    PrintWriter out = response.getWriter();
    Boolean reset = Boolean.valueOf(request.getParameter("reset"));
    if (reset)
        sessionCount = new Integer(0);
    else {
        if (sessionCount == null || sessionCount == 0) {
            out.println("hello Title");
            sessionCount = new Integer(0);
        }
                          sessionCount++;
    }
    request.getSession().setAttribute("sessionCount", sessionCount);
    // Set standard HTTP/1.1 no-cache headers.
    response.setHeader("Cache-Control", "private, no-store, no-cache, must-                      revalidate");
    // Set standard HTTP/1.0 no-cache header.
    response.setHeader("Pragma", "no-cache");
} 
  }

Comments

यह प्रश्न जावास्क्रिप्ट के बारे में है, इसका जावास्क्रिप्ट से कोई लेना देना नहीं है।

— १

यह सवाल

— सेशनस्टोरेज