Socket.io JavaScript (Node.js) पूरी गाइड: उदाहरण सहित

Socket.io क्या है और इसकी ज़रूरत क्यों है?

Socket.io एक शक्तिशाली JavaScript लाइब्रेरी है जो क्लाइंट (ब्राउज़र) और सर्वर (Node.js) के बीच real-time (रीयल-टाइम) दो-तरफ़ा संचार सुनिश्चित करती है। पारंपरिक HTTP प्रोटोकॉल के विपरीत, जहाँ क्लाइंट अनुरोध भेजता है और जवाब का इंतज़ार करता है, Socket.io सर्वर को किसी भी समय क्लाइंट को डेटा भेजने की अनुमति देता है, और इसका उल्टा भी संभव है।

इसकी ज़रूरत क्यों है? एक चैट ऐप, ऑनलाइन गेम, लाइव ग्राफ़ वाला डैशबोर्ड, या डॉक्यूमेंट एडिटिंग सिस्टम की कल्पना करें। इन सभी परिदृश्यों में डेटा को बिना पेज रिफ़्रेश किए तुरंत अपडेट होना चाहिए। HTTP इसके लिए उपयुक्त नहीं है क्योंकि यह "अनुरोध-प्रतिक्रिया" सिद्धांत पर काम करता है। Socket.io एक स्थायी कनेक्शन (आमतौर पर WebSocket के माध्यम से) स्थापित करके इस समस्या को हल करता है, जिससे डेटा किसी भी समय दोनों दिशाओं में प्रवाहित हो सकता है।

Socket.io की मुख्य विशेषताएँ:

• दो-तरफ़ा संचार: सर्वर और क्लाइंट एक-दूसरे को संदेश भेज सकते हैं।
• रीयल-टाइम: संदेश तुरंत (न्यूनतम विलंब के साथ) पहुँचाए जाते हैं।
• स्वचालित पुनः कनेक्शन: यदि कनेक्शन टूट जाता है, तो Socket.io स्वयं इसे पुनर्स्थापित करने का प्रयास करता है।
• कमरे (Rooms): क्लाइंट को समूहित करने और केवल एक विशिष्ट समूह को संदेश भेजने की सुविधा।
• नेमस्पेस (Namespaces): एप्लिकेशन को स्वतंत्र संचार चैनलों में विभाजित करना।
• विश्वसनीयता: यदि WebSocket समर्थित नहीं है, तो Socket.io स्वचालित रूप से अन्य तरीकों (long-polling, FlashSocket आदि) पर स्विच कर जाता है।

Socket.io की स्थापना (Installation)

Socket.io दो भागों में आता है: सर्वर साइड (Node.js के लिए) और क्लाइंट साइड (ब्राउज़र के लिए)। दोनों को npm के माध्यम से स्थापित किया जाता है।

सर्वर साइड स्थापित करना

अपने प्रोजेक्ट फ़ोल्डर में टर्मिनल खोलें और यह कमांड चलाएँ:

npm install socket.io

क्लाइंट साइड स्थापित करना

क्लाइंट स्क्रिप्ट को दो तरीकों से जोड़ा जा सकता है:

1. CDN के माध्यम से (शुरुआत के लिए सबसे आसान):

<script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>

2. npm के माध्यम से (Webpack जैसे बंडलर्स वाले प्रोजेक्ट के लिए):

npm install socket.io-client

त्वरित शुरुआत: पहला चैट ऐप

चलिए एक सरल चैट बनाते हैं, जहाँ एक क्लाइंट का संदेश बाकी सभी को दिखाई दे।

चरण 1: सर्वर (फ़ाइल server.js)

// server.js
const http = require('http');
const { Server } = require("socket.io");

// 1. HTTP सर्वर बनाएँ
const server = http.createServer((req, res) => {
    res.writeHead(200, { 'Content-Type': 'text/plain' });
    res.end('Socket.io सर्वर चालू है');
});

// 2. Socket.io का इंस्टेंस बनाएँ, जो सर्वर से जुड़ा हो
const io = new Server(server);

// 3. नए क्लाइंट के कनेक्ट होने पर हैंडलर
io.on('connection', (socket) => {
    console.log('नया उपयोगकर्ता जुड़ा:', socket.id);

    // 4. क्लाइंट से 'chat message' इवेंट सुनें
    socket.on('chat message', (msg) => {
        console.log('संदेश:', msg);
        // 5. सभी जुड़े क्लाइंट्स को संदेश भेजें (भेजने वाले को भी)
        io.emit('chat message', msg);
    });

    // 6. क्लाइंट के डिस्कनेक्ट होने पर हैंडलर
    socket.on('disconnect', () => {
        console.log('उपयोगकर्ता डिस्कनेक्ट हुआ:', socket.id);
    });
});

// 7. सर्वर को पोर्ट 3000 पर चलाएँ
server.listen(3000, () => {
    console.log('सर्वर http://localhost:3000 पर चालू है');
});

चरण 2: क्लाइंट (फ़ाइल index.html)

<!DOCTYPE html>
<html>
<head>
    <title>Socket.io चैट</title>
    <script src="https://cdn.socket.io/4.7.5/socket.io.min.js"></script>
</head>
<body>
    <ul id="messages"></ul>
    <f