WebSocket è una tecnologia integrale in molte moderne applicazioni web. Se scrivi codice per il web, probabilmente hai già sentito il termine, ma forse non sei sicuro di cosa sia esattamente o come usarlo. Fortunatamente, WebSocket non è un concetto complesso e puoi ottenerne una comprensione di base abbastanza rapidamente.

Che cos'è WebSocket?

WebSocket, purtroppo, è uno di quei nomi che a prima vista non sembrano avere senso. WebSocket è in realtà il nome di un protocollo di comunicazione che consente la comunicazione bidirezionale tra il client e il server web.

In termini più semplici, WebSocket è una tecnologia che consente a un client e un server di creare una connessione in cui una delle parti può inviare un messaggio all'altra in qualsiasi momento.

Questo è diverso da una normale connessione HTTP, in cui il client deve avviare una richiesta e solo allora il server può inviare una risposta. In effetti, WebSocket è un protocollo di comunicazione completamente diverso da HTTP che è stato progettato per essere compatibile con HTTP. Quando un'applicazione client desidera avviare una connessione WebSocket, deve utilizzare l'estensione

instagram viewer
Meccanismo di aggiornamento HTTP per passare al protocollo WebSocket.

A questo punto, potresti pensare: "un protocollo è solo un insieme di regole, come puoi usarlo per programmare?".

Il pezzo mancante è qualcosa chiamato a pila di protocollo. In sostanza, i dispositivi che supportano un protocollo hanno hardware e software integrati che consentono di scrivere applicazioni che comunicano utilizzando il protocollo. Il protocollo non viene utilizzato direttamente per creare nulla.

Perché è stato creato WebSocket?

Per illustrare la necessità di WebSocket, considera il meccanismo alla base della chat su Internet.

Qualcuno invia un messaggio al server di chat dal proprio dispositivo, ma il server deve comunque inviare quel messaggio al tuo dispositivo prima che tu possa leggerlo. Se il server utilizza HTTP, il server non può inoltrarti direttamente quel messaggio, perché il server non può avviare richieste.

Ci sono un paio di modi per risolvere questo problema con HTTP. Un modo è che il client invii costantemente richieste di aggiornamento al server e il server inoltrerà tutti i dati che ha nella risposta. Questa tecnica è chiamata polling e ogni richiesta è chiamata poll. Esistono due varianti di polling: polling lungo e polling breve.

L'utilizzo della variante di polling lungo significa che il dispositivo client chiede costantemente al server se sono disponibili nuovi messaggi. Se sono disponibili nuovi messaggi, il server invierà i messaggi come risposta. In caso contrario, il server ritarderà la risposta e manterrà aperta la connessione fino a quando non avrà i dati da inviare, quindi il client effettuerà immediatamente una nuova richiesta.

Questa tecnica è inefficiente, perché HTTP non è stato progettato per essere utilizzato in questo modo. Funziona adeguatamente su piccola scala, ma ogni richiesta HTTP implica l'invio di dati aggiuntivi nel file header e si traduce in un carico significativamente maggiore sul server quando molti client eseguono il polling esso.

Ecco un diagramma che illustra il lungo polling:

La variante di polling breve è ancora meno efficiente. In breve, il server non mantiene la connessione aperta finché non ci sono nuovi dati, il che significa che il client deve continuare a eseguire il polling del server a intervalli fissi e molto brevi.

Un'altra tecnica per la comunicazione bidirezionale in HTTP è chiamata streaming.

In streaming, dopo l'invio della prima richiesta, il server mantiene la connessione aperta a tempo indeterminato, inviando nuove informazioni come continue risposte parziali al client.

L'utilizzo dello streaming comporta un sovraccarico dei dati e un carico del server inferiori rispetto al polling, poiché idealmente il client effettua una sola richiesta HTTP. Sfortunatamente, lo streaming crea problemi in determinate condizioni perché i browser e gli intermediari di rete (come i proxy) spesso cercano di gestire il risposte parziali come frammenti di una grande risposta HTTP (che è il normale comportamento HTTP), invece che come messaggi separati a cui erano destinati essere.

WebSocket è stato creato per risolvere questi problemi. A differenza di HTTP, WebSocket è stato progettato specificamente per la comunicazione bidirezionale. Con WebSocket, una volta aperta una connessione, il client e il server possono inviare messaggi avanti e indietro senza problemi di polling o streaming.

