ট্যাব বা উইন্ডোর মধ্যে যোগাযোগ

Question

আমি কীভাবে কোনও চিহ্ন ছাড়াই ব্রাউজারে (একই ডোমেনে, সিওআরএস নয়) একাধিক ট্যাব বা উইন্ডোজের মধ্যে যোগাযোগ করার উপায় অনুসন্ধান করছিলাম। বেশ কয়েকটি সমাধান ছিল:

1. উইন্ডো অবজেক্ট ব্যবহার করে
2. বার্তা দিন
3. বিস্কুট
4. localStorage

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

দ্বিতীয় পদ্ধতি, পোস্টমেসেজ ব্যবহার করে সম্ভবত ক্রস-অরিজিন যোগাযোগ সক্ষম করে, তবে প্রথম পদ্ধতির মতোই সমস্যাটি ভোগ করে। আপনার উইন্ডো অবজেক্ট বজায় রাখা দরকার।

তৃতীয় উপায়, কুকিগুলি ব্যবহার করে ব্রাউজারে কিছু ডেটা সঞ্চয় করুন যা কার্যকরভাবে একই ডোমেনের সমস্ত উইন্ডোতে একটি বার্তা প্রেরণের মতো দেখায়, তবে সমস্যাটি হ'ল আপনি কখনই জানতে পারবেন না যে সমস্ত ট্যাবগুলি "বার্তা" ইতিমধ্যে পড়েছে বা আগে নেই কিনা you পরিষ্কার আপ. পর্যায়ক্রমে কুকি পড়তে আপনাকে কিছু সময়সীমা বাস্তবায়ন করতে হবে। তবুও আপনি সর্বাধিক কুকি দৈর্ঘ্যের দ্বারা সীমাবদ্ধ, যা 4KB।

চতুর্থ সমাধান, লোকালস্টোরেশন ব্যবহার করে, কুকিজের সীমাবদ্ধতাগুলি অতিক্রম করেছে বলে মনে হয়েছিল, এবং এটি ইভেন্টগুলি ব্যবহার করে এমনকি শুনতেও পারে। এটি কীভাবে ব্যবহার করবেন তা গৃহীত উত্তরে বর্ণিত হয়েছে।

সম্পাদনা 2018: স্বীকৃত উত্তরটি এখনও কাজ করে তবে আধুনিক ব্রাউজারগুলির জন্য ব্রডকাস্টচ্যানেল ব্যবহার করার জন্য একটি নতুন সমাধান রয়েছে। ব্রডকাস্ট চ্যানেল ব্যবহার করে কীভাবে সহজেই ট্যাবগুলির মধ্যে বার্তা প্রেরণ করতে হয় তার একটি সাধারণ উদাহরণের জন্য অন্য উত্তরটি দেখুন।

Comments

বছরের পর বছর ধরে একই প্রশ্নগুলি খোলা থাকলে কেন এই প্রশ্নটি "খুব বিস্তৃত" হিসাবে বন্ধ হয়েছিল? জাভাস্ক্রিপ্ট , স্ট্যাকওভারফ্লো.com / প্রশ্নস / ২২৩6868৮৮/২ ব্যবহার করে সমস্ত উন্মুক্ত উইন্ডো / ট্যাবগুলিতে একটি বার্তা প্রেরণ , আপনি কীভাবে ২ টি ব্রাউজার ট্যাব / উইন্ডোর মধ্যে যোগাযোগ করবেন? এবং আরও কিছু।

— ড্যান ড্যাসক্লেস্কু

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

— অ্যাডেন্টাম

danilovonline.ru/…

— zloctb

আমি কয়েক বছর আগে লাইব্রেরি sysend.js তৈরি করেছি , সর্বশেষ সংস্করণে এটি ব্রডকাস্ট চ্যানেল ব্যবহার করে। আপনি jcubic.pl/sysend.php দু'বার এই পৃষ্ঠাটি খোলার মাধ্যমে গ্রন্থাগারটি পরীক্ষা করতে পারেন , যদি আপনি iframe প্রক্সি সরবরাহ করেন তবে এটি ভিন্ন উত্সের সাথেও কাজ করে।

— jcubic

আমি কি সাব ডোমেনটিকে একই উত্স হিসাবে বিবেচনা করব? মানে, আমার কাছে তিনটি ডোমেইনের নীচে আছে, তারা কি ব্রডকাস্টচ্যানেল এপিআইয়ের মাধ্যমে যোগাযোগ করে? 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()})

