ইভেন্ট লিসেনার যোগ এবং মুছে ফেলা

Web Sockets এ, ইভেন্ট লিসেনার (event listeners) হল একটি গুরুত্বপূর্ণ উপাদান যা ক্লায়েন্ট এবং সার্ভারের মধ্যে ডেটা আদান-প্রদান বা নির্দিষ্ট ইভেন্টগুলির প্রতিক্রিয়া (reaction) পরিচালনা করে। ইভেন্ট লিসেনার ব্যবহার করে, আমরা Web Socket কানেকশনের উপর বিভিন্ন কার্যক্রম এবং ইভেন্টগুলি শোনা বা ধরতে পারি, যেমন কানেকশন খোলা, বার্তা প্রাপ্তি, এবং কানেকশন বন্ধ হওয়া।

এই টিউটোরিয়ালে, আমরা শিখবো কিভাবে Web Socket এ ইভেন্ট লিসেনার যোগ এবং মুছে ফেলতে হয়।

১. ইভেন্ট লিসেনার যোগ করা

Web Sockets এ ইভেন্ট লিসেনার যোগ করা হয় addEventListener() মেথড ব্যবহার করে। এই মেথডের মাধ্যমে আপনি নির্দিষ্ট ইভেন্টের জন্য লিসেনার ফাংশন নির্ধারণ করতে পারেন, যা ইভেন্ট ঘটলে কার্যকরী হবে।

সাধারণ সিনট্যাক্স:

webSocket.addEventListener('event', callbackFunction);

এখানে,

• event: যে ইভেন্টটি আপনি শোনার জন্য অপেক্ষা করবেন, যেমন 'open', 'message', 'close', অথবা 'error'।
• callbackFunction: যেটি ইভেন্টটি ট্রিগার হওয়ার পর চলবে।

উদাহরণ:

// WebSocket কানেকশন তৈরি করা
const webSocket = new WebSocket('wss://example.com/socket');

// ইভেন্ট লিসেনার যোগ করা
webSocket.addEventListener('open', function(event) {
    console.log('WebSocket কানেকশন স্থাপন হয়েছে');
});

webSocket.addEventListener('message', function(event) {
    console.log('বার্তা প্রাপ্তি:', event.data);
});

webSocket.addEventListener('close', function(event) {
    console.log('WebSocket কানেকশন বন্ধ হয়েছে');
});

webSocket.addEventListener('error', function(event) {
    console.error('WebSocket ত্রুটি:', event);
});

এই কোডে, Web Socket কানেকশন তৈরি করার পর, আমরা বিভিন্ন ধরনের ইভেন্টের জন্য লিসেনার যোগ করেছি:

• open ইভেন্ট যখন WebSocket কানেকশন সফলভাবে স্থাপন হয়।
• message ইভেন্ট যখন সার্ভার থেকে কোনো বার্তা আসে।
• close ইভেন্ট যখন কানেকশন বন্ধ হয়।
• error ইভেন্ট যখন কোনো ত্রুটি ঘটে।

২. ইভেন্ট লিসেনার মুছে ফেলা

Web Socket থেকে একটি নির্দিষ্ট ইভেন্ট লিসেনার মুছে ফেলতে removeEventListener() মেথড ব্যবহার করা হয়। এটি লিসেনারটি সরিয়ে দেয়, যাতে সেটি আর ওই ইভেন্টের জন্য সক্রিয় না থাকে।

সাধারণ সিনট্যাক্স:

webSocket.removeEventListener('event', callbackFunction);

এখানে,

• event: যে ইভেন্টের জন্য লিসেনারটি মুছে ফেলতে চান।
• callbackFunction: যেটি আপনি লিসেনার হিসেবে ব্যবহার করেছেন, তা সরিয়ে ফেলার জন্য প্রয়োজন।

উদাহরণ:

// WebSocket কানেকশন তৈরি করা
const webSocket = new WebSocket('wss://example.com/socket');

// ইভেন্ট লিসেনার যোগ করা
function onMessage(event) {
    console.log('বার্তা প্রাপ্তি:', event.data);
}
webSocket.addEventListener('message', onMessage);

