Come creare connessioni WebSocket in Node.js?

Come Creare Connessioni Websocket In Node Js



WebSocket è fondamentalmente un protocollo utilizzato dagli sviluppatori nella loro applicazione per abilitare la comunicazione full duplex tra il lato client e quello server. Questo tipo di comunicazione consente agli utenti di comunicare con il server in tempo reale senza alcun ritardo. Al giorno d'oggi, questo protocollo viene utilizzato in quasi tutte le applicazioni web per fornire un'esperienza utente migliore.

Questo articolo illustra la procedura per creare connessioni webSocket in Node.js.

Come creare connessioni WebSocket in Node.js?

La connessione WebSocket è composta da due parti: sviluppo lato client e lato server. È inoltre necessario creare il sito Web fittizio che funge da mezzo tra entrambe le parti. Usandolo, i messaggi vengono trasferiti da entrambi i lati. Visita i passaggi seguenti per la creazione di WebSocket in NodeJs.







Passaggio 1: configurazione dell'ambiente NodeJs

Con l'aiuto del “ CD ', attraversa la cartella del progetto e al suo interno esegui il comando ' npm init -y ' per installare i moduli NodeJs predefiniti:



npm init - E

Dopo aver eseguito il comando precedente, il nuovo file denominato ' pacchetto.json ” che memorizza le informazioni di base relative al progetto viene creato:







Passaggio 2: installazione del modulo WebSocket

Per utilizzare il protocollo WebSocket il modulo denominato “ w ' deve essere installato nel progetto NodeJs. Di seguito è inserito il comando per l'installazione:



installazione npm ws

L'output seguente mostra ' w ' è stato installato nella directory NodeJs desiderata:

Passaggio 3: configurazione del server WebSocket

Per impostare il lato server del protocollo webSocket, creare un nuovo ' .js ' digitare il file all'interno della cartella del progetto con il nome ' lato server ' e inserisci il codice indicato di seguito:

cost wsObj = richiedere ( 'ws' ) ;

cost w = nuovo wsObj. server ( { porta : 3000 } ) ;

consolle. tronco d'albero ( 'Il server Linuxhint è stato avviato' ) ;

La spiegazione del codice precedente è la seguente:

  • Innanzitutto, con l’aiuto del “ richiedere() ', il metodo ' w ' Il modulo già installato nella sezione precedente viene importato all'interno dell'attuale ' serverSide.js ' file.
  • Successivamente, invoca il ' Server() ' metodo utilizzando l'oggetto del ' w ' modulo denominato ' wsObj ' e passare il numero di porta di ' 3000 ' per avviare il server sulla porta specificata di Localhost.
  • Inoltre, visualizza alcuni messaggi casuali nella finestra della console per confermare che il server è stato avviato dall'estremità del server.

Passaggio 4: configurazione del client WebSocket

Crea un altro file con il nome “ dalla parte del cliente ' per configurare il lato client che si connette al server. Inserisci il codice seguente per configurare il lato client di base che visualizza un messaggio casuale quando viene connesso al server:

cost ogg = nuovo WebSocket ( 'ws://localhost:3000' ) ;

ogg. addEventListener ( 'aprire' , ( ) => {

consolle. tronco d'albero ( 'Sei connesso al server Linuxhint!' ) ;

} ) ;

La descrizione del blocco di codice precedente:

  • Innanzitutto, crea un nuovo oggetto per ' WebSocket() ' protocollo che viene ascoltato sul Localhost avente il numero di porta di ' 3000 ”.
  • Quindi, memorizza il nuovo oggetto nella variabile denominata ' ogg ”.
  • Successivamente, allega l'ascoltatore di eventi di ' aprire ' con questo ' ogg ”. Questo ascoltatore di eventi eseguirà una funzione anonima quando il server verrà caricato su Localhost con il numero di porta fornito.
  • La funzione visualizza un messaggio casuale relativo alla connessione sulla console.

Passaggio 5: creazione della pagina Web

All'interno della directory del progetto, crea un file ' .html ” file di tipo avente il nome di “ indice ' che contiene la struttura di base dell'HTML insieme al singolo tag script per importare il ' clientSide.js ' file:

DOCTYPEhtml >

< solo html = 'In' >

< Testa >

< metaset di caratteri = 'UTF-8' >

< titolo > Cliente titolo >

Testa >

< corpo >

< h1 > Sito Web Linuxhint h1 >

corpo >

< script src = 'clientSide.js' > sceneggiatura >

html >

Passaggio 6: esecuzione

Apri il ' indice.html ' sulla pagina Web direttamente dalla directory. Quindi, passa al terminale o al prompt dei comandi ed esegui il comando seguente:

nodo lato server

Il messaggio di output mostra che il server è stato avviato.

Ora senza chiudere il server, vai a index.html e aprilo tramite il browser web. Lì verrà visualizzato il messaggio di connessione riuscita nella finestra della console:

L'output mostra che la connessione è stata stabilita tra il lato client e il lato server. Questo blog ha spiegato il processo di creazione della connessione webSocket in NodeJs.

Conclusione

Per creare una connessione webSocket in NodeJs, crea un nuovo progetto NodeJs e installa il ' w ' modulo eseguendo il ' installazione npm ws 'comando. Ora, crea un file per il lato server e al suo interno importa il file “ w ' modulo. Utilizza questo modulo per creare un server WebSocket sulla porta “ 3000 ”. Crea un altro file per il lato client in cui devi definire un nuovo oggetto per “ WebSocket ' di nome ' ogg ” e fatelo ascoltare al porto “ 3000 ”. Questo blog ha illustrato la procedura per stabilire una connessione WebSocket in NodeJs.