L'avvento di AJAX è stato rivoluzionario: tutte le più grandi e diffuse applicazioni Web hanno subito questa onda di cambiamento e l'hanno cavalcata verso una migliore esperienza utente offerta.
Questa tecnologia però, come tutti sappiamo, ha molti limiti e può essere notevolmente migliorata. Proprio per questo motivo gli enti di standardizzazione del Web hanno voluto introdurre tra le novità legate al prossimo HTML 5 una componente che potesse sostituire e migliorare AJAX: i WebSocket.
Essi offrono un canale di comunicazione bidirezionale (sia da client a server che viceversa) e full- duplex (leggo e scrivo contemporaneamente) basato sul TCP. Il processo di standardizzazione è ancora in corso ma sembra aver raggiunto un livello di stabilità e ufficialità accettabile per poterne discutere e analizzarne il funzionamento.
Compatibilità
Ecco l'elenco dei principali browser e dei relativi rendering engine con la specifica relativa all'implementazione dello standard WebSocket:
| Browser | Supporto WebSocket |
|---|---|
| Internet Explorer | dalla versione 10 |
| Firefox | dalla versione 12 |
| Chrome | dalla versione 19 |
| Safari e iOS Safari | in maniera completa dalla versione 6 |
| Opera | in maniera completa dalla versione 12.5 |
| Android Browser | non supporta ancora la specifica |
Le API esposte
Uno degli obiettivi del W3C è stato quello della semplicità e della facilità d'uso dei WebSocket. Le API esposte sono infatti molto semplici.
Tutta la gestione del flusso comunicativo è delegata ad un oggetto WebSocket che presenta metodi per l'invio e listeners event-oriented per la ricezione di messaggi. Come vedremo tra poco le API sono molto simili a quelle utilizzate nell'articolo precedente riguardante i WebWorkers.
Per creare un WebSocket l'unico parametro necessario è l'url al quale esso deve puntare:
var webSocket = new WebSocket("ws://www.websocket.org");Una volta creato l'oggetto abbiamo a disposizione due metodi per l'invio di informazioni e per la chiusura del canale di comunicazione:
webSocket.send(“Hello world”);
webSocket.close()Per interagire invece con i messaggi ricevuti dal server e con il cambiamento di stato del WebSocket stesso possiamo utilizzare i listeners:
webSocket.onopen = function(event) {
console.log(“Connection opened!”);
}
webSocket.onmessage = function(event) {
console.log(“Server says “ + event.data);
}
webSocket.onerror = function(event) {
console.log(“Error!!”);
}
webSocket.onclose = function(event) {
console.log(“Connection closed!”);
}Il protocollo Web Socket
La comunicazione tra client e server avviene tramite un protocollo particolare, simile ma non compatibile con l'HTTP. Il nome del protocollo è, banalmente, Web Socket Protocol e le specifiche possono essere reperite a questo indirizzo: http://www.whatwg.org/specs/web-socket-protocol/.
Per vedere all'opera un'applicazione basata su WebSocket è necessario dotarsi di un web server che supporti questo protocollo ed attualmente non sono ancora presenti soluzioni stabili e funzionali soprattutto data la ancora bassa diffusione delle specifiche a livello di browser.
Per approfondire di più l'argomento WebSocket la miglior fonte di documentazione sono le specifiche ufficiali disponibili sul sito web del W3C.
