WebSocket ist eine integrale Technologie in vielen modernen Webanwendungen. Wenn Sie Code für das Web schreiben, haben Sie den Begriff wahrscheinlich schon einmal gehört, sind sich aber vielleicht nicht sicher, was genau das ist oder wie man ihn verwendet. Glücklicherweise ist WebSocket kein komplexes Konzept, und Sie können ziemlich schnell ein grundlegendes Verständnis davon bekommen.

Was ist WebSocket?

WebSocket ist leider einer dieser Namen, die auf den ersten Blick keinen Sinn ergeben. WebSocket ist eigentlich der Name eines Kommunikationsprotokoll Dies ermöglicht eine bidirektionale Kommunikation zwischen dem Client und dem Webserver.

Einfacher ausgedrückt ist WebSocket eine Technologie, die es einem Client und einem Server ermöglicht, eine Verbindung herzustellen, bei der jede Partei der anderen jederzeit eine Nachricht senden kann.

Dies unterscheidet sich von einer normalen HTTP-Verbindung, bei der der Client eine Anfrage initiieren muss und erst dann der Server eine Antwort senden kann. Tatsächlich ist WebSocket ein völlig anderes Kommunikationsprotokoll als HTTP, das so konzipiert wurde, dass es HTTP-kompatibel ist. Wenn eine Clientanwendung eine WebSocket-Verbindung initiieren möchte, muss sie die verwenden

HTTP-Upgrade-Mechanismus um auf das WebSocket-Protokoll umzuschalten.

An diesem Punkt denken Sie vielleicht: „Ein Protokoll ist nur eine Reihe von Regeln, wie können Sie diese zum Codieren verwenden?“.

Das fehlende Stück ist etwas, das a genannt wird Protokollstapel. Im Wesentlichen verfügen Geräte, die ein Protokoll unterstützen, über integrierte Hardware und Software, mit der Sie Anwendungen schreiben können, die über das Protokoll kommunizieren. Das Protokoll wird nicht direkt verwendet, um irgendetwas zu erstellen.

Warum wurde WebSocket erstellt?

Um die Notwendigkeit von WebSocket zu veranschaulichen, betrachten Sie den Mechanismus hinter dem Chatten im Internet.

Jemand sendet eine Nachricht von seinem Gerät an den Chat-Server, aber der Server muss diese Nachricht trotzdem an Ihr Gerät senden, bevor Sie sie lesen können. Wenn der Server HTTP verwendet, kann der Server diese Nachricht nicht direkt an Sie weiterleiten, da der Server keine Anforderungen initiieren kann.

Es gibt mehrere Möglichkeiten, dieses Problem mit HTTP zu beheben. Eine Möglichkeit besteht darin, dass der Client ständig Aktualisierungsanforderungen an den Server sendet, und der Server leitet alle Daten, die er in der Antwort hat, weiter. Diese Technik wird Polling genannt, und jede Anfrage wird Polling genannt. Es gibt zwei Polling-Varianten: Long-Polling und Short-Polling.

Die Verwendung der Long-Polling-Variante bedeutet, dass das Client-Gerät ständig den Server fragt, ob neue Nachrichten verfügbar sind. Wenn neue Nachrichten verfügbar sind, sendet der Server die Nachrichten als Antwort. Wenn nicht, würde der Server die Antwort verzögern und die Verbindung offen halten, bis er Daten zum Zurücksenden hätte, und dann würde der Client sofort eine neue Anfrage stellen.

Diese Technik ist ineffizient, da HTTP nicht für diese Verwendung konzipiert wurde. Es funktioniert angemessen in kleinem Maßstab, aber jede HTTP-Anforderung beinhaltet das Senden zusätzlicher Daten in der Header und führt zu einer deutlich erhöhten Belastung des Servers, wenn viele Clients pollen es.

Hier ist ein Diagramm, das eine lange Abfrage veranschaulicht:

Noch weniger effizient ist die Short-Polling-Variante. Beim Kurzabruf hält der Server die Verbindung nicht offen, bis neue Daten vorliegen, was bedeutet, dass der Client den Server in festen, sehr kurzen Intervallen abfragen muss.

Eine andere Technik für die bidirektionale Kommunikation in HTTP wird als Streaming bezeichnet.

Beim Streaming hält der Server die Verbindung nach dem Senden der ersten Anfrage unbegrenzt offen und sendet neue Informationen als kontinuierliche Teilantworten an den Client.

Die Verwendung von Streaming führt zu einem geringeren Daten-Overhead und einer geringeren Serverlast als Polling, da der Client im Idealfall nur eine HTTP-Anfrage stellt. Leider verursacht das Streaming unter bestimmten Bedingungen Probleme, da Browser und Netzwerkvermittler (wie Proxys) oft versuchen, damit umzugehen Teilantworten als Bruchstücke einer großen HTTP-Antwort (was normales HTTP-Verhalten ist) statt als separate Nachrichten, für die sie gedacht waren sein.

WebSocket wurde entwickelt, um diese Probleme zu lösen. Im Gegensatz zu HTTP wurde WebSocket speziell für die bidirektionale Kommunikation entwickelt. Mit WebSocket können der Client und der Server, sobald eine Verbindung geöffnet ist, Nachrichten hin und her senden, ohne Probleme mit Abfragen oder Streaming.

