एसएसई (सर्वर सेंट इवेंट्स) का वेब विकास की दुनिया में व्यापक रूप से उपयोग नहीं किया जाता है, यह लेख एसएसई क्या है, यह कैसे काम करता है, और यह कैसे लाभ पहुंचा सकता है, इस पर गहराई से चर्चा करेगा। आपकी एप्लिकेशन।

एसएसई क्या है?

एसएसई HTTP कनेक्शन पर सर्वर से क्लाइंट को रीयल-टाइम अपडेट भेजने का एक सरल और कुशल तरीका है। यह HTML5 विनिर्देश का एक हिस्सा है और सभी आधुनिक वेब ब्राउज़र द्वारा समर्थित है। एसएसई एक यूनिडायरेक्शनल डेटा प्रवाह पर आधारित है, जहां सर्वर क्लाइंट को संदेश भेजता है, लेकिन क्लाइंट सर्वर को संदेश वापस नहीं भेज सकता है।

एसएसई क्लाइंट को डेटा भेजने के लिए एक टेक्स्ट-आधारित प्रारूप का उपयोग करता है जिसे "सर्वर-भेजे गए इवेंट" के रूप में जाना जाता है। डेटा को घटनाओं की एक श्रृंखला के रूप में भेजा जाता है, जिनमें से प्रत्येक में एक संदेश और एक वैकल्पिक ईवेंट प्रकार होता है। इवेंट प्रकार का उपयोग विभिन्न प्रकार के संदेशों के बीच अंतर करने के लिए किया जाता है और क्लाइंट को उन्हें अलग तरीके से संभालने की अनुमति देता है।

एसएसई कैसे काम करता है?

एसएसई प्रोटोकॉल सर्वर और क्लाइंट के बीच एक सतत HTTP कनेक्शन स्थापित करके काम करता है। यह कनेक्शन तब तक खुला रखा जाता है जब तक क्लाइंट सर्वर से अपडेट प्राप्त करना चाहता है। जब सर्वर के पास भेजने के लिए नया डेटा होता है, तो यह एक विशेष MIME प्रकार "टेक्स्ट/इवेंट-स्ट्रीम" के साथ एक HTTP प्रतिक्रिया भेजता है।

प्रतिक्रिया में घटनाओं की एक श्रृंखला शामिल है, जिनमें से प्रत्येक को एक नए पंक्ति वर्ण ("\n") द्वारा अलग किया गया है। प्रत्येक ईवेंट का प्रारूप निम्न है:

event: [event type]\n
data: [message]\n\n

"ईवेंट" फ़ील्ड वैकल्पिक है और इसका उपयोग ईवेंट के लिए एक नाम प्रदान करने के लिए किया जाता है। "डेटा" फ़ील्ड में भेजा जा रहा वास्तविक संदेश शामिल होता है। प्रत्येक ईवेंट के अंत में दो न्यूलाइन वर्णों का उपयोग ईवेंट के अंत का संकेत देने के लिए किया जाता है।

यहां एक सरल एसएसई प्रतिक्रिया का एक उदाहरण दिया गया है:

HTTP/1.1 200 OK
Content-Type: text/event-stream

event: message
data: Hello, world!

event: message
data: This is a test message.

event: customEvent
data: {"foo": "bar", "baz": 123}

इस उदाहरण में, हम क्लाइंट को तीन इवेंट भेज रहे हैं। पहले दो इवेंट में इवेंट प्रकार "संदेश" होता है और इसमें सरल टेक्स्ट संदेश होते हैं। तीसरे इवेंट में इवेंट प्रकार "customEvent" है और इसमें संदेश के रूप में एक JSON ऑब्जेक्ट शामिल है।

जब क्लाइंट को एसएसई प्रतिक्रिया मिलती है, तो वह अपने यूजर इंटरफेस को अपडेट करने के लिए डेटा का उपयोग करता है। उदाहरण के लिए, DOM में हेरफेर करने के लिए जावास्क्रिप्ट का उपयोग करके ऐसा किया जा सकता है।

एसएसई का कार्यान्वयन

आपके एप्लिकेशन में एसएसई लागू करना अपेक्षाकृत सरल है। Node.js और एक्सप्रेस फ्रेमवर्क का उपयोग करके SSE को कैसे लागू किया जाए इसका एक उदाहरण यहां दिया गया है:

const express = require('express');
const app = express();

// Set up SSE endpoint
app.get('/events', (req, res) => {
  // Set headers
  res.setHeader('Content-Type', 'text/event-stream');
  res.setHeader('Cache-Control', 'no-cache');
  res.setHeader('Connection', 'keep-alive');
  // Send initial event
  res.write('data: Connected\n\n');
  // Set interval to send periodic events
  const intervalId = setInterval(() => {
    res.write('data: Hello, world!\n\n');
  }, 1000);
  // Clean up on connection close
  req.on('close', () => {
    clearInterval(intervalId);
  });
});

// Start server
app.listen(3000, () => {
  console.log('Server started on port 3000');
});

