लॉन्ग पोलिंग बनाम वेबसॉकेट: रियल-टाइम के लिए क्या चुनें?

जावास्क्रिप्ट में लॉन्ग पोलिंग बनाम वेबसॉकेट: रियल-टाइम के लिए महाकाव्य लड़ाई

एक समय था, जब इंटरनेट धीमा था और ब्राउज़र सरल थे, सर्वर पर नया डेटा आने का पता लगाने का एकमात्र तरीका F5 दबाना था। फिर AJAX आया, और हमने सर्वर को मैन्युअल रूप से खींचना सीखा। लेकिन क्या होगा अगर डेटा हमारी भागीदारी के बिना, अपने आप आना चाहिए? रियल-टाइम संचार की दुनिया में आपका स्वागत है।

इस लेख में, हम दो मुख्य दृष्टिकोणों पर चर्चा करेंगे जो अभी भी डेवलपर समुदाय को विभाजित करते हैं: पुराना और भरोसेमंद लॉन्ग पोलिंग और आधुनिक, साहसी वेबसॉकेट। हम जावास्क्रिप्ट में कोड लिखेंगे, उनके आंतरिक कामकाज को देखेंगे और समझेंगे कि आपके अगले प्रोजेक्ट के लिए कौन सा उपकरण चुनना है। यदि आप लॉन्ग पोलिंग बनाम वेबसॉकेट को हमेशा के लिए समझना चाहते हैं, तो आप सही जगह पर हैं।

समस्या: सर्वर को पहले बोलने के लिए कैसे मजबूर करें?

HTTP एक एकदिशीय प्रोटोकॉल है। क्लाइंट (ब्राउज़र) अनुरोध भेजता है, सर्वर जवाब देता है - और बस, बात खत्म। लेकिन वास्तविक दुनिया में (चैट, शेयर बाजार के उद्धरण, सूचनाएं) डेटा को विपरीत दिशा में बहना चाहिए। लंबे समय तक, डेवलपर्स ने तरकीबें निकालीं। और यहाँ इस समस्या को हल करने के दो मुख्य तरीके हैं।

लॉन्ग पोलिंग: समय के साथ एक चालाक चाल

कल्पना करें कि आप ग्राहक सहायता को कॉल करते हैं और कहते हैं: "मैं लाइन पर प्रतीक्षा करूंगा जब तक ऑपरेटर खाली न हो जाए।" आप फोन नहीं रखते। ठीक इसी तरह लॉन्ग पोलिंग काम करता है (जिसे "लंबा पोल" भी कहा जाता है)।

यह कैसे काम करता है:

\n
• क्लाइंट एक सामान्य HTTP अनुरोध भेजता है।
\n
• यदि डेटा नहीं है तो सर्वर तुरंत जवाब नहीं देता। वह "लटका" रहता है और प्रतीक्षा करता है।
\n
• जैसे ही डेटा आता है - सर्वर जवाब भेजता है।
\n
• क्लाइंट जवाब को संसाधित करता है और तुरंत एक नया कनेक्शन खोलता है।
\n

क्लाइंट पर कोड (जावास्क्रिप्ट):

function longPoll() {\n  fetch('/updates')\n    .then(response => response.json())\n    .then(data => {\n      console.log('नया डेटा:', data);\n      // तुरंत एक नया पोल शुरू करें\n      longPoll();\n    })\n    .catch(error => {\n      console.error('त्रुटि, 2 सेकंड में पुनः कनेक्ट हो रहा है:', error);\n      setTimeout(longPoll, 2000);\n    });\n}\n\n// शुरू करें\nlongPoll();

लाभ:

\n
• किसी भी सर्वर और किसी भी ब्राउज़र पर काम करता है (IE6 पर भी)।
\n
• विशेष प्रोटोकॉल की आवश्यकता नहीं है - शुद्ध HTTP।
\n
• किसी भी कॉर्पोरेट प्रॉक्सी और फ़ायरवॉल से गुज़रता है।
\n

नुकसान:

\n
• प्रत्येक संदेश एक नया HTTP अनुरोध है (हेडर, कुकीज़, ओवरहेड)।
\n
• सर्वर कई खुले कनेक्शन रखता है (C10k समस्या - 10 हजार क्लाइंट)।
\n
• विलंबता (latency) वेबसॉकेट से अधिक है।
\n

वेबसॉकेट: स्थायी संचार चैनल

वेबसॉकेट एक अंतरिक्ष यान और नियंत्रण केंद्र के बीच एक खुली लाइन की तरह है। आप एक बार कनेक्शन स्थापित करते हैं, और फिर दोनों पक्ष बिना किसी अनावश्यक औपचारिकता के किसी भी समय डेटा भेज सकते हैं।

यह कैसे काम करता है:

\n
• क्लाइंट HTTP के माध्यम से हैंडशेक (हाथ मिलाना) शुरू करता है।
\n
• सर्वर प्रोटोकॉल को ws:// या wss:// पर स्विच करता है।
\n
• एक स्थायी द्विदिश कनेक्शन स्थापित होता है।
\n
• डेटा फ्रेम में प्रेषित होता है - हल्का और तेज़।
\n

क्लाइंट पर कोड (जावास्क्रिप्ट):

const socket = new WebSocket('wss://example.com/chat');\n\n// जब कनेक्शन खुला हो\nsocket.onopen = function() {\n  console.log('कनेक्शन स्थापित');\n  socket.send(JSON.stringify({ type: 'greeting', text: 'नमस्ते, सर्वर!' }));\n};\n\n// जब संदेश आया\nsocket.onmessage = function(event) {\n  const data = JSON.parse(event.data);\n  console.log('सर्वर से संदेश:', data);\n};\n\n// त्रुटि पर\nsocket.onerror = function(error) {\n  console.error('वेबसॉकेट त्रुटि:', error);\n};\n\n// बंद होने पर\nsocket.onclose = function(event) {\n  console.log('कनेक्शन बंद। कोड:', even