Wie erstelle ich WebSocket-Verbindungen in Node.js?

Wie Erstelle Ich Websocket Verbindungen In Node Js



WebSocket ist im Grunde ein Protokoll, das von den Entwicklern in ihrer Anwendung verwendet wird, um eine Vollduplex-Kommunikation zwischen der Client- und der Serverseite zu ermöglichen. Diese Art der Kommunikation ermöglicht es Benutzern, ohne Verzögerung in Echtzeit mit dem Server zu kommunizieren. Heutzutage wird dieses Protokoll in fast jeder Webanwendung verwendet, um ein besseres Benutzererlebnis zu bieten.

Dieser Artikel veranschaulicht das Verfahren zum Erstellen von webSocket-Verbindungen in Node.js.

Wie erstelle ich WebSocket-Verbindungen in Node.js?

Die WebSocket-Verbindung besteht aus zwei Teilen: der Entwicklung auf der Clientseite und der Serverseite. Außerdem muss eine Dummy-Website erstellt werden, die als Medium zwischen beiden Seiten fungiert. Dadurch werden die Nachrichten von beiden Seiten übertragen. Führen Sie die folgenden Schritte zur Erstellung von WebSocket in NodeJs aus.







Schritt 1: Einrichten der NodeJs-Umgebung

Mit Hilfe der „ CD ”-Befehl, durchsuchen Sie den Projektordner und führen Sie darin den Befehl aus „ npm init -y ” um die Standard-NodeJs-Module zu installieren:



npm init - Und

Nach der Ausführung des obigen Befehls wird die neue Datei mit dem Namen „ package.json Es wird erstellt, in dem die grundlegenden Informationen zum Projekt gespeichert werden:







Schritt 2: Installieren des WebSocket-Moduls

Um das WebSocket-Protokoll zu verwenden, muss das Modul mit dem Namen „ ws „muss im NodeJs-Projekt installiert werden. Nachfolgend wird der Befehl zur Installation eingefügt:



npm install ws

Die folgende Ausgabe zeigt „ ws ” wurde im gewünschten NodeJs-Verzeichnis installiert:

Schritt 3: Einrichten des WebSocket-Servers

Um die Serverseite des webSocket-Protokolls einzurichten, erstellen Sie ein neues „ .js Geben Sie im Projektordner eine Datei mit dem Namen „ ein. serverseitig ” und fügen Sie den unten angegebenen Code ein:

const wsObj = erfordern ( 'ws' ) ;

const ws = neu wsObj. Server ( { Hafen : 3000 } ) ;

Konsole. Protokoll ( „Linuxhint-Server wurde gestartet“ ) ;

Die Erklärung für den obigen Code lautet wie folgt:

  • Zunächst mit Hilfe des „ erfordern() ” Methode, die „ ws „Modul, das bereits im obigen Abschnitt installiert ist, wird in das aktuelle „ serverSide.js ' Datei.
  • Rufen Sie als Nächstes das „ Server() ”-Methode unter Verwendung des Objekts „ ws „Modul mit dem Namen“ wsObj ” und übergeben Sie die Portnummer von „ 3000 ” um den Server am angegebenen Port von Localhost zu starten.
  • Zeigen Sie außerdem eine zufällige Meldung über dem Konsolenfenster an, um zu bestätigen, dass der Server serverseitig gestartet wurde.

Schritt 4: Einrichten des WebSocket-Clients

Erstellen Sie eine weitere Datei mit dem Namen „ clientSide ”, um die Clientseite einzurichten, die eine Verbindung zum Server herstellt. Fügen Sie den folgenden Code ein, um die grundlegende Client-Seite einzurichten, die eine zufällige Nachricht anzeigt, wenn eine Verbindung über den Server hergestellt wird:

const obj = neu WebSocket ( 'ws://localhost:3000' ) ;

obj. addEventListener ( 'offen' , ( ) => {

Konsole. Protokoll ( „Sie sind mit dem Linuxhint-Server verbunden!“ ) ;

} ) ;

Die Beschreibung für den obigen Codeblock:

  • Erstellen Sie zunächst ein neues Objekt für „ WebSocket() ”-Protokoll, das am Localhost mit der Portnummer „ abgehört wird 3000 “.
  • Speichern Sie dann das neue Objekt in der Variablen mit dem Namen „ obj “.
  • Hängen Sie anschließend den Ereignis-Listener von „ offen ' mit diesem ' obj “. Dieser Ereignis-Listener führt eine anonyme Funktion aus, wenn der Server auf dem Localhost mit der angegebenen Portnummer geladen wird.
  • Die Funktion zeigt eine zufällige verbindungsbezogene Meldung über die Konsole an.

Schritt 5: Erstellung der Webseite

Erstellen Sie im Projektverzeichnis ein „ .html Datei vom Typ „ mit dem Namen „ Index “, das die Grundstruktur von HTML zusammen mit dem einzelnen Skript-Tag zum Importieren der „ clientSide.js ' Datei:

DOCTYPE html >

< Nur HTML = 'In' >

< Kopf >

< Meta-Zeichensatz = „UTF-8“ >

< Titel > Klient Titel >

Kopf >

< Körper >

< h1 > Linuxhint-Website h1 >

Körper >

< Skript-Quelle = „clientSide.js“ > Skript >

html >

Schritt 6: Ausführung

Öffne das ' index.html ” über die Webseite direkt aus dem Verzeichnis. Gehen Sie dann zum Terminal oder zur Eingabeaufforderung und führen Sie den folgenden Befehl aus:

Knoten serverseitig

Die Ausgabemeldung zeigt, dass der Server gestartet wurde.

Gehen Sie nun, ohne den Server zu schließen, zur index.html und öffnen Sie sie über den Webbrowser. Dort erscheint im Konsolenfenster die Meldung „Verbindung erfolgreich hergestellt“:

Die Ausgabe zeigt, dass die Verbindung zwischen der Client- und der Serverseite hergestellt wurde. In diesem Blog wurde der Prozess zum Erstellen der webSocket-Verbindung in NodeJs erläutert.

Abschluss

Um eine webSocket-Verbindung in NodeJs zu erstellen, erstellen Sie ein neues NodeJs-Projekt und installieren Sie „ ws ”-Modul durch Ausführen des „ npm install ws ' Befehl. Erstellen Sie nun eine Datei für die Serverseite und importieren Sie darin das „ ws ” Modul. Verwenden Sie dieses Modul, um einen WebSocket-Server am Port „ 3000 “. Erstellen Sie eine weitere Datei für die Clientseite, in der Sie ein neues Objekt für „ WebSocket ' genannt ' obj „und lass es am Hafen lauschen“ 3000 “. In diesem Blog wurde die Vorgehensweise zum Herstellen einer WebSocket-Verbindung in NodeJs veranschaulicht.