HTML Server-Sent इवेंट

Server-Sent इवेंट वेब पृष्ठ को सर्वर से अपडेट प्राप्त करने की अनुमति देता है。

Server-Sent इवेंट - एक दिशा का मैसेजिंग

Server-Sent इवेंट वेब पृष्ठ को स्वचालित रूप से सर्वर से अपडेट प्राप्त करने के लिए है।

इसे पहले भी कर सकते थे, परंतु इसके लिए वेब पृष्ठ को अपडेट के लिए पूछना पड़ता था। Server-Sent इवेंट के माध्यम से, अपडेट स्वचालित रूप से पहुँचते हैं。

उदाहरण के तौर पर: Facebook/Twitter अपडेट, शेयर कीमत अपडेट, नए ब्लॉग पोस्ट, प्रतियोगिता परिणाम, आदि

ब्राउज़र समर्थन

तालिका में दिए गए नंबर सबसे पहले server-sent इवेंट का पूर्ण समर्थन करने वाले ब्राउज़र को संकेत करते हैं。

API
SSE 6.0 नहीं समर्थित 6.0 5.0 11.5

Server-Sent इवेंट अधिसूचना प्राप्त करना

EventSource ऑब्जैक्ट सर्वर सेंड इवेंट अधिसूचना को प्राप्त करने के लिए प्रयोग किया जाता है:

उदाहरण

var source = new EventSource("demo_sse.php");
source.onmessage = function(event) {
    document.getElementById("result").innerHTML += event.data + "<br>";
};

अपने आप सिर्फ प्रयोग कीजिए

उदाहरण व्याख्या:

  • नए EventSource ऑब्जैक्ट को बनाएं, फिर अपडेट भेजने वाले पृष्ठ की URL (इस उदाहरण में "demo_sse.php") निर्दिष्ट करें
  • प्रत्येक अपडेट प्राप्त होने पर, onmessage इवेंट होता है
  • onmessage इवेंट होने पर, प्राप्त डाटा को id "result" के एलीमेंट में डाल दिया जाता है

Server-Sent 事件 समर्थन जांच

TIY उदाहरण में, हमने एक अतिरिक्त कोड लिखा है कि सर्वर सेंड इवेंट के ब्राउज़र समर्थन को जांच करे:

if(typeof(EventSource) !== "undefined") {
    // हाँ! सर्वर सेंड इवेंट का समर्थन है!
    // कुछ कोड.....
}
    // माफ करें! सर्वर सेंड इवेंट का समर्थन नहीं है!
}

सर्वर एण्डर स्क्रिप्ट उदाहरण

किसी प्रयोग के लिए चलाने के लिए, आपको डाटा अपडेट के लिए सर्वर भेजने की क्षमता होनी चाहिए (जैसे PHP या ASP)।

सर्वर ओवर इवेंट स्ट्रीम की व्याकरण बहुत सरल है।"Content-Type" सर्विस सेट करें "text/event-stream"।अब, आप संघटक स्ट्रीम भेजने का शुरू कर सकते हैं।

PHP में कोड (demo_sse.php)：

<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');
$time = date('r');
echo "data: The server time is: {$time}\n\n";
flush();
?>

ASP में कोड (VB) (demo_sse.asp)：

<%
Response.ContentType = "text/event-stream"
Response.Expires = -1
Response.Write("data: The server time is: " & now())
Response.Flush()
%>

कोड व्याख्या:

  • सर्विस से "Content-Type" सर्विस सेट करें "text/event-stream"
  • पृष्ठ को कैशेज नहीं करने का प्रावधान करें
  • सेंड करने वाले डेटा को निर्धारित करें (हमेशा "data: " से शुरू होना चाहिए)
  • पृष्ठ को ताज़ा करने के लिए डाटा आउटपुट

EventSource ऑब्जैक्ट

उपरोक्त उदाहरण में, हमने onmessage इवेंट का उपयोग किया है ताकि संदेश प्राप्त करें।लेकिन अन्य इवेंटों का उपयोग भी किया जा सकता है:

इवेंट वर्णन
onopen जब सर्वर के साथ कनेक्शन खुला
onmessage जब संदेश मिला
onerror जब त्रुटि होती है