Sunucu Tarafından Gönderilen Etkinlikler (SSE), bir web sayfasının bir sunucudan güncelleme almasına olanak tanır.
Server-Sent Events – Tek Yönlü Mesajlaşma
Sunucu tarafından gönderilen olay, bir web sayfasının güncellemeleri bir sunucudan otomatik olarak almasıdır.
Bu daha önce de mümkündü ancak web sayfasının herhangi bir güncelleme olup olmadığını sorması gerekiyordu. Sunucu tarafından gönderilen etkinliklerde güncellemeler otomatik olarak gelir.
Örnekler: Facebook/Twitter güncellemeleri, hisse senedi fiyatı güncellemeleri, haber akışları, spor sonuçları vb.
Tarayıcı Desteği
Sunucu Tarafından Gönderilen Bildirimleri Alma (Event Notifications)
EventSource nesnesi, sunucu tarafından gönderilen olay bildirimlerini almak için kullanılır:
<!DOCTYPE html>
<html>
<body>
<div id="result"></div>
<script>
if(typeof(EventSource) !== "undefined") {
var source = new EventSource("demo_sse.php");
source.onmessage = function(event) {
document.getElementById("result").innerHTML += event.data + "<br>";
};
} else {
document.getElementById("result").innerHTML = "Tarayıcı Desteklemiyor.";
}
</script>
</body>
</html>
Örnek Açıklaması
- Yeni bir EventSource nesnesi oluşturun ve güncellemeleri gönderen sayfanın URL’sini belirtin (bu örnekte “demo_sse.php”)
- Her güncelleme alındığında, onmessage olayı meydana gelir
- Bir onmessage olayı meydana geldiğinde, alınan verileri id = “result” olan öğeye yazdırılır
Sunucu Tarafından Gönderilen Olaylar Desteğini Kontrol Etme
Yukarıdaki örnekte, sunucu tarafından gönderilen olaylar için tarayıcı desteğini kontrol etmeye yönelik bazı ekstra kod satırları vardı:
if(typeof(EventSource) !== "undefined") {
// Destekliyor!
// Kodlar.....
} else {
// Desteklemiyor..
}
Sunucu Tarafı Kod Örneği
Yukarıdaki örneğin çalışması için, veri güncellemeleri gönderebilen bir sunucuya (PHP veya ASP gibi) ihtiyacınız vardır.
Sunucu tarafı olay akışı sözdizimi basittir. “Content-Type” başlığını “text/event-stream” olarak ayarlayın. Artık etkinlik akışlarını göndermeye başlayabilirsiniz.
PHP’deki kod (demo_sse.php):
<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');
$time = date('r');
echo "Sunucu Saati : {$time}\n\n";
flush();
?>
ASP tarafında örnek kod (demo_sse.asp)
<%
Response.ContentType = "text/event-stream"
Response.Expires = -1
Response.Write("Sunucu Saati: " & now())
Response.Flush()
%>
Kod Açıklaması
- “Content-Type” başlığını “text/event-stream” olarak ayarlayın
- Sayfanın önbelleğe alınmaması gerektiğini belirtin
- Gönderilecek verinin çıktısını alın (Her zaman “data:” ile başlayın)
- Çıkış verilerini web sayfasına geri aktarın
EventSource Nesnesi
Yukarıdaki örneklerde mesajları almak için onmessage olayını kullandık. Ancak başka etkinlikler de mevcuttur:
Event | Açıklama |
onopen | Sunucuyla bağlantı açıldığında |
onmessage | Bir mesaj alındığında |
onerror | Bir hata oluştuğunda |