Websocket con Node.js

Le applicazioni web sono cambiate e si sono evolute, questo rende le esigenze degli utenti diverse da quando è stato creato il primo protocollo di connessione sulla rete. Di conseguenza il protocollo HTTP si è evoluto nel corso degli anni ma non ha ancora raggiunto un livello in tempo reale come una connessione TCP tra due squadre.
Queste limitazioni, anziché danneggiare sviluppatori e utenti, sono diventate fonte di motivazione e creatività, generando soluzioni che ci consentono non solo di emulare un sistema di trasmissione in tempo reale, ma anche attraverso HTTP farlo quasi in modo nativo.
WebsocketQuesto è dove il Websocket, un protocollo relativamente nuovo che è supportato solo dai browser più moderni, che ci permette di eliminare HTTP da tutte le sue restrizioni e poter così comunicare efficacemente attraverso gli header OTTENERE.
Websocket È ancora in un periodo di maturazione attiva quindi è molto probabile che non lo troveremo in nuove soluzioni, fortunatamente in Nodo.js abbiamo già alcuni strumenti che ci consentono di gestirli senza dover fare affidamento sulla nostra ingegnosità per costruire strumenti di livello inferiore.
RequisitiQuesto è un tutorial avanzato, quindi prima sarà necessaria un'installazione funzionale di Nodo.js Nel nostro sistema, possiamo dare un'occhiata a questo tutorial prima di continuare ad approfondire, inoltre avremo bisogno dei permessi di amministratore per poter installare le librerie che utilizzeremo. Dobbiamo avere familiarità con i concetti di JavaScript Per esempio richiama e funzioni anonime. Infine dobbiamo avere un editor di testo come Testo sublime che ci permette di scrivere i diversi codici che sono negli esempi.
Per iniziare a creare un'applicazione che ci permetta di usare Web socket Dobbiamo prima costruire una piccola struttura, questo è molto semplice ma necessario, questa struttura sarà composta da:
1- Una cartella dove conserveremo i file del nostro progetto.
2- Un file chiamato server.js, questo file, come indica il nome, sarà il server attraverso il quale stabiliremo la connessione in tempo reale utilizzando il Web socket.
3- Un file chiamato client.html, questo file sarà l'interfaccia per comunicare con il nostro server attraverso il browser, è necessario avere lo stesso in modo che possiamo inviare e ricevere le informazioni corrispondenti.
Poiché ora abbiamo definito la nostra struttura, possiamo iniziare a prendere alcune righe di codice, per questo dobbiamo iniziare installando una libreria esterna chiamata wow nel nostro ambiente, poiché questo è quello che ci consentirà di utilizzare il protocollo in questione. Per installare questa libreria non ci resta che aprire la nostra console Nodo.js, ci troviamo nella cartella in cui saranno i nostri file e inseriamo il seguente comando:

 npm install ws

Quando lo eseguiamo, possiamo vedere il seguente risultato nella nostra console dei comandi:

Una volta installata la libreria possiamo continuare il nostro lavoro, ora nel nostro file server.js Dobbiamo scrivere il seguente codice, prima vediamo in cosa consiste poi lo spiegheremo:

 var WSServer = require ('ws').Server, wss = nuovo WSServer ({port: 8085}); wss.on ('connessione', funzione (socket) {socket.on ('messaggio', funzione (msg) {console.log ('Ricevuto:', msg, '\ n', 'Da IP:', socket . upgradeReq.connection.remoteAddress); if (msg === 'Hello') {socket.send ('Si funziona!');}}); socket.on ('close', function (code, desc) {console .log ('Offline:' + codice + '-' + desc);});});

La prima cosa che facciamo è richiedere la biblioteca wow che abbiamo appena installato e immediatamente nella stessa istruzione chiama la tua classe server, quindi creiamo un'istanza con la quale creeremo un server che gira sulla porta 8085Questa porta può essere qualsiasi cosa a cui abbiamo accesso.In questo caso, viene utilizzata la 8085 in modo che non ci siano conflitti con altri servizi che sono attualmente in questo ambiente di test.
Poiché abbiamo definito la nostra istanza ora applicheremo il metodo.sopra () per l'evento di connessione, quindi nel richiama da esso passiamo un oggetto chiamato presa, con questo riceveremo i messaggi dal cliente e abbiamo scritto una routine che se riceviamo la parola "Ciao" il server restituirà un messaggio, dove a sua volta stamperemo anche qualcosa nella console dei comandi. Infine, se chiudiamo la connessione avremo un solo messaggio sulla console.
Una volta che abbiamo il nostro server è il momento di costruire il nostro client, per questo nel file client.html definiremo una struttura in cui inseriremo tag html e a JavaScript che funzionerà come collegamento al nostro server. Vediamo come si presenta il nostro file:

 Invio client Websockets