// কিছু সময় পর, ইভেন্ট লিসেনার মুছে ফেলা
webSocket.removeEventListener('message', onMessage);

এখানে, আমরা প্রথমে message ইভেন্টের জন্য একটি লিসেনার যোগ করেছি এবং পরে সেটি removeEventListener() মেথড ব্যবহার করে সরিয়ে ফেলেছি। এর ফলে, WebSocket কানেকশনে message ইভেন্টটি আর শোনা হবে না।

৩. ইভেন্ট লিসেনার এর প্রয়োজনীয়তা

Web Sockets এ ইভেন্ট লিসেনার ব্যবহার করার প্রধান কারণ হল:

• রিয়েল-টাইম ডেটা: WebSocket ইভেন্ট লিসেনার গুলি আমাদের রিয়েল-টাইম ডেটা প্রাপ্তির জন্য প্রয়োজনীয় কার্যকরী প্রতিক্রিয়া প্রদান করে।
• এলার্টিং ও ম্যানেজমেন্ট: কানেকশন এবং ত্রুটির জন্য এলার্ট এবং সমাধান ব্যবস্থা তৈরি করতে পারে।
• অটোমেশন ও কার্যক্রম: নির্দিষ্ট ইভেন্টগুলির জন্য স্বয়ংক্রিয় প্রক্রিয়া শুরু করার মাধ্যমে ওয়েব অ্যাপ্লিকেশনগুলির কার্যক্ষমতা বাড়ানো যায়।

৪. একটি উদাহরণ: প্রাথমিক WebSocket অ্যাপ্লিকেশন

// WebSocket কানেকশন তৈরি করা
const webSocket = new WebSocket('wss://example.com/socket');

// 'open' ইভেন্টের জন্য লিসেনার যোগ করা
webSocket.addEventListener('open', function(event) {
    console.log('WebSocket কানেকশন সফল!');
    webSocket.send('হ্যালো সার্ভার!');
});

// 'message' ইভেন্টের জন্য লিসেনার যোগ করা
webSocket.addEventListener('message', function(event) {
    console.log('সার্ভার থেকে বার্তা:', event.data);
});

// 'close' ইভেন্টের জন্য লিসেনার যোগ করা
webSocket.addEventListener('close', function(event) {
    console.log('WebSocket কানেকশন বন্ধ হয়েছে');
});

// 'error' ইভেন্টের জন্য লিসেনার যোগ করা
webSocket.addEventListener('error', function(event) {
    console.error('WebSocket ত্রুটি:', event);
});

// কিছু সময় পর ইভেন্ট লিসেনার মুছে ফেলা
setTimeout(function() {
    webSocket.removeEventListener('message', function(event) {
        console.log('এই লিসেনারটি মুছে ফেলা হয়েছে');
    });
}, 5000);

এখানে, WebSocket সংযোগ স্থাপনের পর আমরা বিভিন্ন ইভেন্টের জন্য লিসেনার যোগ করেছি এবং পরে কিছু সময় পর message ইভেন্টের জন্য লিসেনারটি মুছে ফেলেছি।

সারাংশ

Web Sockets প্রোটোকলে ইভেন্ট লিসেনার ব্যবহার করে আমরা কানেকশন এবং ডেটা আদান-প্রদান সম্পর্কিত বিভিন্ন ইভেন্টগুলির জন্য প্রতিক্রিয়া নিশ্চিত করতে পারি। addEventListener() মেথডের মাধ্যমে ইভেন্ট লিসেনার যোগ এবং removeEventListener() মেথডের মাধ্যমে তা মুছে ফেলা হয়। এই প্রক্রিয়াটি WebSocket এর কার্যকরী এবং রিয়েল-টাইম ডেটা পরিচালনা করতে সাহায্য করে, যা চ্যাট অ্যাপ্লিকেশন, লাইভ স্ট্রিমিং এবং অন্যান্য ইন্টারঅ্যাকটিভ সিস্টেমে খুবই গুরুত্বপূর্ণ।