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 وقتی خطا پیش آئی