banner
htmldersleri
Ana SayfaANA SAYFA Dersler | Örnekler | Forum | Sıkça Sorulan Sorular |Hakkında
HTML Temel
HTML Giriş
HTML Elementler
HTML Etiketler
HTML Parametreler
HTML Biçimlendirme
HTML Özeller
HTML Bağlantılar
HTML Çerçeveler
HTML Tablolar
HTML Listeleme
HTML Formlar
HTML Resimler
HTML Arka Plan
HTML Renkler
HTML Renk Değerleri
HTML Renk İsimleri
HTML Hızlı Liste

HTML5 Ana Menü
HTML5 Giriş
HTML5 Anlamlandırma
HTML5 Giriş Tipleri
HTML5 Form Elementleri
HTML5 Form Özellikleri
HTML5 Canvas
HTML5 SVG
HTML5 Video
HTML5 Audio
HTML5 Konum
HTML5 Sürükle/Bırak
HTML5 Web Depolama
HTML5 Uygulama Bellekleme
HTML5 Web Çalışanı
HTML5 SSE

HTML Gelişmiş
HTML Tasarım
HTML Fontlar
HTML Stiller
HTML Başlık
HTML Meta
HTML URL
HTML Scriptler
HTML Std. Nitelikler
HTML Olaylar
HTML ASCII
HTML Web Sunucu

HTML Örnekler/Test
HTML Örnekler
HTML Örnek Site
HTML Test

HTML5 Server-Sent İşlemleri

Önceki Sonraki

HTML5 SSE bir web sayfasının sunucudan güncellemeler almasını sağlar.


Server-Sent İşlemleri - Tek Yönlü Mesaj Gönderme

Bir Server Sent işlemi, bir web sayfası otomatik olarak sunucudan güncelleme alınca gerçekleşir.

Bu öncenden de mümkündü ancak web sayfası herhangi bir güncelleme olup olmadığını sormak zorundaydı. SSE ile güncellemeler otomatik olarak yüklenir.

Örnek: Facebook/Twitter güncellemeleri, yeni haber uyarıları, maç sonuçları vs.


Tarayıcı Desteği

Internet Explorer Firefox Opera Google Chrome Safari



SSE Bildirimlerini Almak

EventSource nesnesi sunucu bildirimlerini almak için kullanılmıştır:

Örnek

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

Kendin Dene »

Örneğin açıklaması:

  • Yeni bir EventSource nesnesi oluştur ve güncellemeler için gerekli sayfanın URL'sini belirt.(Bu örnekte "demo_sse.php")
  • Her güncelleme alındığında onmessage event'i (olayı) meydana gelir
  • Bir onmessage olayı meydana geldiğinde, alınan veriyi id="result" ile elementin içine koy

Server-Side (Sunucu Tarafı) Kodu Örneği

Yukarıdaki örneğin çalışması için, veri güncellemeleri gönderebilen bir sunucuya ihtiyacınız vardır (PHP ya da ASP gibi)

PHP Kodu (demo_sse.php):

<?php
header('Content-Type: text/event-stream');
header('Cache-Control: no-cache');

$time = date('r');
echo "data: Sunucu saati: {$time}\n\n";
flush();
?>

ASP Kodu(demo_sse.asp):

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

Kodun açıklaması:

  • "Content-Type"ı başlık olarak "text/event-stream"e ayarla
  • Sayfanın ön bellek yapmayacağını belirt.
  • Sonucu hazırla (Her zaman "data: " ile başla)
  • Çıkış bilgisini web sayfasına gönder

EventSource Nesnesi

Yukarıdaki örneklerde mesajları alabilmek için onmessage event'ini kullandık. Ama başka event'lar da vardır:

Olay (Events) Açıklama
onopen Sunucuya bir bağlantı açıldığında
onmessage Bir mesaj alındığında
onerror Bir hata oluştuğunda

Önceki Sonraki

Dersler | Örnekler | Forum | Sıkça Sorulan Sorular |Hakkında
Copyright © 2008 | Tüm Hakları Saklıdır. | Webmaster: destek@htmldersleri.org

79 kişi şuan sayfamızda geziniyor.

English Deutsch Français Español Dutch Italiano Português Български
html dersleri
Dersler Örnekler Online Test