WebSockets TypeScript: रियल-टाइम एप्लिकेशन बनाएं शुरू से

शुरुआती लोगों के लिए ऑनलाइन Python प्रशिक्षक

Python आसानी से सीखें बिना सिद्धांत के बोझ के। स्वचालित जांच के साथ व्यावहारिक कार्य हल करें और ब्राउज़र में सीधे कोड लिखें।

पाठ्यक्रम शुरू करें

WebSockets क्यों है रियल-टाइम का जादू?

सोचिए, आपने एक सपोर्ट चैट खोला, मैसेज भेजा और... इंतज़ार कर रहे हैं। एक सेकंड, दो, पाँच। परिचित लग रहा है? यह क्लासिक HTTP रिक्वेस्ट है: आप माँगते हैं, सर्वर जवाब देता है। लेकिन क्या होगा अगर सर्वर खुद कुछ कहना चाहे? जैसे, CRM में नया ऑर्डर या ऑनलाइन गेम में आवाज़? यहाँ HTTP फेल हो जाता है — उसे लगातार पिंग-पोंग चाहिए।

WebSockets इस समस्या को जड़ से हल करते हैं। वे क्लाइंट और सर्वर के बीच एक स्थायी दो-तरफ़ा चैनल बनाते हैं। एक बार 'हैंडशेक' — और डेटा दोनों तरफ तुरंत उड़ने लगता है। कोई अतिरिक्त ट्रैफिक नहीं, कोई देरी नहीं। सिर्फ शुद्ध रियल-टाइम जादू।

इस लेख में हम TypeScript का उपयोग करके एक पूर्ण रियल-टाइम एप्लिकेशन बनाएंगे। Node.js पर WebSocket सर्वर के साथ काम करना सीखेंगे, क्लाइंट सेट करेंगे और एरर हैंडलिंग भी जोड़ेंगे। अंत तक, आप अपना खुद का चैट, नोटिफिकेशन सिस्टम या मल्टीप्लेयर गेम लिख सकेंगे।

\n\n

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

WebSocket एक प्रोटोकॉल है जो TCP के ऊपर काम करता है और ब्राउज़र और सर्वर के बीच स्थायी कनेक्शन सुनिश्चित करता है। HTTP के विपरीत, जहाँ हर रिक्वेस्ट कनेक्शन खोलता और बंद करता है, WebSocket इसे खुला रखता है।

यह कहाँ ज़रूरी है?

चैट और मैसेंजर — मैसेज बिना देरी के आते हैं।
ऑनलाइन गेम्स — खिलाड़ियों की पोजीशन रियल-टाइम में अपडेट होती है।
शेयर बाजार के भाव — कीमतें हर मिलीसेकंड बदलती हैं।
सहयोगात्मक संपादन — जैसे Google Docs।

TypeScript इसमें सख्त टाइपिंग जोड़ता है। आप गलती से स्ट्रिंग की जगह नंबर नहीं भेजेंगे — कंपाइलर डेवलपमेंट के दौरान ही एरर पकड़ लेगा। यह प्रोडक्शन में बग्स से बचाता है।

\n\n

प्रोजेक्ट सेटअप: Node.js + TypeScript + WebSocket

शुरुआत इनिशियलाइज़ेशन से करते हैं। सुनिश्चित करें कि आपके पास Node.js (वर्जन 18+) और npm इंस्टॉल है।

mkdir websocket-ts-chat\ncd websocket-ts-chat\nnpm init -y\nnpm install ws @types/ws typescript ts-node @types/node\nnpx tsc --init

tsconfig.json में स्ट्रिक्ट मोड चालू करें और outDir: "./dist" सेट करें। यह किसी भी TypeScript प्रोजेक्ट का आधार है।

\n\n

TypeScript में WebSocket सर्वर लिखना

server.ts फ़ाइल बनाएँ। यहाँ हम पोर्ट 8080 पर WebSocket सर्वर शुरू करेंगे।

import { WebSocketServer, WebSocket } from 'ws';\n\nconst wss = new WebSocketServer({ port: 8080 });\n\ninterface CustomWebSocket extends WebSocket {\n    id: string;\n    username?: string;\n}\n\nwss.on('connection', (ws: CustomWebSocket) => {\n    ws.id = generateId();\n    console.log(`क्लाइंट कनेक्ट हुआ: ${ws.id}`);\n\n    ws.on('message', (data: Buffer) => {\n        const message = data.toString();\n        console.log(`प्राप्त हुआ: ${message}`);\n\n        // भेजने वाले को छोड़कर सभी को भेजें\n        wss.clients.forEach((client) => {\n            if (client !== ws && client.readyState === WebSocket.OPEN) {\n                client.send(`[${ws.id}]: ${message}`);\n            }\n        });\n    });\n\n    ws.on('close', () => {\n        console.log(`क्लाइंट डिस्कनेक्ट हुआ: ${ws.id}`);\n    });\n\n    ws.send('चैट में आपका स्वागत है!');\n});\n\nfunction generateId(): string {\n    return Math.random().toString(36).substring(2, 9);\n}\n\nconsole.log('सर्वर ws://localhost:8080 पर शुरू हुआ');

मुख्य बिंदुओं को समझते हैं: