Jassif Team Institution

HTML Server-Sent Events API

Server-Sent Events (SSE) API HTTP இணைப்பு மூலம் சர்வரிலிருந்து வலைப்பக்கத்திற்கு செய்திகள்/புதுப்பிப்புகளை தள்ள அனுமதிக்கிறது.

சர்வர்-அனுப்பிய நிகழ்வுகள் - ஒரு வழி செய்தியனுப்புதல்

ஒரு சர்வர்-அனுப்பிய நிகழ்வு என்பது ஒரு வலைப்பக்கம் சர்வரிலிருந்து தானாகவே செய்திகள்/புதுப்பிப்புகளைப் பெறும் போது ஆகும்.

பொதுவாக, ஒரு வலைப்பக்கம் சர்வரிலிருந்து தரவைக் கோர வேண்டும், ஆனால் சர்வர்-அனுப்பிய நிகழ்வுகளுடன், புதுப்பிப்புகள் தானாகவே தள்ளப்படுகின்றன.

எடுத்துக்காட்டுகள்: Facebook/Twitter புதுப்பிப்புகள், பங்குச் சந்தை புதுப்பிப்புகள், செய்தி ஊட்டங்கள், விளையாட்டு முடிவுகள் போன்றவை.

உலாவி ஆதரவு

அட்டவணையில் உள்ள எண்கள் சர்வர்-அனுப்பிய நிகழ்வுகள் API ஐ முழுமையாக ஆதரிக்கும் முதல் உலாவி பதிப்பைக் குறிக்கின்றன.

சர்வர்-அனுப்பிய நிகழ்வு அறிவிப்புகளைப் பெறுதல்

EventSource பொருள் சர்வர்-அனுப்பிய நிகழ்வு அறிவிப்புகளைப் பெற பயன்படுகிறது:

<script>
const x = document.getElementById("result");
// உலாவி SSE ஆதரவை சரிபார்க்கவும்
if(typeof(EventSource) !== "undefined") {
  var source = new EventSource("demo_sse.php");
  source.onmessage = function(event) {
    x.innerHTML += event.data + "<br>";
  };
} else {
  x.innerHTML = "Sorry, no support for server-sent events.";
}
</script>

எடுத்துக்காட்டு விளக்கம்:

1. ஒரு புதிய EventSource பொருளை உருவாக்கி, புதுப்பிப்புகளை அனுப்பும் பக்கத்தின் URL ஐக் குறிப்பிடவும் (இந்த எடுத்துக்காட்டில் "demo_sse.php")
2. ஒரு புதுப்பிப்பு பெறப்படும் ஒவ்வொரு முறையும், onmessage நிகழ்வு ஏற்படுகிறது
3. onmessage நிகழ்வு ஏற்படும் போது, பெறப்பட்ட தரவை id="result" உள்ள உறுப்பில் வைக்கவும்

உலாவி ஆதரவை சரிபார்க்கவும்

மேலே உள்ள எடுத்துக்காட்டில் சர்வர்-அனுப்பிய நிகழ்வுகளுக்கான உலாவி ஆதரவைச் சரிபார்க்க சில கூடுதல் குறியீட்டு வரிகள் இருந்தன:

if(typeof(EventSource) !== "undefined") {
  // ஆம்! சர்வர்-அனுப்பிய நிகழ்வுகள் ஆதரவு!
  // சில குறியீடு.....
} else {
  // மன்னிக்கவும்! சர்வர்-அனுப்பிய நிகழ்வுகள் ஆதரவு இல்லை..
}

சர்வர்-பக்க குறியீடு எடுத்துக்காட்டு

மேலே உள்ள எடுத்துக்காட்டு வேலை செய்ய, நீங்கள் தரவு புதுப்பிப்புகளை அனுப்பக்கூடிய சர்வர் தேவை (PHP அல்லது ASP போன்றவை).

சர்வர்-பக்க நிகழ்வு ஸ்ட்ரீம் தொடரியல் எளிமையானது. "Content-Type" தலைப்பை "text/event-stream" ஆக அமைக்கவும். இப்போது நீங்கள் நிகழ்வு ஸ்ட்ரீம்களை அனுப்பத் தொடங்கலாம்.

<?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();
?>

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

குறியீடு விளக்கம்:

1. "Content-Type" தலைப்பை "text/event-stream" ஆக அமைக்கவும்
2. பக்கம் கேச் செய்யக்கூடாது என்பதைக் குறிப்பிடவும்
3. அனுப்ப வேண்டிய தரவை வெளியிடவும் (எப்போதும் "data: " உடன் தொடங்கவும்)
4. வெளியீட்டு தரவை வலைப்பக்கத்திற்குத் தள்ளவும்

EventSource பொருள்

மேலே உள்ள எடுத்துக்காட்டுகளில் செய்திகளைப் பெற onmessage நிகழ்வைப் பயன்படுத்தினோம். ஆனால் பிற நிகழ்வுகளும் கிடைக்கின்றன:

SSE vs AJAX Polling

ஊடாடும் நடைமுறை

பயிற்சி