freecoding.school100% FREE · NO SIGNUP
Await StationISSUE #14 of 26

websockets · client api

PromissaVSRace Condition Rex
Promissa saysThe WebSocket client opens a persistent two-way connection for real-time data.

const ws = new WebSocket("wss://…") upgrades to a live socket. Handle onopen, onmessage, onclose, onerror; send with ws.send(data). Unlike fetch (request/response), the server can push at any time. Use wss:// on HTTPS pages, and add your own reconnect logic — it needs a WebSocket server, so it can't run in this offline sandbox.

Power-ups you unlock

Race Condition Rex attacks — common mistakes

Boss battleSketch a WebSocket client: open, send a hello, log messages, reconnect on close.

Example code

<!doctype html><html><head><meta charset="utf-8"></head>
<body style="background:#06040d;color:#e6e0ff;font-family:monospace;padding:20px"><pre>const ws = new WebSocket('wss://echo.websocket.events');
ws.onopen    = () => ws.send('hello');
ws.onmessage = e => console.log('←', e.data);
ws.onclose   = () => {/* reconnect here */};</pre></body></html>
▶ Open the interactive comic issue
‹ Xhr · The Legacy XMLHttpRequestServer-Sent Events · EventSource ›