Aprire una connessione WebSocket
Si connetta a un server WebSocket.
Aprire una connessione WebSocket è una lezione JavaScript Academy gratuita su CoddyKit. Questa è la lezione 1 di 4. Puoi leggere la lezione completa qui gratuitamente — poi esercitati direttamente nel browser con un editor di codice integrato e un tutor IA disponibile 24/7. Fa parte del percorso di apprendimento JavaScript Academy, e i tuoi progressi si sincronizzano tra il web e l'app CoddyKit. Il corso JavaScript Academy include 4 lezioni in totale.
Che cosa sono i WebSocket?
WebSocket fornisce una connessione persistente full-duplex tra browser e server attraverso una singola connessione TCP. A differenza del modello richiesta/risposta di HTTP, entrambe le parti possono inviare messaggi in qualsiasi momento: è l'ideale per chat, flussi di dati in tempo reale e giochi.
Gli schemi ws e wss
Gli URL WebSocket utilizzano ws:// (in chiaro) oppure wss:// (crittografato con TLS). In produzione preferisca sempre wss://, proprio come https.
const url = "wss://example.com/socket";Creare una connessione
Crei un socket con new WebSocket(url). L'handshake inizia immediatamente; la connessione non è pronta finché non viene aperta.
const socket = new WebSocket("wss://example.com/socket");
console.log(socket.url);L'evento onopen
onopen viene generato quando l'handshake è completato. Solo a quel punto è sicuro inviare dati.
socket.onopen = (event) => {
console.log("Connection established");
socket.send("Hello server");
};Alternativa con addEventListener
Può utilizzare addEventListener invece delle proprietà on* per associare più gestori.
socket.addEventListener("open", () => {
console.log("open via listener");
});readyState della connessione
readyState indica il ciclo di vita: CONNECTING (0), OPEN (1), CLOSING (2), CLOSED (3).
if (socket.readyState === WebSocket.OPEN) {
socket.send("ready!");
}Sottoprotocolli
Un secondo argomento consente di negoziare un sottoprotocollo. Il server ne sceglie uno e, dopo l'apertura, può leggere socket.protocol.
const s = new WebSocket("wss://example.com", ["chat", "v2.chat"]);
s.onopen = () => console.log("Using", s.protocol);Stessa origine e contenuti misti
Una pagina caricata tramite https può aprire solo connessioni wss://: l'apertura di ws:// viene bloccata come contenuto misto. Pianifichi di conseguenza i Suoi URL.
Tipo binario
Imposti binaryType su "blob" (valore predefinito) oppure su "arraybuffer" per controllare come vengono ricevuti i frame binari.
socket.binaryType = "arraybuffer";Un client minimale
Metta insieme i vari elementi: apra la connessione, registri lo stato e liberi le risorse.
const socket = new WebSocket("wss://example.com/socket");
socket.onopen = () => console.log("opened");
socket.onclose = () => console.log("closed");Timeout della connessione
I WebSocket non dispongono di un timeout di connessione integrato. Utilizzi un timer che chiuda il socket se onopen non viene generato entro il tempo previsto.
const socket = new WebSocket(url);
const timer = setTimeout(() => {
if (socket.readyState !== WebSocket.OPEN) socket.close();
}, 5000);
socket.onopen = () => clearTimeout(timer);Verifica rapida
Verifichi le nozioni di base sulle connessioni.
Riepilogo: apertura di una connessione
Ha imparato a conoscere gli schemi ws/wss, ha creato un socket con new WebSocket, gestito onopen, verificato readyState, negoziato i sottoprotocolli e aggiunto un timeout di connessione. Ora: inviare e ricevere messaggi.
Domande Frequenti
La lezione «Aprire una connessione WebSocket» è gratuita?
Sì — il testo completo di «Aprire una connessione WebSocket» è gratuito qui sul web. Per esercitarvi in modo interattivo (un editor di codice integrato e un tutor IA 24/7) e sbloccare il resto del corso JavaScript Academy, passa a CoddyKit PRO. Il corso JavaScript Academy include 4 lezioni in totale.
Cosa imparerò in «Aprire una connessione WebSocket»?
Si connetta a un server WebSocket. Eserciti JavaScript Academy con codice pratico che esegui direttamente nel browser, e un tutor IA 24/7 risponde alle tue domande mentre lavori sulla lezione.
Ho bisogno di esperienza per iniziare JavaScript Academy?
Non è richiesta alcuna esperienza precedente. JavaScript Academy su CoddyKit è strutturato per principianti e studenti avanzati, quindi puoi iniziare da qui o dall'inizio e procedere al tuo ritmo. Questa è la lezione 1 di 4.
Quanto tempo richiede la lezione «Aprire una connessione WebSocket»?
La maggior parte delle lezioni CoddyKit richiede circa 5–10 minuti. Ogni lezione è breve e interattiva, quindi fai progressi costanti e riprendi esattamente da dove hai lasciato su web e app.
Posso scrivere ed eseguire codice in questa lezione JavaScript Academy?
Sì. Ogni lezione JavaScript Academy include un editor di codice integrato, quindi scrivi ed esegui codice reale direttamente nel tuo browser e ricevi feedback istantaneo dall'IA — nessuna configurazione locale necessaria.
Tutte le lezioni di questo corso
- Aprire una connessione WebSocket
- Inviare e ricevere messaggi
- Ciclo di vita ed errori della connessione
- Strategie di riconnessione