এছাড়াও মনে রাখবেন যে বর্তমান ট্যাব যা বার্তাটি সম্প্রচার করে তা প্রকৃতপক্ষে তা গ্রহণ করে না, কেবল একই ডোমেনের অন্যান্য ট্যাব বা উইন্ডো।

আপনি যদি জিজ্ঞাসা করতে পারেন যে ব্যবহারকারী কোনও আলাদা ওয়েবপৃষ্ঠা লোড করে বা সরানো আইটেম () এর আগে সেট আইটেম () কল করার ঠিক পরে তার ট্যাবটি বন্ধ করে দেয় happens ঠিক আছে, আমার নিজের পরীক্ষা থেকে ব্রাউজারটি পুরো ফাংশনটি message_broadcast()শেষ না হওয়া অবধি আনলোডিং রাখে । আমি () চক্রটির জন্য কিছুটা দীর্ঘ দীর্ঘস্থানে রেখে পরীক্ষা করেছি এবং এটি এখনও বন্ধ হওয়ার আগে চক্রটি শেষ হওয়ার জন্য অপেক্ষা করেছিল। ব্যবহারকারী যদি ট্যাবটিকে কেবল অন্তঃসত্ত্বাবস্থায় হত্যা করে, তবে ব্রাউজারটিতে মেসেজটি ডিস্কে সংরক্ষণ করার জন্য পর্যাপ্ত সময় থাকবে না, এইভাবে এই পদ্ধতিটি আমার কাছে মনে হয় কোনও উপায় ছাড়াই কীভাবে বার্তা প্রেরণ করা যায় তা নিরাপদ উপায়ে। মন্তব্য স্বাগত।

Comments

আপনি JSON.parse () চালনার আগে সরানোর ইভেন্টটিকে উপেক্ষা করতে পারেন?

— ডান্ডাভিস

প্রাক-বিদ্যমান লোকাল স্টোরেজ ডেটা সহ ইভেন্টের ডেটা সীমা মনে রাখবেন। স্টোরেজ ইভেন্টগুলি কেবল শিপিংয়ের পরিবর্তে বার্তাপ্রেরণের জন্য ব্যবহার করা আরও ভাল / নিরাপদ হতে পারে। যেমন আপনি যখন কোনও পোস্টকার্ড পাবেন যখন আপনাকে পোস্ট অফিসে প্যাকেজ তুলতে বলবে ... এছাড়াও, লোকালস্টোরেজগুলি হার্ড ড্রাইভে যায়, সুতরাং এটি অজানা ক্যাশে ছেড়ে যায় এবং লগগুলিতে প্রভাব ফেলতে পারে, যা অন্য একটি পরিবহন ব্যবস্থা বিবেচনা করার জন্য আরও একটি কারণ প্রকৃত তথ্য।

— ডান্ডাভিস

আমি কিছুক্ষণ আগে সম্পর্কিত কিছু করেছি: danml.com/js/localstorageevents.js , যেটির ইভেন্ট ইমিটার বেস এবং "স্থানীয় প্রতিধ্বনি" রয়েছে যাতে আপনি সর্বত্র যে কোনও কিছুর জন্য EE ব্যবহার করতে পারেন।

— ডান্ডাভিস

সাফারি ব্রডকাস্ট চ্যানেলকে

— শ্রীকান্ত

কেবলমাত্র

— শীর্ষস্থানীয়

Answer 2

এই উদ্দেশ্যে নিবেদিত একটি আধুনিক এপিআই রয়েছে - ব্রডকাস্ট চ্যানেল

এটি যতটা সহজ:

var bc = new BroadcastChannel('test_channel');

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

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

বার্তাটি কেবল একটি ডিওএমএসস্ট্রিং হওয়ার দরকার নেই, যে কোনও ধরণের অবজেক্ট পাঠানো যেতে পারে।

সম্ভবত, এপিআই পরিচ্ছন্নতা বাদে, এটি এই API এর মূল উপকার - কোনও অবজেক্ট স্ট্রিংফিকেশন।

বর্তমানে কেবল ক্রোম এবং ফায়ারফক্সে সমর্থিত তবে আপনি একটি পলিফিল খুঁজে পাবেন যা লোকালস্টোরেজ ব্যবহার করে।

Comments

অপেক্ষা করুন, আপনি কীভাবে জানবেন যে বার্তাটি কোথা থেকে এসেছে? এটি কি একই ট্যাব থেকে আসা বার্তাগুলি উপেক্ষা করে?

— আতুরস্যামস

