Socket.io একটি শক্তিশালী লাইব্রেরি যা রিয়েল-টাইম, ডুয়াল-ডিরেকশনাল ইভেন্ট-ভিত্তিক যোগাযোগ সরবরাহ করে। এটি Node.js এবং Express.js অ্যাপ্লিকেশনগুলিতে রিয়েল-টাইম যোগাযোগের জন্য খুবই জনপ্রিয়। এর মাধ্যমে আপনি দ্রুত ও সহজে ওয়েবসাইটের মধ্যে ইনস্ট্যান্ট মেসেজিং, চ্যাট অ্যাপ্লিকেশন, বা অন্যান্য রিয়েল-টাইম অ্যাপ্লিকেশন তৈরি করতে পারেন।
এখন চলুন, MeanJS স্ট্যাকের মধ্যে Socket.io ইন্টিগ্রেশন করার পদ্ধতি দেখি, যেখানে Node.js + Express.js ব্যাকএন্ড এবং AngularJS ফ্রন্টএন্ড ব্যবহার করা হবে।
Socket.io ইন্টিগ্রেশন (ব্যাকএন্ড)
- Socket.io ইনস্টল করা:
প্রথমে, Socket.io ইনস্টল করতে হবে। কমান্ড লাইনে এই কমান্ডটি রান করুন:
npm install socket.io --save
- Express.js এ Socket.io সেটআপ করা:
ব্যাকএন্ডে Socket.io ব্যবহারের জন্য, আপনার Express.js অ্যাপ্লিকেশনটি HTTP সার্ভারের সাথে যুক্ত করতে হবে। নিচে একটি উদাহরণ দেয়া হলো:
// server.js
const express = require('express');
const http = require('http');
const socketIo = require('socket.io');
const app = express();
// HTTP সার্ভার তৈরি করা
const server = http.createServer(app);
// Socket.io ইন্টিগ্রেশন করা
const io = socketIo(server);
// রিয়েল-টাইম ইভেন্ট হ্যান্ডলার
io.on('connection', (socket) => {
console.log('A user connected');
// ক্লায়েন্ট থেকে মেসেজ গ্রহণ করা
socket.on('chat message', (msg) => {
console.log('Message received: ' + msg);
io.emit('chat message', msg); // সবাইকে মেসেজ পাঠানো
});
// সংযোগ বন্ধ হলে
socket.on('disconnect', () => {
console.log('User disconnected');
});
});
// স্ট্যাটিক ফাইল সেবা প্রদান করা
app.use(express.static('public'));
// সার্ভার চালু করা
const port = process.env.PORT || 3000;
server.listen(port, () => {
console.log(`Server running on port ${port}`);
});
এখানে, Socket.io এর মাধ্যমে ক্লায়েন্ট-সাইড থেকে আসা 'chat message' ইভেন্ট গ্রহণ করা হয়েছে এবং এটি সমস্ত সংযুক্ত ক্লায়েন্টে পাঠানো হয়েছে।
Socket.io ইন্টিগ্রেশন (ফ্রন্টএন্ড - AngularJS)
- Socket.io-client ইনস্টল করা:
ফ্রন্টএন্ডে Socket.io ব্যবহার করার জন্য, আপনাকে socket.io-client ইনস্টল করতে হবে।
npm install socket.io-client --save
- AngularJS এর মধ্যে Socket.io ব্যবহার করা:
এখন, AngularJS অ্যাপ্লিকেশনটি Socket.io-client এর মাধ্যমে সার্ভারের সাথে সংযুক্ত হবে এবং রিয়েল-টাইম মেসেজিং পরিচালনা করবে।
// public/js/controllers/chat.controller.js
angular.module('meanApp')
.controller('ChatController', function($scope) {
// Socket.io ক্লায়েন্ট সাইড ইনস্ট্যান্স তৈরি
const socket = io();
// মেসেজ পাঠানোর ফাংশন
$scope.sendMessage = function() {
if ($scope.message) {
socket.emit('chat message', $scope.message); // সার্ভারে মেসেজ পাঠানো
$scope.message = ''; // ইনপুট ফিল্ড ক্লিয়ার করা
}
};
// সার্ভার থেকে মেসেজ গ্রহণ করা
socket.on('chat message', function(msg) {
$scope.messages.push(msg);
$scope.$apply(); // AngularJS ডাইজেস্ট লুপে মেসেজ আপডেট করা
});
$scope.messages = [];
});
এখানে, socket.emit() ব্যবহার করে 'chat message' ইভেন্টে মেসেজ পাঠানো হচ্ছে এবং socket.on() এর মাধ্যমে 'chat message' ইভেন্ট থেকে মেসেজ গ্রহণ করা হচ্ছে।
- AngularJS টেমপ্লেটে UI তৈরি করা:
এখন, আপনার ফ্রন্টএন্ডে একটি চ্যাট ইনপুট এবং মেসেজ শো করার UI তৈরি করুন।
<!-- public/views/chat.html -->
<div ng-app="meanApp" ng-controller="ChatController">
<h2>Chat Application</h2>
<!-- মেসেজ শো করার জন্য UI -->
<div ng-repeat="msg in messages">
<p>{{msg}}</p>
</div>
<!-- মেসেজ পাঠানোর ইনপুট ফিল্ড -->
<input type="text" ng-model="message" placeholder="Type a message" />
<button ng-click="sendMessage()">Send</button>
</div>
এখানে, ng-repeat ব্যবহার করে সমস্ত মেসেজগুলো UI তে শো করা হয়েছে এবং একটি ইনপুট ফিল্ডে মেসেজ টাইপ করা হচ্ছে।
Socket.io এর মাধ্যমে রিয়েল-টাইম মেসেজিং
এখন, আপনি আপনার MeanJS অ্যাপ্লিকেশনটি ব্যবহার করে রিয়েল-টাইম মেসেজিং কার্যক্রম করতে পারবেন। ব্যবহারকারী যখন একটি মেসেজ টাইপ করবে এবং সাবমিট করবে, তা Node.js + Express.js সার্ভারে চলে যাবে এবং সার্ভারটি ঐ মেসেজটি সমস্ত ক্লায়েন্টে পাঠিয়ে দেবে। AngularJS ক্লায়েন্ট এটি গ্রহণ করে UI তে প্রদর্শন করবে।
Socket.io ইন্টিগ্রেশন: সারাংশ
- Socket.io ক্লায়েন্ট-সাইড এবং সার্ভার-সাইডের মধ্যে রিয়েল-টাইম ডাটা ট্রান্সফারের জন্য ব্যবহৃত হয়।
- Node.js + Express.js এর মাধ্যমে Socket.io সার্ভারের সাথে ইন্টিগ্রেশন করা হয়, যেখানে সার্ভার ক্লায়েন্টের কাছ থেকে ডেটা গ্রহণ করে এবং এটি অন্যান্য ক্লায়েন্টে পাঠায়।
- AngularJS-এর মাধ্যমে ক্লায়েন্ট-সাইডে মেসেজ পাঠানো এবং গ্রহণ করা হয়, যাতে রিয়েল-টাইম চ্যাট বা অন্যান্য ইনস্ট্যান্ট মেসেজিং অ্যাপ্লিকেশন তৈরি করা যায়।
এই প্রক্রিয়া MeanJS স্ট্যাকের মধ্যে রিয়েল-টাইম ফিচার ইন্টিগ্রেট করতে সহায়তা করবে।
Read more