⬅️ 返回地图
第 29 话

即时热线:WebSocket

以前浏览器和服务器交流像写信(HTTP),一来一回。现在有了 WebSocket,直接打电话!

1. HTTP vs WebSocket

🐌 传统 HTTP (写信)

浏览器:在吗?
服务器:在。
浏览器:在吗?
服务器:在...
(每次都要重新建立连接,慢!)

⚡ WebSocket (电话)

浏览器:喂?(建立连接)
服务器:喂!
浏览器:发个包。
服务器:收到。
(连接一直通着,实时双向!)

2. 拨通电话

建立一个 WebSocket 连接非常简单。

// 1. 拨号 (ws:// 或 wss://) var ws = new WebSocket("wss://echo.websocket.org"); // 2. 电话通了 ws.onopen = function() { ws.send("Hello Server!"); }; // 3. 听到对方说话 ws.onmessage = function(event) { console.log("服务器说: " + event.data); };
📣
SSE (Server-Sent Events) 插嘴: "如果只需要服务器广播(比如股票报价),可以用我!我是单向广播,比 WebSocket 更轻量!"
3. 聊天室模拟

这是一个模拟的 WebSocket 聊天室 (实际上是本地模拟)。

系统: 连接成功...