@ জেহেলভিয়ন: প্রেরক এটি পাবেন না, উদাহরণস্বরূপ এই দুর্দান্ত ওভারভিউ অনুসারে । এছাড়াও, আপনি যা চান বার্তাটিতে রাখতে পারেন inc প্রেরকের কিছু আইডি, যদি প্রয়োজন হয়।

— জেড

একটি দুর্দান্ত প্রকল্প রয়েছে যা এখানে ক্রস ব্রাউজার লাইব্রেরিতে এই বৈশিষ্ট্যটি গুটিয়ে রাখে

— james2doyle

এই ব্রাউজারে এই এপিআই সমর্থন করবে না বা হবে না সে সম্পর্কে সাফারি থেকে কোনও পাবলিক সিগন্যাল এসেছে?

— কেসি

@ আচারস্যামস আপনি পরীক্ষা করে দেখুন যে মেসেজএভেন্ট.অরগিন, ম্যাসেজএভেন্ট.সোর্স বা ম্যাসেজএভেন্ট.পোর্টস আপনি যা চান তা। বরাবরের মতো ডকুমেন্টেশনটি শুরু করার জন্য সেরা জায়গা: বিকাশকারী.মোজিলা.আর.ইন.ইউএস

— ডকস /

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 এবং জাভাস্ক্রিপ্ট মধ্যে পার্থক্য উপর দৃষ্টি নিবদ্ধ ছিল।

— নাচো কলোমা

পলিফিল এবং সমর্থিত বৈশিষ্ট্য না থাকার সম্ভাবনার কারণে আমি সর্বদা একটি লিব ব্যবহার করি!

— আমিন রহিমি

Answer 4

চেকআউট অক্রসট্যাবস - ক্রস- আদি ব্রাউজার ট্যাবগুলির মধ্যে সহজ যোগাযোগ। এটা একটি সমন্বয় ব্যবহার করে postMessage এবং sessionStorage করতে যোগাযোগ অনেক সহজ এবং নির্ভরযোগ্য করতে API- টি।

---

বিভিন্ন পদ্ধতির রয়েছে এবং প্রত্যেকের নিজস্ব সুবিধা এবং অসুবিধা রয়েছে। প্রতিটি আলোচনা করা যাক:

1. স্থানীয় সঞ্চয়স্থান

   পেশাদাররা :

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

   কনস :

   1. এটি সম-উত্স নীতিতে কাজ করে । সুতরাং, সঞ্চিত ডেটা কেবল একই উত্সে উপলভ্য হবে।

2. বিস্কুট

   পেশাদাররা:

   1. অন্যের তুলনায় আফাইক কিছুই নেই।

   কনস:

   1. 4K সীমাটি পুরো কুকির জন্য, নাম, মান, মেয়াদ শেষ হওয়ার তারিখ ইত্যাদি most

   2. ক্লায়েন্ট এবং সার্ভারের মধ্যে ট্র্যাফিকের পরিমাণ বৃদ্ধি করে - প্রতিটি এইচটিটিপি অনুরোধের জন্য এইচটিএমএল, চিত্রগুলি, জাভাস্ক্রিপ্ট, সিএসএস ইত্যাদির জন্য সার্ভারে ডেটা ফেরত পাঠানো হয়।

      সাধারণত, নিম্নলিখিত অনুমোদিত:

      • মোট 300 কুকি
      • প্রতি কুকিতে 4096 বাইট
      • 20 ডোমেন প্রতি কুকি
      • প্রতি ডোমেন 81920 বাইট (সর্বোচ্চ আকারের 4096 = 81920 বাইট 20 টি কুকি দেওয়া হয়েছে))

3. sessionStorage

   পেশাদাররা:

   1. এটি অনুরূপ localStorage ।
   2. পরিবর্তনগুলি কেবল উইন্ডো প্রতি উপলব্ধ (বা ক্রোম এবং ফায়ারফক্সের মতো ব্রাউজারগুলিতে ট্যাব) পাওয়া যায়। করা পরিবর্তনগুলি সংরক্ষণ করা হয় এবং বর্তমান পৃষ্ঠার জন্য উপলব্ধ, পাশাপাশি একই উইন্ডোতে সাইটে ভবিষ্যতের দর্শন। একবার উইন্ডোটি বন্ধ হয়ে গেলে স্টোরেজটি মোছা হবে

   কনস:

   1. ডেটাটি কেবল সেট করা উইন্ডো / ট্যাবটির ভিতরেই উপলব্ধ।
   2. ডেটা অবিরাম নয় অর্থাৎ উইন্ডো / ট্যাবটি বন্ধ হয়ে যাওয়ার পরে এটি হারিয়ে যাবে।
   3. পছন্দ করুন localStorage, টিটি সম-উত্স নীতিতে কাজ করে । সুতরাং, সঞ্চিত ডেটা কেবল একই উত্সে উপলভ্য হবে।

4. বার্তা দিন

   পেশাদাররা:

   1. নিরাপদে ক্রস-আদি যোগাযোগ সক্ষম করে ables
   2. ডেটা পয়েন্ট হিসাবে, ওয়েবকিট বাস্তবায়ন (সাফারি এবং ক্রোম দ্বারা ব্যবহৃত) বর্তমানে কোনও সীমাবদ্ধতা প্রয়োগ করে না (স্মৃতিশক্তি ফুরিয়ে যাওয়ার দ্বারা আরোপিত সীমা ছাড়াই)।

   কনস:

   1. বর্তমান উইন্ডো থেকে একটি উইন্ডো খোলার প্রয়োজন এবং তারপরে আপনি যতক্ষণ উইন্ডোটি খোলা রাখবেন ততক্ষণ যোগাযোগ করতে পারবেন।
   2. সুরক্ষা উদ্বেগ - পোস্টম্যাসেজের মাধ্যমে স্ট্রিং প্রেরণ করা হ'ল আপনি অন্যান্য জাভাস্ক্রিপ্ট প্লাগইনগুলি দ্বারা প্রকাশিত পোস্টম্যাসেজ ইভেন্টগুলি বেছে নেবেন, সুতরাংtargetOriginবার্তা শ্রোতাদের কাছে দেওয়া ডেটার জন্যএকটিএবং স্যানিটি চেকবাস্তবায়ন করতে ভুলবেন না।

5. পোস্টমেসেজ + সেশনসোজারেজের সংমিশ্রণ

   একাধিক ট্যাবগুলির মধ্যে যোগাযোগ করার জন্য পোস্টম্যাসেজ ব্যবহার করা এবং একই সাথে সমস্ত নতুন খোলার ট্যাব / উইন্ডোতে সেশনসটরেজ ব্যবহার করে ডেটা পাস করে দেওয়া। যতক্ষণ না ট্যাব / উইন্ডো খোলা থাকবে ততক্ষণ ডেটা বজায় থাকবে। সুতরাং, ওপেনার ট্যাব / উইন্ডোটি বন্ধ হয়ে গেলেও, খোলা ট্যাব / উইন্ডোতে সতেজ হওয়া সত্ত্বেও পুরো ডেটা থাকবে।

আমি এটার জন্য একটি জাভাস্ক্রিপ্ট লাইব্রেরি লিখেছি, যার নাম অক্রসট্যাব যা পোস্ট ম্যাসেজ এপিআই ব্যবহার করে ক্রস-অরিজিন ট্যাব / উইন্ডো এবং সেশনসটরেজের মধ্যে খোলা ট্যাব / উইন্ডোজ পরিচয় যতক্ষণ বেঁচে থাকে ততক্ষণ চালিয়ে যায়।

Comments

ব্যবহার করে AcrossTabs, অন্য ট্যাবে কোনও আলাদা ওয়েবসাইট খোলার, এবং এর থেকে ডেটা প্যারেন্ট ট্যাবে পাওয়া সম্ভব? অন্য ওয়েবসাইটের জন্য আমার কাছে প্রমাণীকরণের বিশদ থাকবে।

— মধুর ভাইয়া

হ্যাঁ, আপনি @ মাধুরভাইয়া

— সফটওয়ার

কুকির সর্বাধিক সুবিধা হ'ল এটি ক্রস অরিজিন একই ডোমেনটিকে অনুমতি দেয়, যা আপনার যখন "a.target.com", "b.target.com" ইত্যাদির মতো উত্স তৈরি করেন তখন সাধারণত দরকারী

— স্টারপিংকার

Answer 5

লোকেদের ব্যবহার করার জন্য লোকেদের বিবেচনা করা উচিত should আমি জানি এটি একটি কাটিয়া প্রান্তের ধারণা, তবে আপনি কোনও ভাগ করা কর্মীর উপর রিলে তৈরি করতে পারেন যা লোকালস্টোরের চেয়ে অনেক বেশি দ্রুত এবং আপনি একই বংশোদ্ভূত না হওয়া অবধি পিতামাতার / সন্তানের উইন্ডোর মধ্যে সম্পর্কের প্রয়োজন নেই।

আমি এই সম্পর্কে কিছু আলোচনার জন্য এখানে আমার উত্তর দেখুন ।

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

যখন আপনার ব্রাউজারটি ব্রডকাস্টচ্যানেল সমর্থন করে এটি আক্ষরিক বস্তুটি প্রেরণ করে (তবে এটি আসলে ব্রাউজার দ্বারা স্বয়ংক্রিয়ভাবে সিরিয়ালাইজড হয়) এবং যদি তা না হয় তবে এটি প্রথমে জেএসএনে সিরিয়ালাইজড করা হয় এবং অন্য প্রান্তে ডিজিট্রাইজড করা হয়।

সাম্প্রতিক সংস্করণে ক্রস-ডোমেন যোগাযোগের জন্য প্রক্সি তৈরি করতে সহায়ক এপিআইও রয়েছে। (এটি লক্ষ্য ডোমেনে একক এইচটিএমএল ফাইলের প্রয়োজন)।

এখানে ডেমো রয়েছে ।

সম্পাদনা :

যদি আপনি টার্গেট ডোমেনের জন্য বিশেষ ফাইল এবং উত্স ডোমেন থেকে কল ফাংশন অন্তর্ভুক্ত করেন তবে নতুন সংস্করণ ক্রস-ডোমেন যোগাযোগকেও সমর্থন করে :proxy.htmlproxy

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

(প্রক্সি.এইচটিএমএল এটি খুব সাধারণ এইচটিএমএল ফাইল যা লাইব্রেরির সাথে কেবল একটি স্ক্রিপ্ট ট্যাগ রয়েছে)।

আপনি যদি দ্বি-মুখী যোগাযোগ চান তবে আপনাকে target.comডোমেনেও একই কাজ করতে হবে ।

দ্রষ্টব্য : আপনি যদি স্থানীয় স্টোরেজ ব্যবহার করে একই কার্যকারিতা বাস্তবায়ন করেন তবে আইইতে সমস্যা আছে। স্টোরেজ ইভেন্টটি একই উইন্ডোতে প্রেরণ করা হয়, যা ইভেন্টটি চালিত করে এবং অন্যান্য ব্রাউজারগুলির জন্য এটি কেবল অন্যান্য ট্যাব / উইন্ডোজের জন্যই আহ্বান জানানো হয়।

Comments

এর জন্য আপনাকে কিছু কুদো দিতে চেয়েছি। দুর্দান্ত মিষ্টি সামান্য সংযোজন যা সহজ এবং লগআউট সতর্কতা সফ্টওয়্যারকে মানুষকে দূরে সরিয়ে রাখার জন্য আমার ট্যাবগুলির মধ্যে যোগাযোগ করতে দেয়। চমৎকার কাজ. আপনি যদি মেসেজিং সমাধানটি ব্যবহার করার সহজ উপায় চান তবে আমি এটির জন্য অত্যন্ত পরামর্শ দিচ্ছি।

— ব্রাউনপনি

Answer 8

আমি একটি মডিউল তৈরি করেছি যা অফিসিয়াল ব্রডকাস্ট চ্যানেলের সমানভাবে কাজ করে তবে লোকালস্টোরেজ, ইনডেক্সডডিবি এবং ইউনিক্স-সকেটের ভিত্তিতে ফ্যালব্যাক রয়েছে। এটি নিশ্চিত করে যে এটি সর্বদা ওয়েব ওয়ার্কার্স বা নোডজেএস এর সাথেও কাজ করে। পাবকি দেখুন : ব্রডকাস্ট চ্যানেল

Answer 9

আমি আমার ব্লগে এ সম্পর্কে একটি নিবন্ধ লিখেছি: http://www.ebenmonney.com/blog/how-to-implement-remember-me-functionality- using-token-based-authentication-and-localstorage-in-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

অন্যান্য পরিস্থিতিতেও পরিচালনা করার জন্য অন্যান্য সুবিধাজনক পদ্ধতি রয়েছে are

Answer 10

এটি ক্রোমের জন্য টমাস এম উত্তরের একটি বিকাশের storageঅংশ । আমাদের অবশ্যই শ্রোতা যুক্ত করা উচিত

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

স্টোরেজে আইটেমটি লোড করুন / সংরক্ষণ করুন এই ইভেন্টটি নষ্ট করবে না - আমরা এটি নিজে হাতে চালিত করতে হবে

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

এবং এখন, সমস্ত উন্মুক্ত ট্যাব-গুলি ইভেন্টটি গ্রহণ করবে