html5 - HTML5 Server sent events - Udvikleren.dk - Programmering, webdesign og grafik

Tags: html5 sse

Bruger #16838 @ 29.03.13 14:00

Hej. Jeg sidder her og kigger lidt på HTML SSE # http://www.w3schools.com/html/html5_serversentevents.asp

Og så tænker jeg lidt, hvad er det her for noget?
For mig der ligner det bare at det er en slags ajax request der kører hvert 3 sec.

Er dét det? For så kan jeg nemlig ikke se nogle grund til at eksperimentere i det.

9 svar postet i denne tråd vises herunder
4 indlæg har modtaget i alt 4 karma

Sorter efter stemmer Sorter efter dato

Bruger #11328 @ 29.03.13 16:24

1.323

Endnu en grund til ikke at stole på noget fra W3Schools

Server-sent events gør det muligt for serveren at sende beskeder (events) til klienten, uden (og dette er den store forskel), at klienten har bedt om det. I normal klient-server kommunikation, er det altid klienten der sender en forespørgsel til serveren, og serveren svarer herefter på denne request. Med server-sent events, er det muligt for serveren at "pushe" beskeder til klienten. Dette er enormt brugbart i fx chat-klienter, og andre real-time kommunikationssituationer.

AJAX requests er initialiseret af klienten, SSE af serveren.

Bruger #16075 @ 29.03.13 17:33

1.223

prøvede lige deres eks

test.html

Kode

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
	<title></title>
	<style type="text/css">
	</style>
	<script type="text/javascript">
	</script>
</head>
<body>
<div id ="result"></div>

<script type="text/javascript">
var source=new EventSource("demo_sse.php");
	source.onmessage=function(event) {
		document.getElementById("result").innerHTML+=event.data + "<br>";
	};
</script>
</body>
</html>

demo_sse.php

Kode

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

og det virker i FF, men lig mærke til det virker ikke i IE, så hvor smart er det ??

Bruger #16075 @ 29.03.13 18:10

1.223

har ikke selv rodet med SSE før så her er nogle link jeg lige skal kigge på
http://stackoverflow.com/questions/9915358/how-to-update-clients-schedule-using-html5-server-sent-events
http://stackoverflow.com/questions/9070995/html5-server-sent-events-prototyping-ambiguous-error-and-repeated-polling
http://dev.w3.org/html5/eventsource/

ref http://www.html5rocks.com/en/tutorials/eventsource/basics/

Controlling the Reconnection-timeout
The browser attempts to reconnect to the source roughly 3 seconds after each connection is closed. You can change that timeout by including a line beginning with "retry:", followed by the number of milliseconds to wait before trying to reconnect.
The following example attempts a reconnect after 10 seconds:
retry: 10000\n
data: hello world\n\n

ref https://developer.mozilla.org/en-US/docs/Server-sent_events/Using_server-sent_events

Event stream format
The event stream is a simple stream of text data, which must be encoded using UTF-8. Each message is separated by a pair of newline characters. A colon as the first character of a line is, in essence, a comment, and is ignored.

men dette er nøglen
header("Content-Type: text/event-stream\n\n");

men der er også grænser for hvorlænge den vil genoptage fobindelsen

Bruger #11328 @ 30.03.13 10:54

1.323

Ronny, du har ret i at IE har en stor markedsandel, og at man i mange tilfælde er nød til at respektere det, men hvis dine læsere fx hovedsagligt er tech-folk, kan man formentlig forvente at de fleste benytter en anden browser end IE. Yderligere: Jo flere der leger med de nye API's og laver spændende ting, jo mere presset bliver folkene bag IE til at implementere det!

Bruger #16838 @ 29.03.13 17:10

169

De bruger det eksempel her:

PHP kode

 header('Content-Type: text/event-stream');
 header('Cache-Control: no-cache');
 
 $time = date('r');
 echo "data: The server time is: {$time}\n\n";
 flush();

Kan ikke lige finde ud af hvordan den sender noget som helts.

Bruger #16838 @ 29.03.13 17:45

169

Ja, hvordan kan php filen få source.onmessage til at kører.
Forstår jeg altså ikke.

Bruger #16838 @ 29.03.13 19:54

169

Tusind tak, gode artikler du har fundet

Bruger #17081 @ 29.03.13 20:38

1.258

prøvede lige deres eks

test.html

Kode

<!DOCTYPE html>
<html>
<head>
 <meta charset="utf-8">
	<title></title>
	<style type="text/css">
	</style>
	<script type="text/javascript">
	</script>
</head>
<body>
<div id ="result"></div>

<script type="text/javascript">
var source=new EventSource("demo_sse.php");
	source.onmessage=function(event) {
		document.getElementById("result").innerHTML+=event.data + "<br>";
	};
</script>
</body>
</html>

demo_sse.php

Kode

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

og det virker i FF, men lig mærke til det virker ikke i IE, så hvor smart er det ??

Der er jo intet der virker i IE

Bruger #16075 @ 30.03.13 01:26

1.223

nej IE er på en del punkter fodslæbende, og andre punkter først med det nye, som de mener skal være std.
ordet std kan skifte fra vertion til vertion af IE. Der er std og så er der M$
men vi er desværre nød til at tage hensyn til de 43% (IE8,9,10)* der anvender IE
* http://fdim.dk/statistik/teknik/browserbarometer

HTML5 Server sent events

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler