SSE-Einführung
SSE steht für Server-Send-Events, was wörtlich bedeutet, dass der Server Informationen an den Client weiterleitet. SSE ist ein Einwegkanal,Der Server kann nur Informationen an den Client sendenDer Client kann die SSE-Anfrage erst nach dem ersten Auslösen erhalten und kann nicht antworten.
Zu den wichtigsten Merkmalen der SSE gehören:
- Benutzerfreundlichkeit: SSE verwendet textbasierte Datenformate wie Klartext, JSON usw., was das Senden und Parsen von Daten relativ einfach macht.
- Einseige-Kommunikation: SSE unterstützt eine Einwegkommunikation zwischen Server und Client, wobei der Server aktiv Daten an den Client senden kann, während der Client nur die Daten empfangen kann.
- Echtzeit: SSE stellt langfristige Verbindungen her und ermöglicht es Servern, Daten in Echtzeit ohne häufige Anfragen an Clients zu senden.
SSE vs. WebSocket
WebSocket ist eine weitere Webtechnologie, die genutzt wird, um Echtzeit-Zwei-Wege-Kommunikation zu ermöglichen, was sich in einigen Punkten von SSE unterscheidet. Hier ist ein Vergleich zwischen SSE und WebSocket:
- Daten-Push-Richtung: SSE ist eine Einwegkommunikation zwischen Server und Client, und der Server kann aktiv Daten an den Client senden. WebSocket hingegen ist bidirektionale Kommunikation und ermöglicht einen Echtzeit-Zwei-Wege-Datenaustausch zwischen Server und Client.
- Verbindungsaufbau: SSE verwendet lange HTTP-basierte Verbindungen, um Verbindungen durch gewöhnliche HTTP-Anfragen und -Antworten herzustellen und somit einen Echtzeit-Datenpush. WebSockets verwenden benutzerdefinierte Protokolle, um eine zweiseitige Kommunikation zu ermöglichen, indem WebSocket-Verbindungen hergestellt werden.
- Kompatibilität: Da SSE auf dem HTTP-Protokoll basiert, kann es in den meisten modernen Browsern verwendet werden und erfordert keine zusätzlichen Protokoll-Upgrades. WebSockets werden ebenfalls in der überwiegenden Mehrheit moderner Browser unterstützt, können aber in einigen speziellen Netzwerkumgebungen problematisch sein.
- Anwendbare Szenarien: SSE eignet sich für Situationen, in denen der Server Daten in Echtzeit an den Client sendet, wie zum Beispiel Aktienkurs-Updates, Nachrichten-Echtzeit-Pushen usw. WebSocket eignet sich für Szenarien, die Echtzeit-Zwei-Wege-Kommunikation erfordern, wie Chat-Anwendungen und mehrspielerisches kollaboratives Bearbeiten.
- Je nach Ihren spezifischen geschäftlichen Anforderungen und Szenarien hängt die Wahl von SSE oder WebSocket von Ihren tatsächlichen Bedürfnissen ab. Wenn du nur einen Server brauchst, der Daten in eine Richtung an die Clients sendet, und es einfach und kompatibel halten möchtest, ist SSE eine gute Wahl. Wenn Sie eine zweiseitige Kommunikation benötigen oder fortschrittlichere Funktionen und Steuerung benötigen, könnte WebSocket besser zu Ihren Bedürfnissen passen.
SSE-Event-Stream-Format
Ein Ereignisstrom ist ein einfacher Textstrom, der im UTF-8-Format codiert werden sollte. VeranstaltungsstromDie Nachricht ist durch ein Paar Zeilenumbrüche getrennt。 Verhaltenskommentarzeilen, die mit einem Doppelpunkt beginnen, werden ignoriert. Jedes Feld wird durch einen Feldnamen dargestellt, gefolgt von einem Doppelpunkt und dann durch Textdaten für den Wert dieses Feldes.
Die Felder sind wie folgt:
Ereignis: Eine Zeichenkette, die zur Identifikation des Ereignistyps verwendet wird. Wenn diese Zeichenkette angegeben ist, sendet der Browser ein Ereignis mit dem angegebenen Ereignisnamen an den entsprechenden Listener; Der Client sollte addEventListener() verwenden, um auf das angegebene Ereignis zu hören. Wenn eine Nachricht keinen Ereignisnamen angibt, kann der On-Message-Handler aufgerufen werden.
Daten: Das Datenfeld der Nachricht. Wenn der EventSource mehrere aufeinanderfolgende Zeilen erhält, die mit data:beginnen, verkettet er diese und fügt einen Zeilenumbruch zwischen ihnen ein. Der Zeilenumbruch am Ende wird entfernt.
id: Event ID, die zum Eigenschaftswert der aktuellen EventSource-Eigenschaft "Last Event ID" des aktuellen EventSource-Objekts wird.
wiederholen: Die Zeit, sich wieder zu verbinden. Wenn die Verbindung zum Server unterbrochen wird, wartet der Browser auf die festgelegte Zeit und versucht dann, die Verbindung wieder herzustellen. Dies muss eine ganze Zahl sein, die die Zeit zum Wiederverbinden in Millisekunden angibt. Wird ein nicht-ganzzahliger Wert angegeben, wird das Feld ignoriert.
EventSource-Instanz
Die EventSource-Schnittstelle ist die Schnittstelle zwischen dem Webinhalt und dem Server, um Ereignisse zu senden.
EventHandler-Eigenschaft
EventSource.onopen wird aufgerufen, wenn die Verbindung offen ist. EventSource.onmessage wird aufgerufen, wenn eine Nachricht ohne Ereignisattribut empfangen wird. EventSource.onerror wird bei Verbindungsausnahmen aufgerufen.
SSE Server (ASP.NET Core)
Erstellen Sie ein neues ASP.NET Core-Projekt mit .NET 8, und der Controller-Code ist wie folgt:
Für den Client, der die Verbindung herstellt, senden Sie alle zwei Intervalle eine Nachricht an den Client.
SSE-Client
Schreiben Sie den Client-Code auf der View-Seite mit HTML und JS wie folgt:
Beginnen Sie das Projekt mit folgenden Effekten:
Referenz:
Der Hyperlink-Login ist sichtbar.
Der Hyperlink-Login ist sichtbar.
Der Hyperlink-Login ist sichtbar. |