WebSocket लाइब्रेरीज़ TypeScript: ws और Socket.IO – पूर्ण गाइड

WebSocket लाइब्रेरीज़ TypeScript: ws और Socket.IO

WebSocket एक प्रोटोकॉल है जो क्लाइंट और सर्वर के बीच रीयल-टाइम में दो-तरफा संचार सुनिश्चित करता है। TypeScript/Node.js इकोसिस्टम में, WebSocket के साथ काम करने के लिए सबसे लोकप्रिय लाइब्रेरीज़ ws (हल्की) और Socket.IO (अतिरिक्त सुविधाओं के साथ) हैं। इस लेख में हम दोनों लाइब्रेरीज़, उनकी इंस्टॉलेशन, बुनियादी उपयोग और TypeScript पर कोड उदाहरणों पर विस्तार से चर्चा करेंगे।

1. ws लाइब्रेरी

ws Node.js के लिए एक न्यूनतम और तेज़ WebSocket लाइब्रेरी है, जो TypeScript के साथ पूरी तरह से संगत है। यह बिना किसी अनावश्यक एब्स्ट्रैक्शन के शुद्ध WebSocket API प्रदान करती है।

इंस्टॉलेशन

npm install wsnpm install -D @types/ws

TypeScript पर WebSocket सर्वर बनाना

import { WebSocketServer, WebSocket } from 'ws';

const wss = new WebSocketServer({ port: 8080 });

wss.on('connection', (ws: WebSocket) => {  console.log('क्लाइंट कनेक्ट हुआ');

  // क्लाइंट को संदेश भेजना  ws.send('स्वागत है!');

  // आने वाले संदेशों को संभालना  ws.on('message', (data: Buffer) => {    const message = data.toString();    console.log(`प्राप्त हुआ: ${message}`);

    // सभी कनेक्टेड क्लाइंट्स को उत्तर भेजना    wss.clients.forEach((client) => {      if (client.readyState === WebSocket.OPEN) {        client.send(`इको: ${message}`);      }    });  });

  // कनेक्शन बंद होने को संभालना  ws.on('close', () => {    console.log('क्लाइंट डिस्कनेक्ट हुआ');  });});

console.log('WebSocket सर्वर पोर्ट 8080 पर शुरू हुआ');

TypeScript पर क्लाइंट कोड

const ws = new WebSocket('ws://localhost:8080');

ws.onopen = () => {  console.log('कनेक्शन स्थापित हुआ');  ws.send('नमस्ते, सर्वर!');};

ws.onmessage = (event: MessageEvent) => {  console.log(`सर्वर से उत्तर: ${event.data}`);};

ws.onclose = () => {  console.log('कनेक्शन बंद हुआ');};

2. Socket.IO लाइब्रेरी

Socket.IO एक उच्च-स्तरीय लाइब्रेरी है जो WebSocket के ऊपर बनी है। यह निम्नलिखित जोड़ती है:

• कनेक्शन टूटने पर स्वचालित पुनः कनेक्शन
• रूम और नेमस्पेस का समर्थन
• फ़ॉलबैक तंत्र (यदि WebSocket उपलब्ध नहीं है तो HTTP long-polling पर स्विच)
• अंतर्निहित इवेंट समर्थन

इंस्टॉलेशन

npm install socket.io socket.io-clientnpm install -D @types/socket.io @types/socket.io-client

Socket.IO के साथ TypeScript पर सर्वर

import { Server } from 'socket.io';import http from 'http';

const server = http.createServer();const io = new Server(server, {  cors: {    origin: '*',    methods: ['GET', 'POST']  }});

io.on('connection', (socket) => {  console.log(`उपयोगकर्ता कनेक्ट हुआ: ${socket.id}`);

  // रूम में शामिल होना  socket.on('join_room', (room: string) => {    socket.join(room);    console.log(`Socket ${socket.id} रूम ${room} में शामिल हुआ`);  });

  // उपयोगकर्ता इवेंट को संभालना  socket.on('chat_message', (data: { room: string; message: string }) => {    // भेजने वाले को छोड़कर रूम में सभी को संदेश भेजना    socket.to(data.room).emit('chat_message', {      userId: socket.id,      message: data.message    });  });

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

server.listen(3000, () => {  console.log('Socket.IO सर्वर पोर्ट 3000 पर शुरू हुआ');});

Socket.IO के साथ TypeScript पर क्लाइंट

import { io, Socket } from 'socket.io-client';

const socket: Socket = io('http://localhost:3000');

socket.on('connect', () => {  console.log('सर्वर से कनेक्ट हुआ');

  // रूम में शामिल होना  socket.emit('join_room', 'room_1');});

socket.on('chat_message', (data: { us