ব্রাউজার সেশন স্টোরেজ। ট্যাবগুলির মধ্যে ভাগ?


150

আমার সাইটে আমার কিছু মান রয়েছে যা আমি ব্রাউজারটি বন্ধ হয়ে গেলে পরিষ্কার করতে চাই। আমি sessionStorageসেই মানগুলিকে সঞ্চয় করতে বেছে নিয়েছি । ট্যাবটি বন্ধ হয়ে গেলে তারা প্রকৃতপক্ষে সাফ হয়ে যায়, এবং ব্যবহারকারী যদি f5 চাপ দেয় তবে তা রাখা হবে; তবে ব্যবহারকারী যদি অন্য কোনও ট্যাবে কিছু লিঙ্ক খোলে তবে এই মানগুলি অনুপলব্ধ।

আমি কীভাবে sessionStorageআমার অ্যাপ্লিকেশনটির সাথে সমস্ত ব্রাউজার ট্যাবগুলির মধ্যে মানগুলি ভাগ করতে পারি?

ব্যবহারের কেস: কিছু স্টোরেজে একটি মান রাখুন, সমস্ত ব্রাউজার ট্যাবগুলিতে সেই মানটি অ্যাক্সেসযোগ্য রাখুন এবং সমস্ত ট্যাব বন্ধ থাকলে তা সাফ করুন।

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

9
এটি আমার কাছে খুব অদ্ভুত যে এটি নকল হিসাবে বন্ধ হয়ে গেল। পুনরায় খোলার জন্য মনোনীত করা হচ্ছে। অন্যান্য বিষয়টি "একাধিক ট্যাবগুলির মধ্যে কীভাবে যোগাযোগ করবেন" সম্পর্কে, যা আমি যখন অন্য বিষয়টি পড়া শুরু করি তখন এটি ভিন্ন sounds
কাজম্যাগনুস

এটা সম্ভব কুকি ব্যবহার? ডিফল্টরূপে এরকম আচরণ করে কোনটি? (তবে প্রকৃতপক্ষে - পেতে এবং অ্যাকশন নির্ধারণের জন্য তারা আরও বাস্তবায়নের দাবি
জানাবে

উত্তর:


132

আপনি সেশনসটরেজ ডেটা এক ট্যাব থেকে অন্য ট্যাবে স্থানান্তর করতে আপনি লোকালস্টোরেশন এবং এর "স্টোরেজ" ইভেন্টলিস্টনার ব্যবহার করতে পারেন।

এই কোডটি সমস্ত ট্যাবে থাকা প্রয়োজন। এটি আপনার অন্যান্য স্ক্রিপ্টগুলির আগে কার্যকর করা উচিত।

// 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 এ পরীক্ষা করেছি

এই পদ্ধতিটি "আইই 8 তে কাজ করা উচিত" তবে আমি এটি পরীক্ষা করতে পারিনি কারণ আমি যখনই কোনও ট্যাব খোলি তখনই আমার আইই ক্র্যাশ করছিল .... কোনও ট্যাব ... যে কোনও ওয়েবসাইটে ... (ভাল ওল আইই) পিএস: আপনি যদি আইই 8 সমর্থন চান তবে আপনাকে অবশ্যই একটি জাসন শিম অন্তর্ভুক্ত করতে হবে। :)

ক্রেডিট এই সম্পূর্ণ নিবন্ধে যায়: http://blog.guya.net/2015/06/12/sharing-sessionstores-between-tabs-for-secure-mult-tab-authentication/


2
এই সমাধানটি কতটা নির্ভরযোগ্য? যেহেতু এটি ইভেন্ট ভিত্তিক, তাই কোনও ইভেন্ট মিস করার কোনও সম্ভাবনা আছে কি?
vivek241

2
উত্তরগুলির ভিত্তিতে আমি এটিকে সহজ করার জন্য স্থানীয় স্টোরেজ এবং সেশন স্টোরেজের উপর একটি গ্রন্থাগার তৈরি করেছি। সুতরাং এখন আপনি কেবল স্টোরেজ ম্যানেজ.আরসেভসায়েন্সডসেশনডাটা ('ডেটা', 'কী') কল করেন; অথবা স্টোরেজ ম্যানেজ.আরসেপ পারমানেন্ট ডেটা ('ডেটা', 'কী'); ইত্যাদি আপনার প্রয়োজনীয়তার উপর ভিত্তি করে। সম্পূর্ণ কোডটি এখানে: ebenmonney.com/blog/…
অ্যাডেন্টাম