La parte HTML è abbastanza semplice, abbiamo un input di tipo testo e un pulsante di invio, oltre a un div chiamato output cioè chi riceverà le informazioni dal server per mostrarle all'utente. La cosa interessante arriva nell'etichetta dove la prima cosa che facciamo è creare un oggetto del tipo WebSocket e ti indichiamo il percorso dove devi trovarlo, nel nostro caso è il host locale: 8085 e così possiamo vedere che quello che abbiamo fatto nel server.js. Quindi colleghiamo i nostri elementi di invio, testo e output a variabili che possiamo usare.
Quindi quello che facciamo è definire ciascuno dei metodi che possiamo ricevere dal server, quindi ogni volta che inviamo qualcosa verrà registrato nel nostro output, tutto grazie al metodo Inviare (). L'altro metodo che usiamo è il sul messaggio () che si attiva solo se il nostro server risponde e aggiungiamo il risultato nel nostro HTML.
Infine usiamo i metodi vicino () sì errore (), il primo ci dà un messaggio quando il collegamento con il Websocket viene fermato o chiuso, e il secondo ci informa nel caso si sia verificato un errore. Con questo, dobbiamo solo avviare il server nella nostra console e far funzionare il nostro esempio, per questo usiamo il seguente comando:

 nodo server.js

Questo avvierà il server, ma per verificare la funzionalità del nostro codice dobbiamo eseguire il nostro file client.html nel nostro browser preferito e scrivere qualcosa nella casella di testo e premere il pulsante di invio, questo genererà la comunicazione con il presa web e possiamo vedere la risposta dalla console:

Nell'immagine possiamo vedere come la console di comando stampa il messaggio ricevuto registra anche l'indirizzo IP da dove sta ricevendo i dati, questo era quello che abbiamo programmato nel nostro file server.js, dove abbiamo anche indicato che se avessimo ricevuto la parola "Hello" avremmo inviato un messaggio di risposta che è proprio quello che vediamo nella finestra del browser nella stessa immagine. Ora se aggiorniamo il browser la connessione viene interrotta, anche questo viene registrato dalla nostra applicazione, vediamo:

Infine se chiudiamo la connessione nella nostra console con CTRL + C Per fermare il server, il nostro browser attiva il gestore degli errori e lì vedremo un nuovo messaggio:

Se siamo stati osservatori potremmo aver notato qualcosa di importante, in nessun momento per ricevere risposte abbiamo dovuto aggiornare il browser o fare una richiesta Ajax, tutto è stato bidirezionale direttamente con WebSocket, questo è ciò che viene chiamato tempo reale.
Quello che abbiamo mostrato è uno dei modi più rudimentali e manuali che esistono, tuttavia per noi funziona sapere com'è il flusso di lavoro, ma la vera funzionalità pronta per gli ambienti di produzione si ottiene con la libreria socket.io, questo fa la stessa cosa che abbiamo fatto nel tutorial ma in maniera molto più compatta e meno soggetta ad errori da parte dello sviluppatore, che ci permette di concentrarci solo sulla logica dell'applicazione e non tanto sulla parte tecnica di essa.
Per installare socket.io non ci resta che fare un npm install socket.io e con questo dal repository scaricheremo l'ultima versione stabile della libreria, che ci permetterà di iniziare il nostro sviluppo.
Con questo abbiamo finito questo tutorial, con il quale abbiamo fatto un passo importante all'interno Nodo.js sapendo come usare il Web socket, questa tecnologia sta diventando ogni giorno più importante in quanto ci aiuta a creare applicazioni a cui non si pensava mai sul web. È anche importante documentarsi sul protocollo poiché è un modo per comprendere il potenziale di ciò che possiamo ottenere semplicemente sviluppando applicazioni.