Vom HTML 5-Server gesendete Ereignisse

Server-Sent-Ereignis – unidirektionale Nachrichtenübermittlung

Das Server-Sent-Ereignis bezieht sich darauf, dass die Webseite automatisch Aktualisierungen vom Server erhält.

Dies war früher auch möglich, wenn die Webseite nachfragen musste, ob ein Update verfügbar war. Durch das Senden von Ereignissen über den Server können Updates automatisch eintreffen.

Beispiele: Facebook-/Twitter-Updates, Bewertungsaktualisierungen, neue Blogbeiträge, Veranstaltungsergebnisse usw.

Browser-Unterstützung

Vom Server gesendete Ereignisse werden von allen gängigen Browsern außer Internet Explorer unterstützt.

Vom Server gesendete Ereignisbenachrichtigung empfangen

Das EventSource-Objekt wird zum Empfangen der vom Server gesendeten Ereignisbenachrichtigung verwendet:

Instanz

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

Erläuterung des Beispiels :

Erstellen Sie ein neues EventSource-Objekt und geben Sie dann die URL der Seite an, an die das Update gesendet werden soll (in diesem Fall „demo_sse.php“).

Jedes Mal, wenn ein Update empfangen wird, wird die Das onmessage-Ereignis tritt ein

Wenn das onmessage-Ereignis auftritt, übertragen Sie die empfangenen Daten in das Element mit der ID „result“

Unterstützung für vom Server gesendete Ereignisse erkennen

Im Obigen TIY-Beispiel schreiben wir einen zusätzlichen Code, um die Browserunterstützung für vom Server gesendete Ereignisse zu erkennen:

if(typeof(EventSource)!=="undefined") { // Yes! Server-sent events support! // Some code..... } else { // Sorry! No server-sent events support.. }

Serverseitiges Codebeispiel

Damit das obige Beispiel funktioniert, müssen Sie Sie müssen außerdem in der Lage sein, Datenaktualisierungen an Server (z. B. PHP und ASP) zu senden.

Die Syntax des serverseitigen Event-Streamings ist sehr einfach. Setzen Sie den Header „Content-Type“ auf „text/event-stream“. Jetzt können Sie mit dem Senden des Event-Streams beginnen.

PHP-Code (demo_sse.php):

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

ASP-Code (VB) (demo_sse.asp):

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

Code-Erklärung:

Setzen Sie den Header „Content-Type“ auf „text/event-stream“

Geben Sie an, dass die Seite nicht zwischengespeichert wird

Geben Sie das Sendedatum aus (beginnend immer mit „data:“)

Ausgabedaten auf der Webseite aktualisieren

EventSource-Objekt

Im obigen Beispiel verwenden wir das Ereignis onmessage, um die Nachricht abzurufen. Es können jedoch auch andere Ereignisse verwendet werden:

Event

Description

onopen Wenn die Verbindung zum Server geöffnet wird

onmessage Wenn eine Nachricht empfangen wird

onerror Wenn ein Fehler auftritt

Das Obige ist der Inhalt des vom HTML 5-Server gesendeten Ereignisses. Weitere verwandte Inhalte finden Sie hier Achten Sie auf die chinesische PHP-Website (m.sbmmt.com)!