Server-Sent Events memungkinkan sebuah halaman web untuk mendapatkan update dari server.
Server-Sent Events - One Way Messaging
Sebuah peristiwa server dikirim adalah ketika sebuah halaman web secara otomatis mendapatkan update dari server.
Hal ini juga mungkin sebelumnya, tetapi halaman web harus bertanya jika ada update yang tersedia. Dengan event server-dikirim, update datang secara otomatis.
Contoh: Facebook/Twitter update, update harga saham, feed berita, hasil olahraga, dll
Dukungan Browser
Angka-angka dalam tabel menentukan versi browser pertama yang mendukung penuh event server-dikirim.
| API | |||||
|---|---|---|---|---|---|
| SSE | 6.0 | Tidak didukung | 6.0 | 5.0 | 11,5 |
Menerima Server-Sent Pemberitahuan Kegiatan
The EventSource objek digunakan untuk menerima pemberitahuan acara server dikirim:
Contoh
var source = new EventSource("demo_sse.php");
source.onmessage = function(event) {
document.getElementById("result").innerHTML += event.data + "<br>";
}; Cobalah sendiri " Contoh menjelaskan:
- Buat baru EventSource objek, dan menentukan URL dari halaman mengirimkan update (in this example "demo_sse.php")
- Setiap kali update diterima, onmessage peristiwa terjadi
- Ketika onmessage peristiwa terjadi, menempatkan data yang diterima ke dalam elemen dengan id="result"
Periksa Server-Sent Events Dukungan
Dalam tryit contoh di atas ada beberapa baris tambahan kode untuk memeriksa dukungan browser untuk acara server dikirim:
if(typeof(EventSource) !== "undefined") {
// Yes! Server-sent events support!
// Some code.....
} else {
// Sorry! No server-sent events support..
}
Server-Side Kode Contoh
Untuk contoh di atas untuk bekerja, Anda memerlukan server mampu mengirim update data (seperti PHP atau ASP).
Server-side sintaks streaming acara sederhana. Mengatur "Content-Type" header "text/event-stream" . Sekarang Anda dapat mulai mengirim aliran acara.
Kode 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();
?>
Kode di ASP (VB) (demo_sse.asp) :
<%
Response.ContentType = "text/event-stream"
Response.Expires = -1
Response.Write("data: The server time is: " & now())
Response.Flush()
%>
Kode menjelaskan:
- Mengatur "Content-Type" header "text/event-stream"
- Menentukan bahwa halaman tidak harus cache
- Output data untuk mengirim ( Always start with "data: ")
- Menyiram output data kembali ke halaman web
The EventSource Obyek
Dalam contoh di atas kita menggunakan event onmessage untuk mendapatkan pesan. Tapi peristiwa lain juga tersedia:
| Acara | Deskripsi |
|---|---|
| onopen | Ketika koneksi ke server dibuka |
| onmessage | Ketika pesan diterima |
| onerror | Ketika terjadi kesalahan |