@ vivek241 সমাধানটি আমার পক্ষে দুর্দান্ত কাজ করেছে যখন জেএস ফাইলের আকার ছোট ছিল এবং উপরে বর্ণিত "সমাধান স্ক্রিপ্ট" পৃষ্ঠায় প্রথম স্ক্রিপ্ট হিসাবে লোড করা হবে। যখন আমার জেএস ফাইলটি আরও বড় হয়েছে, 1000 বা তার বেশি লাইন বলুন, হঠাৎ এটি কাজ করা বন্ধ করে দেয় এবং আমার কুকিজ এবং নির্দিষ্ট স্থানীয় স্টোরেজ ডেটাও সরিয়ে দেয়। আমি নিশ্চিত নই যে এটি নির্ভরযোগ্য বা ক্রস ব্রাউজার সমাধান যা নির্ভর করা যেতে পারে। সুতরাং, একা কুকি দিয়ে সমস্যাটি সমাধান করার জন্য সমস্ত যুক্তি আবার লিখুন।
ওয়েবব্লভার 18'17

4
পূর্ববর্তী সমস্ত খোলা ট্যাবগুলিতে ইভেন্টটি ট্রিগার করা হবে না?
ডিটিপসন

3
দেখে মনে BroadcastChannelহচ্ছে এটি করা এখন ভাল সরঞ্জাম। developers.google.com/web/updates/2016/09/broadcastchannel
alexbea

71

এর sessionStorageজন্য ব্যবহার করা সম্ভব নয়।

থেকে MDN ডক্স

একটি নতুন ট্যাব বা উইন্ডোতে একটি পৃষ্ঠা খোলার ফলে একটি নতুন সেশন শুরু হবে।

এর অর্থ আপনি ট্যাবগুলির মধ্যে ভাগ করতে পারবেন না, এর জন্য আপনার ব্যবহার করা উচিত localStorage


8
ঠিক আছে, আমি এটি পেয়েছি, তবে সমস্ত ব্রাউজারের ট্যাবগুলি বন্ধ হয়ে যাওয়ার পরে আমি কীভাবে লোকালস্টোরেজ সাফ করতে পারি?
ভ্লাদিমির গর্ডিয়েনকো

আপনি path='/'ব্রাউজার উইন্ডোটি বন্ধ হয়ে গেলে এটি মুছে ফেলতে বাধ্য করে নথির কুকিকে পরিবর্তন করতে পারেন। তবে ট্যাবগুলির জন্য, এখনই আমার কোনও ধারণা নেই।
হেনরিক অ্যান্ডারসন 10

ঠিক আছে আমি আরও গভীর খনন করব এবং আমি যদি কোনও সমাধান খুঁজে পেয়েছি তবে আপনাকে জানাতে পারি, এটি কী অসম্ভব তা এখনই ভাবুন))
ভ্লাদিমির গর্ডিয়েনকো

5
@ আনমল হ্যাঁ, তবে আমি ইতিমধ্যে কোনও কোড সরবরাহ করতে পারি না, এটি অনেক আগেই ছিল। এটি কুৎসিত সমাধান তবে এটি আমার পক্ষে পুরোপুরি কার্যকর। চাবিকাঠিটি হল স্থানীয় স্টোরেজে ট্যাবসকে খোলা কাউন্টার রাখা এবং এটি পৃষ্ঠা লোডে বাড়ানো তবে পৃষ্ঠা আনলোডে হ্রাস। সুতরাং যখন পৃষ্ঠাটি আনলোড এবং ট্যাবস খুলুন == 1 তার শেষ ট্যাব এবং আমরা সমস্ত জিনিস সাফ করতে পারি। কিছু ছোট ছোট জিনিস ছিল যা আমাকে পরিচালনা করার দরকার ছিল তবে ঠিক কী মনে করতে পারে না। আশা করি এটা তোমাকে সাহায্য করবে!
ভ্লাদিমির গর্ডিয়েনকো

1
@ ভ্লাদিমিরগর্ডিয়েনকো যদি সেই localStorageডেটা মুছে ফেলার আনলোড ইভেন্টটি ঘটে থাকে কারণ কেউ একই ট্যাবে অন্য কোনও ডোমেনে নেভিগেট করে। আমার কাছে মনে হচ্ছে এটি ভুলভাবে localStorageডেটা মুছে ফেলবে - ট্যাবটি বন্ধ হয়ে যায়নি, এবং যদি ব্যক্তিটি আবার নেভিগেট করে তবে সে ঠিক আবার ডেটা চাইবে। যাইহোক, এটি একটি আকর্ষণীয় পন্থা, এটি
ভাবেননি