इस उदाहरण में, हम "/इवेंट्स" पर एक एसएसई एंडपॉइंट स्थापित कर रहे हैं। हम एसएसई के लिए आवश्यक हेडर सेट कर रहे हैं और यह पुष्टि करने के लिए क्लाइंट को एक प्रारंभिक ईवेंट भेज रहे हैं कि कनेक्शन स्थापित हो गया है।

फिर हम क्लाइंट को हर सेकंड आवधिक ईवेंट भेजने के लिए एक अंतराल सेट कर रहे हैं। अंत में, हम उस अंतराल को साफ़ कर रहे हैं जब क्लाइंट द्वारा कनेक्शन बंद कर दिया जाता है।

ग्राहक पक्ष पर, हम एसएसई घटनाओं को सुनने के लिए निम्नलिखित जावास्क्रिप्ट कोड का उपयोग कर सकते हैं:

const source = new EventSource('/events');

source.addEventListener('message', (event) => {
  console.log(event.data);
});
source.addEventListener('error', (event) => {
  console.error('Error:', event);
});

इस उदाहरण में, हम एक नया इवेंटसोर्स ऑब्जेक्ट बना रहे हैं और अपने एसएसई एंडपॉइंट के यूआरएल को पास कर रहे हैं। फिर हम "संदेश" ईवेंट सुन रहे हैं और डेटा को कंसोल में लॉग कर रहे हैं। यदि कोई कनेक्शन समस्या है तो हम "त्रुटि" घटना के बारे में भी सुन रहे हैं।

ध्यान दें कि फ्रंट एंड पर इवेंटसोर्स पथ का उपयोग केवल GET अनुरोधों द्वारा किया जा सकता है, यदि आप POST और अन्य HTTP विधियों का उपयोग करना चाहते हैं, तो आपको प्रतिक्रिया डेटा को स्वयं पार्स करना होगा।

यदि आप मूल Node.js कार्यान्वयन चाहते हैं, तो यहां एक है

एसएसई के लिए मामलों का प्रयोग करें

एसएसई का उपयोग उन अनुप्रयोगों की एक विस्तृत श्रृंखला में किया जा सकता है जिनके लिए वास्तविक समय अपडेट की आवश्यकता होती है। कुछ उदाहरण निम्नलिखित हैं:

• सोशल मीडिया प्लेटफॉर्म: एसएसई का उपयोग सोशल मीडिया प्लेटफॉर्म के लिए वास्तविक समय अपडेट प्रदान करने के लिए किया जा सकता है, जैसे नए संदेशों, टिप्पणियों या पसंद की सूचनाएं।

• वित्तीय अनुप्रयोग: एसएसई का उपयोग वित्तीय अनुप्रयोगों, जैसे स्टॉक की कीमतें, मुद्रा विनिमय दर, या समाचार के लिए वास्तविक समय अपडेट प्रदान करने के लिए किया जा सकता है।

• ऑनलाइन गेमिंग: एसएसई का उपयोग ऑनलाइन गेमिंग अनुप्रयोगों के लिए वास्तविक समय अपडेट प्रदान करने के लिए किया जा सकता है, जैसे गेम इवेंट, स्कोर या रैंकिंग की सूचनाएं।

एसएसई का उपयोग करने के लाभ

पोलिंग या वेबसॉकेट जैसी अन्य वास्तविक समय संचार विधियों की तुलना में एसएसई का उपयोग करने के कई लाभ हैं:

क्षमता

एसएसई एक सतत HTTP कनेक्शन का उपयोग करता है, जिसका अर्थ है कि कनेक्शन स्थापित करने और बनाए रखने का ओवरहेड अन्य तरीकों की तुलना में बहुत कम है। यह एसएसई को अधिक कुशल और कम संसाधन-गहन बनाता है, जो बड़ी संख्या में ग्राहकों के साथ काम करते समय विशेष रूप से महत्वपूर्ण है।

सादगी

एसएसई एक सरल प्रोटोकॉल है जिसे समझना और लागू करना आसान है। इसके लिए किसी विशेष लाइब्रेरी या फ्रेमवर्क की आवश्यकता नहीं है और इसे जावास्क्रिप्ट और HTTP जैसी मानक वेब प्रौद्योगिकियों का उपयोग करके कार्यान्वित किया जा सकता है।

विश्वसनीयता

एसएसई एक विश्वसनीय प्रोटोकॉल है जो नेटवर्क रुकावट के मामले में स्वचालित पुन: कनेक्शन प्रदान करता है। यह सुनिश्चित करता है कि कनेक्शन अस्थायी रूप से खो जाने पर भी क्लाइंट को अपडेट प्राप्त होता रहेगा।

निष्कर्ष

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

यदि आपको यह उपयोगी लगता है, तो कृपया वेब विकास के बारे में अधिक उपयोगी लेखों और उपकरणों के लिए मेरे न्यूज़लेटर की सदस्यता लें पर विचार करें। पढ़ने के लिए धन्यवाद!