Anwendungsfälle für WebSocket

WebSocket ist großartig, aber das bedeutet nicht, dass es überall verwendet werden sollte.

Die Implementierung von WebSocket kann Ihre Anwendung komplexer machen, insbesondere auf der Serverseite, daher sollten Sie dies nur tun, wenn Sie einen guten Grund haben. Da stellt sich die Frage: Wie sieht ein guter Grund aus?

WebSocket ist ideal für Anwendungsfälle, in denen eine häufige bidirektionale Kommunikation mit geringer Latenz erforderlich ist. Mit anderen Worten, WebSocket bietet einen Vorteil für Anwendungen, die häufig oder in großem Umfang kommunizieren müssen. Wenn die Kommunikation nicht in Echtzeit erfolgen muss oder die Anwendung niemals in großem Umfang wachsen wird, kann Polling oder Streaming für die Verwendung in dieser Anwendung ausreichend sein.

Typische Anwendungen von WebSocket sind das Erstellen von Chat-Anwendungen, Online-Multiplayer-Spielen, Echtzeit-Zusammenarbeit und Benachrichtigungssoftware usw.

So verwenden Sie WebSocket auf der Clientseite

Die Verwendung von WebSocket auf der Serverseite kann ziemlich umständlich sein, und der Prozess variiert erheblich je nach Sprache (wie z C#, Java, etc.) und Bibliothek Ihrer Wahl, daher werden wir sie hier nicht behandeln. Als Nächstes besprechen wir kurz die Verwendung von WebSocket auf der Clientseite.

Alle modernen Browser implementieren eine Web-API namens the WebSocket-API, das ist der Protokollstack des Browsers für das WebSocket-Protokoll. Mit dieser API können Sie WebSocket in JavaScript verwenden. Mit der API können Sie ein WebSocket-Objekt erstellen, über das Sie eine WebSocket-Verbindung erstellen und mit dem WebSocket-Server interagieren.

Sie können das folgende Codeformat verwenden, um ein WebSocket-Objekt zu erstellen:

let exampleSocket = new WebSocket("wss://www.example.com/socketserver", "dummyProtocol");

Das erste Argument für den Konstruktor ist der URI des WebSocket-Servers, mit dem Sie eine Verbindung herstellen möchten. Es beginnt immer mit "ws" oder "wss". Das zweite Argument ist optional. Sein Wert ist entweder eine Zeichenfolge oder ein Array von Zeichenfolgen, das die von Ihnen unterstützten Unterprotokolle angibt.

Das WebSocket-Objekt hat eine schreibgeschützte Eigenschaft namens readyState. Der Zugriff auf diese Eigenschaft stellt den aktuellen Status der WebSocket-Verbindung bereit. readyState hat vier mögliche Werte: „connecting“, „open“, „closing“ und „closed“.

Wenn diese Codezeile ausgeführt wird, versucht der Browser, eine Verbindung zum angegebenen Server herzustellen. Die Verbindung wird nicht sofort hergestellt, daher ist der readyState von exampleSocket "connecting". Es können keine Nachrichten gesendet oder empfangen werden, bis die Verbindung hergestellt ist. An diesem Punkt wird der Wert von readyState "offen".

Das BeispielSocket Objekt hat einen Ereignis-Listener (der sich von DOM-Ereignis-Listener) namens "onopen", die Ihnen erlaubt, weitere Aktionen erst auszuführen, nachdem die Verbindung hergestellt wurde. Das Objekt hat auch eine „send“-Methode, mit der Sie Strings, Blobs (Binärdaten) und ArrayBuffers als Nachrichten an den Server senden können.

Hier ist ein Beispiel, in dem diese zusammen verwendet werden:

exampleSocket.onopen = Funktion (Veranstaltung) {
exampleSocket.send("WebSocket ist wirklich cool");
};

Die API bietet Ihnen auch eine Möglichkeit, auf die Nachrichten zu reagieren, die der Server sendet. Dies geschieht mit dem Ereignis-Listener "onmessage". Hier ist ein Beispiel:

exampleSocket.onmessage = Funktion (Veranstaltung) {
Konsole.Protokoll(Veranstaltung.Daten);
}

Stattdessen können Sie auch schreiben eine Pfeilfunktion:

exampleSocket.onmessage = (Ereignis) => { Konsole.log (ereignis.daten); }

Die API bietet auch a nah dran() Methode zum Schließen der Verbindung. So sieht es aus:

BeispielSocket.nah dran();

WebSocket ermöglicht eine effiziente bidirektionale Kommunikation

WebSocket ist ein bidirektionales Kommunikationsprotokoll. Server und Browser implementieren Protokollstacks, um über WebSocket zu kommunizieren. WebSocket existiert, weil HTTP nicht bidirektional konzipiert wurde. Es gibt Methoden, um bidirektionale Verbindungen mit HTTP zu implementieren, aber sie haben Probleme.

WebSocket ist eine leistungsstarke Technologie, die jedoch nicht in allen Fällen erforderlich ist, da sie die Anwendungsarchitektur erheblich verkomplizieren kann. Die Verwendung von WebSocket auf der Clientseite erfolgt über die WebSocket-API des Browsers.