9
  1. আপনি কেবল এটি তৈরি করতে localStorageএবং তারিখটি স্মরণ করতে পারেন session cookie। যখন localStorage"সেশন" কুকির মানের চেয়ে পুরানো হয় তখন আপনি এটি সাফ করতে পারেনlocalStorage

    এটির বিবেচনাটি হ'ল যে কেউ ব্রাউজারটি বন্ধ হওয়ার পরেও ডেটা পড়তে পারে তাই আপনার ডেটা ব্যক্তিগত এবং আত্মবিশ্বাসী হলে এটি কোনও ভাল সমাধান নয়।

  2. আপনি localStorageকয়েক সেকেন্ডের জন্য আপনার ডেটা সঞ্চয় করতে পারেন এবং একটি storageইভেন্টের জন্য ইভেন্ট শ্রোতা যুক্ত করতে পারেন । আপনি যখন জানতে পারবেন যে কোনও ট্যাব যখন কোনও কিছু লিখেছিল localStorageএবং আপনি এর বিষয়বস্তুটি অনুলিপি করতে পারেন sessionStorage, তখন কেবল এটি পরিষ্কার করুনlocalStorage


9

প্রকৃতপক্ষে অন্যান্য ক্ষেত্রগুলির দিকে তাকিয়ে আপনি যদি _ব্ল্যাঙ্ক দিয়ে খোলেন তবে এটি পিতা-মাতা খোলা থাকাকালীন ট্যাবটি খোলার সময় পর্যন্ত সেশন স্টোরেজটি রাখবে:

এই লিঙ্কে, এটি পরীক্ষা করার জন্য একটি ভাল jsfiddle আছে। লক্ষ্য = "_ ফাঁকা" সাথে একটি লিঙ্ক অনুসরণ করার সময় নতুন উইন্ডোতে সেশন স্টোরেজ খালি নয়


0

ট্যাবগুলির মাধ্যমে সেশনস্টোরেজ স্থানান্তরযোগ্য না হওয়ার আমার সমাধানটি ছিল একটি লোকালপ্রফাইল তৈরি করা এবং এই পরিবর্তনশীলটিকে বন্ধ করে দেওয়া। যদি এই ভেরিয়েবলটি সেট করা থাকে তবে আমার সেশনসস্টোরেজ ভেরিয়েবলগুলি এগিয়ে যান এবং সেগুলি পুনরায় পুনরায় তৈরি করতে পারেন। যখন ব্যবহারকারী লগ আউট করে উইন্ডো বন্ধ হয় তখন এই লোকালস্টোরেজ ভেরিয়েবলটি ধ্বংস করে


-14

জাভা অ্যাপ্লিকেশনটির জন্য ব্রাউজার ট্যাবগুলির মধ্যে সেশন শিয়ারিং প্রতিরোধের জন্য এখানে একটি সমাধান রয়েছে। এটি আইই (জেএসপি / সার্লেট) এর জন্য কাজ করবে

  1. আপনার প্রথম জেএসপি পৃষ্ঠায়, লোড ইভেন্টটি একটি "উইন্ডো.টাইটেল" সেট করার জন্য একটি সার্লেট (অ্যাজেক্স কল) কল করে এবং সেশনে ইভেন্ট ট্র্যাকার (প্রথমবারের জন্য 0 হিসাবে সেট করার জন্য কেবল একটি পূর্ণসংখ্য পরিবর্তনশীল)
  2. নিশ্চিত হয়ে নিন যে অন্য পৃষ্ঠাগুলির মধ্যে কোনও উইন্ডো.টাইটেল সেট করে না
  3. সমস্ত পৃষ্ঠা (প্রথম পৃষ্ঠা সহ) পৃষ্ঠার চাপ শেষ হয়ে গেলে উইন্ডো শিরোনামটি পরীক্ষা করতে একটি জাভা স্ক্রিপ্ট যুক্ত করে। যদি শিরোনামটি পাওয়া না যায় তবে বর্তমান পৃষ্ঠা / ট্যাবটি বন্ধ করুন (এটি হওয়ার পরে "উইন্ডো.অনলোড" ফাংশনটি পূর্বাবস্থায় ফেলার বিষয়টি নিশ্চিত করুন)
  4. পৃষ্ঠাটি উইন্ডো.নুনলোড করুন জাভা স্ক্রিপ্ট ইভেন্টটি (সমস্ত পৃষ্ঠার জন্য) পৃষ্ঠাটি রিফ্রেশ ইভেন্টটি ক্যাপচার করতে, যদি কোনও পৃষ্ঠা সতেজ করা হয় তবে ইভেন্ট ট্র্যাকারটিকে পুনরায় সেট করতে সার্লেটকে কল করুন।

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) ওয়েব.এক্সএমএল - সার্লেট ম্যাপিং

<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");
} 
  }

3
এই প্রশ্নটি জাভাস্ক্রিপ্ট সম্পর্কে, জাভাস্ক্রিপ্টের সাথে এর কোনও যোগসূত্র নেই।
ভিক্টোপাচেকো 3107

এটি প্রশ্নটি সেশনস্টোরেজ এবং লোকালস্টোর সম্পর্কে আরও বেশি
আরআর 1112
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.