服务器向 Web 客户端推送数据的技术方案
在传统的 HTTP 请求-响应模型中，客户端必须发起请求，服务器才能返回数据，但在实时聊天、股票行情、实时通知等场景下，需要服务器主动将数据推送到客户端。
以下是目前主流的四种实现方案及其详细分析：
WebSocket (全双工通信)
WebSocket 是一种在单个 TCP 连接上提供全双工通信的协议,它允许服务器和客户端在任何时间点相互发送数据。
- 工作原理：客户端通过 HTTP 协议发起一个“握手”请求，如果服务器支持，则将连接升级为 WebSocket 协议，之后双方建立一个持久的 TCP 连接。
- 优点：
- 实时性极高：延迟最低，无需重复发送 HTTP 头部。
- 双向通信：服务器可推,客户端也可发。
- 缺点：
- 资源消耗：服务器需要维持大量持久连接,对内存压力较大。
- 复杂度高：需要处理心跳检测（Heartbeat）以防止连接被防火墙或代理切断。
- 适用场景：实时聊天室、多人协作编辑、在线游戏、金融交易行情。
SSE (Server-Sent Events, 服务器发送事件)
SSE 是一种基于 HTTP 协议的单向推送技术,允许服务器将数据流式传输给浏览器。
- 工作原理：客户端通过
EventSourceAPI 建立连接，服务器保持连接开启，并以特定的 MIME 类型 (text/event-stream
) 持续发送数据。
- 优点：
- 轻量级：基于标准 HTTP 协议,无需特殊协议升级。
- 自动重连：浏览器内置了断线自动重连机制。
- 防火墙友好：由于是标准 HTTP,更容易穿透防火墙。
- 缺点：
- 单向通信：只能服务器 $rightarrow$ 客户端，客户端发送数据仍需使用传统的 HTTP 请求。
- 连接数限制：在 HTTP/1.1 下，浏览器对同一域名的最大连接数有限制（通常为 6 个），但在 HTTP/2 下此问题已解决。
- 适用场景：实时新闻推送、社交媒体通知、股票价格更新、ChatGPT 类的流式文本输出。
Web Push API (浏览器推送通知)
Web Push 允许服务器在用户没有打开网页的情况下,通过浏览器的推送服务向用户发送通知。
- 工作原理：利用 Service Worker 在后台运行，服务器将消息发送给推送服务（如 Google FCM 或 Mozilla Push Service）,推送服务再将消息传递给用户的浏览器。
- 优点：
- 离线推送：即使浏览器标签页已关闭,用户依然能收到通知。
- 用户触达率高：以系统级通知形式呈现。
- 缺点：
- 权限依赖：必须经过用户明确授权（允许通知）。
- 实现复杂：涉及 VAPID 密钥、Service Worker 注册及第三方推送服务。
- 适用场景：营销通知、消息提醒、订单状态更新。
Long Polling (长轮询 – 传统方案)
长轮询是模拟推送的一种“伪”实时方案，在 WebSocket 和 SSE 普及前被广泛使用。
- 工作原理：客户端发起请求 $rightarrow$ 服务器如果没有新数据，则挂起请求直到有数据或超时 $rightarrow$ 服务器返回数据 $rightarrow$ 客户端立即发起下一个请求。
- 优点：
- 兼容性最强：支持所有古老的浏览器。
- 缺点：
- 资源浪费：频繁建立和关闭 HTTP 连接,产生大量头部开销。
- 延迟较高：在请求交替的间隙存在短暂的延迟。
- 适用场景：仅作为上述现代方案的降级兼容方案。
技术方案对比总结
| 特性 | WebSocket | SSE | Web Push | Long Polling |
|---|---|---|---|---|
| 通信方向 | 双向 (Full-duplex) | 单向 (Server $rightarrow$ Client) | 单向 (Server $rightarrow$ Client) | 伪双向 |
| 协议 |
自定义协议 (ws://) |
HTTP | HTTP + Service Worker | HTTP |
| 实时性 | 极高 | 高 | 中/高 | 中 |
| 浏览器支持 | 现代浏览器 | 现代浏览器 | 现代浏览器 | 所有浏览器 |
| 连接状态 | 持久连接 | 持久连接 | 无需保持页面开启 | 短暂持久 |
| 复杂度 | 高 | 低 | 高 | 低 |
如何选择？
- 如果需要极低延迟且双向交互 $rightarrow$ 选择 WebSocket。
- 如果只需要服务器向客户端推送文本流/通知 $rightarrow$ 选择 SSE。
- 如果需要在用户关闭页面后依然能触达用户 $rightarrow$ 选择 Web Push API。
- 如果需要兼容极老旧的浏览器 $rightarrow$ 选择 Long Polling。
首发原创文章，作者：王坚，如若转载，请注明出处：https://test.idctop.com/article/490511.html
