Socket.IO ক্লায়েন্ট এবং সার্ভারের মধ্যে কাস্টম ইভেন্ট তৈরি করার সুবিধা দেয়। এর মাধ্যমে আপনি আপনার প্রয়োজন অনুসারে নির্দিষ্ট ইভেন্ট তৈরি করতে পারেন এবং সেই ইভেন্টে ডেটা পাঠাতে বা গ্রহণ করতে পারেন।
Socket.IO তে কাস্টম ইভেন্ট তৈরি করা এবং ইভেন্টের মাধ্যমে ডেটা আদান-প্রদান করা খুবই সহজ। নিচে এর বিস্তারিত ব্যাখ্যা দেওয়া হলো।
১. Server Side: কাস্টম ইভেন্ট তৈরি করা
প্রথমে, সার্ভার সাইডে একটি কাস্টম ইভেন্ট তৈরি করতে হবে। নিচে একটি উদাহরণ দেখানো হলো যেখানে আমরা একটি কাস্টম ইভেন্ট new user তৈরি করছি:
// server.js (Server Side)
const http = require('http');
const socketIo = require('socket.io');
const server = http.createServer((req, res) => {
res.writeHead(200, { 'Content-Type': 'text/plain' });
res.end('Socket.IO Server Running');
});
const io = socketIo(server);
// কাস্টম ইভেন্ট 'new user' হ্যান্ডল করা
io.on('connection', (socket) => {
console.log('A user connected');
// 'new user' ইভেন্ট শোনানো
socket.on('new user', (data) => {
console.log('New user connected: ', data.name);
// সার্ভার থেকে কাস্টম ইভেন্ট 'welcome' পাঠানো
socket.emit('welcome', `Welcome to the server, ${data.name}!`);
});
// ক্লায়েন্ট ডিসকানেক্ট হওয়া
socket.on('disconnect', () => {
console.log('User disconnected');
});
});
server.listen(3000, () => {
console.log('Server running on port 3000');
});এখানে, সার্ভারে new user নামে একটি কাস্টম ইভেন্ট তৈরি করা হয়েছে। যখন একটি ক্লায়েন্ট new user ইভেন্ট পাঠায়, সার্ভার সেই তথ্য গ্রহণ করবে এবং একটি welcome কাস্টম ইভেন্ট পাঠাবে যা ক্লায়েন্টকে অভিনন্দন জানাবে।
২. Client Side: কাস্টম ইভেন্ট তৈরি এবং শোনা
ক্লায়েন্ট সাইডে কাস্টম ইভেন্ট শোনা এবং পাঠানোর জন্য socket.emit এবং socket.on ফাংশন ব্যবহার করা হয়। নিচে একটি ক্লায়েন্ট সাইড কোড দেওয়া হলো:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Socket.IO Custom Events</title>
<script src="/socket.io/socket.io.js"></script>
</head>
<body>
<h1>Socket.IO Custom Events Example</h1>
<input type="text" id="nameInput" placeholder="Enter your name">
<button onclick="sendNewUserEvent()">Send</button>
<p id="welcomeMessage"></p>
<script>
// Socket.IO সার্ভারে সংযোগ করা
const socket = io();
// ক্লিক করলে 'new user' ইভেন্ট পাঠানো
function sendNewUserEvent() {
const name = document.getElementById('nameInput').value;
socket.emit('new user', { name: name });
}
// সার্ভার থেকে 'welcome' কাস্টম ইভেন্ট শোনা
socket.on('welcome', function(message) {
document.getElementById('welcomeMessage').textContent = message;
});
</script>
</body>
</html>এখানে, ক্লায়েন্ট যখন Send বোতামটি ক্লিক করবে, তখন new user ইভেন্ট সার্ভারে পাঠানো হবে। সার্ভার থেকে একটি welcome ইভেন্ট ফিরে আসবে এবং তা ক্লায়েন্টে দেখানো হবে।
৩. কাস্টম ইভেন্টের মাধ্যমে একাধিক ডেটা পাঠানো
Socket.IO তে আপনি কাস্টম ইভেন্টের মাধ্যমে একাধিক ডেটা পাঠাতে পারেন। উদাহরণস্বরূপ, নিচে আমরা user details নামে একটি কাস্টম ইভেন্ট তৈরি করব এবং তা একটি অবজেক্টের মাধ্যমে পাঠাব।
Server Side:
// 'user details' ইভেন্ট হ্যান্ডল করা
socket.on('user details', (data) => {
console.log('User Details:', data);
// এখানে ডেটা পুনরায় ক্লায়েন্টে পাঠানো
socket.emit('details received', `User details received: ${data.name}, ${data.age}`);
});Client Side:
// 'user details' ইভেন্ট পাঠানো
socket.emit('user details', { name: 'John', age: 30 });
// 'details received' ইভেন্ট শোনা
socket.on('details received', function(message) {
console.log(message);
});এখানে, ক্লায়েন্ট user details ইভেন্ট সার্ভারে পাঠাবে যা একটি অবজেক্ট হিসেবে name এবং age ডেটা বহন করে। সার্ভার সেই তথ্য গ্রহণ করে এবং details received ইভেন্ট পাঠিয়ে ক্লায়েন্টকে নিশ্চিত করে।
৪. কাস্টম ইভেন্টের মাধ্যমে একাধিক ক্লায়েন্টে ডেটা পাঠানো
Socket.IO তে আপনি কাস্টম ইভেন্টের মাধ্যমে একাধিক ক্লায়েন্টে ডেটা পাঠাতে পারেন। সার্ভার থেকে একটি ইভেন্টে সমস্ত সংযুক্ত ক্লায়েন্টকে ডেটা পাঠাতে io.emit ব্যবহার করা হয়।
Server Side (Multiple Clients):
// কাস্টম ইভেন্ট 'broadcast' হ্যান্ডল করা
io.on('connection', (socket) => {
console.log('A user connected');
// ক্লায়েন্ট থেকে 'send broadcast' ইভেন্ট পাওয়া
socket.on('send broadcast', (message) => {
// সমস্ত ক্লায়েন্টে 'broadcast message' ইভেন্ট পাঠানো
io.emit('broadcast message', message);
});
socket.on('disconnect', () => {
console.log('User disconnected');
});
});Client Side:
// 'send broadcast' ইভেন্ট পাঠানো
socket.emit('send broadcast', 'Hello, everyone!');
// 'broadcast message' শোনা
socket.on('broadcast message', function(message) {
console.log('Broadcast message: ' + message);
});এখানে, একটি ক্লায়েন্ট যখন send broadcast ইভেন্ট পাঠায়, সার্ভার তা সমস্ত সংযুক্ত ক্লায়েন্টে broadcast message ইভেন্টের মাধ্যমে পাঠিয়ে দেয়।
সারসংক্ষেপ
- Socket.IO তে কাস্টম ইভেন্ট তৈরি করা এবং ডেটা আদান-প্রদান করা খুবই সহজ।
socket.emitব্যবহার করে কাস্টম ইভেন্ট পাঠানো এবংsocket.onব্যবহার করে কাস্টম ইভেন্ট শোনা যায়।- Socket.IO তে আপনি একাধিক ক্লায়েন্টে ডেটা পাঠাতে পারেন এবং কাস্টম ইভেন্টের মাধ্যমে জটিল ইন্টারঅ্যাকশন তৈরি করতে পারেন।
এই কাস্টম ইভেন্টের সাহায্যে আপনি ক্লায়েন্ট ও সার্ভারের মধ্যে অত্যন্ত কার্যকর যোগাযোগ ব্যবস্থা তৈরি করতে পারবেন।
Read more