Casi d'uso per WebSocket

WebSocket è fantastico, ma ciò non significa che debba essere utilizzato ovunque.

L'implementazione di WebSocket può aggiungere complessità alla tua applicazione, specialmente sul lato server, quindi non dovrebbe essere eseguita a meno che tu non abbia una buona ragione. Ciò pone la domanda: che aspetto ha una buona ragione?

WebSocket è ideale per i casi d'uso in cui è richiesta una comunicazione bidirezionale frequente a bassa latenza. In altre parole, WebSocket offre un vantaggio per le applicazioni che devono comunicare frequentemente o su larga scala. Se non è necessario che la comunicazione sia in tempo reale o l'applicazione non crescerà mai su larga scala, il polling o lo streaming potrebbero essere sufficienti per l'uso in tale applicazione.

Gli usi tipici di WebSocket sono nella creazione di applicazioni di chat, giochi multiplayer online, collaborazione in tempo reale e software di notifica, ecc.

Come utilizzare WebSocket sul lato client

L'uso di WebSocket sul lato server può essere piuttosto complicato e il processo varia sostanzialmente a seconda della lingua (come C#, Giava, ecc.) e la libreria di scelta, quindi non lo tratteremo qui. Successivamente, discuteremo brevemente come utilizzare WebSocket sul lato client.

Tutti i browser moderni implementano un'API Web chiamata API WebSocket, che è lo stack di protocollo del browser per il protocollo WebSocket. Puoi usare WebSocket in JavaScript usando questa API. L'API consente di creare un oggetto WebSocket, attraverso il quale creare una connessione WebSocket e interagire con il server WebSocket.

È possibile utilizzare il seguente formato di codice per creare un oggetto WebSocket:

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

Il primo argomento del costruttore è l'URI del server WebSocket con cui si desidera creare una connessione. Inizierà sempre con "ws" o "wss". Il secondo argomento è facoltativo. Il suo valore è una stringa o un array di stringhe, che specifica i sottoprotocolli supportati.

L'oggetto WebSocket ha una proprietà di sola lettura denominata readyState. L'accesso a questa proprietà fornisce lo stato corrente della connessione WebSocket. readyState ha quattro possibili valori: "connecting", "open", "closing" e "closed".

Quando viene eseguita quella riga di codice, il browser proverà a connettersi al server specificato. La connessione non verrà completata immediatamente, quindi readyState di exampleSocket si "connetterà". Nessun messaggio può essere inviato o ricevuto fino al completamento della connessione, a quel punto il valore di readyState diventerà "aperto".

Il esempioSocket l'oggetto ha un listener di eventi (che è diverso da Listener di eventi DOM) denominato "onopen" che consente di eseguire ulteriori azioni solo dopo che è stata stabilita la connessione. L'oggetto ha anche un metodo "send" che consente di inviare stringhe, BLOB (dati binari) e ArrayBuffer come messaggi al server.

Ecco un esempio usando questi insieme:

esempioSocket.onopen = funzione (evento) {
esempioSocket.send("WebSocket è davvero fantastico");
};

L'API fornisce anche un modo per essere in grado di reagire ai messaggi inviati dal server. Questo viene fatto con il listener di eventi "onmessage". Ecco un esempio:

esempioSocket.onmessage = funzione (evento) {
consolle.tronco d'albero(evento.dati);
}

Invece puoi anche scrivere una funzione freccia:

esempioSocket.onmessage = (evento) => { consolle.log (dati.evento); }

L'API fornisce anche un chiudere() metodo per chiudere la connessione. Ecco come appare:

esempioSocket.chiudere();

WebSocket consente una comunicazione bidirezionale efficiente

WebSocket è un protocollo di comunicazione bidirezionale. Server e browser implementano stack di protocolli per comunicare tramite WebSocket. WebSocket esiste perché HTTP non è stato progettato per essere bidirezionale. Esistono metodi per implementare connessioni bidirezionali con HTTP, ma presentano problemi.

WebSocket è una tecnologia potente, ma non è necessaria in tutti i casi, poiché può complicare notevolmente l'architettura dell'applicazione. L'utilizzo di WebSocket sul lato client viene eseguito con l'API WebSocket del browser.