English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
HTML5 Grafica
WebSocket è un protocollo di comunicazione a doppio senso fornito da HTML5 per una comunicazione a doppio senso su una singola connessione TCP.
WebSocket rende lo scambio di dati tra client e server più semplice, permettendo al server di inviare dati attivamente al client. Nel protocollo WebSocket API, il browser e il server devono completare solo una mano, quindi possono creare una connessione persistente e trasmettere dati in modo bidirezionale.
Ora, molti siti web utilizzano tecniche di polling Ajax per implementare tecnologie di push. Il polling è un intervallo di tempo specifico (ad esempio, ogni 1 secondo) in cui il browser invia una richiesta HTTP al server, e poi il server restituisce i dati più recenti al browser del client. Questo modello tradizionale ha ovvi svantaggi, ovvero il browser deve continuamente inviare richieste al server, tuttavia le richieste HTTP possono contenere un'intestazione lunga, nella quale i dati validi possono essere solo una piccola parte, ovviamente questo consuma molte risorse di larghezza di banda e altri risorse.
Il protocollo WebSocket definito da HTML5 può risparmiare meglio le risorse del server e la larghezza di banda, e può comunicare in modo più reale.
Il browser invia una richiesta JavaScript al server per stabilire una connessione WebSocket. Dopo aver stabilito la connessione, il client e il server possono scambiare dati direttamente attraverso la connessione TCP.
Dopo aver ricevuto la connessione WebSocket, puoi passare attraverso send() un metodo per inviare dati al server e attraverso onmessage per ricevere i dati restituiti dal server.
Questa API viene utilizzata per creare un oggetto WebSocket.
var Socket = new WebSocket(url, [protocol]);
Il primo parametro nell'articolo di codice, url, specifica l'URL della connessione. Il secondo parametro protocol è opzionale e specifica il sottoprotocollo accettabile.
Di seguito sono riportate le proprietà dell'oggetto WebSocket. Supponiamo di aver creato l'oggetto Socket utilizzando il seguente codice:
| Proprietà | Descrizione |
| Socket.readyState | Proprietà sola lettura readyState Rappresenta lo stato della connessione e può essere uno dei seguenti valori:
|
| Socket.bufferedAmount | Proprietà sola lettura bufferedAmount Il numero di byte di testo UTF-8 in attesa di trasmissione nella coda, ma non ancora inviato. |
Di seguito sono riportati gli eventi relativi all'oggetto WebSocket. Supponiamo di aver creato l'oggetto Socket utilizzando il seguente codice:
| Evento | Gestore eventi | Descrizione |
| open | Socket.onopen | Attivato quando la connessione viene stabilita |
| message | Socket.onmessage | Attivato quando il client riceve dati dal server |
| error | Socket.onerror | Attivato quando si verifica un errore di comunicazione |
| close | Socket.onclose | Attivato quando la connessione viene chiusa |
Di seguito sono riportati i metodi relativi all'oggetto WebSocket. Supponiamo di aver creato l'oggetto Socket utilizzando il seguente codice:
| Metodo | Descrizione |
| Socket.send() | Inviare dati utilizzando la connessione |
| Socket.close() | Chiudere la connessione |
Il protocollo WebSocket è essenzialmente un protocollo basato su TCP.
Per stabilire una connessione WebSocket, il browser del client deve inizialmente inviare una richiesta HTTP al server, questa richiesta è diversa dalle solite richieste HTTP, poiché contiene alcune informazioni aggiuntive di intestazione, tra cui l'informazione aggiuntiva "Upgrade: WebSocket" che indica che questa è una richiesta HTTP di richiesta di aggiornamento del protocollo. Il server analizza queste informazioni aggiuntive di intestazione e risponde con un messaggio di risposta, il che stabilisce la connessione WebSocket tra client e server. Entrambi possono comunicare liberamente attraverso questo canale di connessione, e questa connessione rimarrà attiva fino a quando uno dei due parti client o server chiude attivamente la connessione.
HTML e JavaScript del client
Al momento, la maggior parte dei browser supporta l'interfaccia WebSocket(), puoi provare l'esempio nei seguenti browser: Chrome, Mozilla, Opera e Safari.
Contenuto del file w3codebox_websocket.html
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>Metodo di utilizzo di WebSocket, sito web di tutorial di base (oldtoolbag.com)</title>
<script type="text/javascript">
function WebSocketTest()
{
var x = document.getElementById("websocket");
if ("WebSocket" in window)
{
x.innerHTML="Il tuo browser supporta WebSocket!";
// Apri un websocket
var ws = new WebSocket("ws://echo.websocket.org");
ws.onopen = function()
{
// WebSocket è connesso, utilizzare il metodo send() per inviare dati
ws.send("Invia dati");
x.innerHTML="I dati vengono inviati...";
};
ws.onmessage = function(evt)
{
var received_msg = evt.data;
x.innerHTML="I dati sono stati ricevuti, tutorial di base (oldtoolbag.com)...";
};
ws.onclose = function()
{
// Chiudi websocket
x.innerHTML="La connessione è stata chiusa...";
};
}
else
{
// Il browser non supporta WebSocket
x.innerHTML="Il tuo browser non supporta WebSocket!";
}
}
</script>
</head>
<body>
<div id="sse">
<input type="button" onclick="WebSocketTest()" value="Esegui WebSocket">
</div>
<div id="websocket"></div>
</body>
</html>Testa e guarda:‹/›I risultati del test sono illustrati nella figura seguente:
La comunicazione software ha una struttura a sette livelli, i tre livelli inferiori sono orientati alla comunicazione dei dati, i tre livelli superiori sono orientati al trattamento dei dati, il livello di trasmissione è un ponte tra i tre livelli superiori e inferiori, ogni livello fa un lavoro diverso, il protocollo superiore dipende dal protocollo inferiore. Sulla base di questo concetto di struttura di comunicazione.
Socket non è un protocollo, è uno strato di astrazione software intermediario di comunicazione tra livello applicazione e protocollo TCP/IP, è un insieme di interfacce. Quando due host comunicano, il Socket organizza i dati per conformarsi al protocollo specificato. La connessione TCP si affida di più al protocollo IP di livello inferiore, la connessione IP si affida a livelli inferiori come il livello di collegamento.
WebSocket è un protocollo di livello applicazione tipico.
Socket è un protocollo di livello di controllo del trasporto
WebSocket è un protocollo di livello applicazione