一、协议简介
全称：WebSocket是一种全双工双向通信协议，专为网页端实时交互设计，解决 HTTP 短连接无法主动推送数据的痛点，广泛用于数字孪生大屏、实时监控、在线聊天室等场景。
二、底层基础
- 底层依托TCP 协议，传输稳定可靠
- 握手阶段借用HTTP 协议完成协商，握手成功后彻底脱离 HTTP
- 常用标识：
ws://（明文）、wss://（加密） - 默认无固定端口，可自定义端口部署
三、核心通信模式
- 握手阶段：客户端发送 HTTP 握手请求，服务端响应确认，建立连接
- 通信阶段：连接永久保持，服务端与客户端可互相主动发消息
- 断开阶段：任意一端主动关闭连接，通信终止
四、核心特点
- 全双工通信双方平等收发数据，服务器可主动向前端推送数据，无需客户端轮询请求
- 长连接持久化一次建立长期在线，省去反复建立连接开销，延迟极低
- 数据开销小报文头部简洁，相比 HTTP 请求体积更小，传输效率更高
- 跨域友好天然支持浏览器跨域实时通信，适配网页可视化项目
- 实时性极强毫秒级数据推送，完美适配动态数据刷新场景
五、与 HTTP 核心区别
表格
| 对比项 | HTTP | WebSocket |
|---|---|---|
| 连接类型 | 短连接，请求完成即断开 | 长连接，持续在线 |
| 通信方式 | 单向一问一答，客户端主动请求 | 全双工双向互发 |
| 数据推送 | 无法主动推送，只能轮询 | 服务端主动实时推送 |
| 底层 | TCP | TCP |
| 适用场景 | 静态请求、接口查询、文件上传 | 实时大屏、设备状态同步、在线监控 |
六、工作流程
- 前端页面发起 WebSocket 连接请求
- 服务端校验通过，完成握手
- 建立稳定长连接通道
- 后端收到物联网数据后，直接通过通道推送至前端
- 数字孪生页面实时解析渲染，秒级更新画面数据
- 业务结束手动关闭连接，释放资源
七、优点
- 极致低延迟，满足实时可视化需求
- 减少无效轮询，大幅降低服务器带宽压力
- 浏览器原生支持，无需额外安装插件
- 适配所有前端框架，开发便捷
- 完美对接 MQTT 后端数据，打通孪生大屏实时数据流
八、缺点
- 长连接长期占用服务器资源，海量并发场景压力较大
- 网络波动易出现连接断开，需额外做重连机制
- 移动端弱网环境稳定性略差
九、主流应用场景
- 数字孪生 3D 场景、数据可视化大屏实时数据刷新
- 智慧园区、楼宇设备状态实时监控弹窗告警
- 在线协同系统、实时聊天、直播弹幕
- 金融行情实时播报、设备远程指令下发
- 工业组态网页端实时状态同步
十、项目实战搭配方案
物联网终端 → MQTT 上传后端 → 后端转发 WebSocket → 前端孪生大屏实时展示实现从硬件采集到网页可视化全链路实时联动。
十一、精简总结
WebSocket 基于 TCP，借 HTTP 完成握手，建立持久全双工长连接，支持服务端主动推送数据，是网页端数字孪生实时可视化最优通信协议。
