[具身智能-214]：WebSocket 是 HTML5 提供的一种在单个 TCP 连接上进行全双工通信的协议。

WebSocket 是 HTML5 提供的一种在单个 TCP 连接上进行全双工通信的协议。简单来说它解决了HTTP 协议“只能由客户端发起请求服务器被动响应”的局限性使得服务器可以主动向客户端推送数据。如果把 HTTP 比作“打电话”你打过去对方接说完挂断下次再打那么 WebSocket 就像是“专线电话”接通后双方随时可以说话且一直不挂断。为了让你更直观地理解我为你整理了 WebSocket 的核心机制、与 HTTP 的区别以及应用场景。 核心原理从“握手”到“长连接”WebSocket 的工作流程主要分为三个阶段其中最精彩的是它的“伪装”策略握手阶段基于 HTTP 升级WebSocket 连接建立之初其实是“伪装”成 HTTP 请求的。客户端会发送一个带有特殊请求头的 HTTP 请求告诉服务器“我想升级协议咱们改用 WebSocket 聊天吧”。客户端请求发送Connection: Upgrade和Upgrade: websocket等头部信息。服务端响应如果服务器支持会返回状态码101 Switching Protocols。结果一旦握手成功底层的 TCP 连接就被保留下来但通信规则不再遵循 HTTP而是切换到 WebSocket 协议。数据传输轻量级帧握手完成后连接就变成了“长连接”。数据以帧Frame的形式传输头部非常小仅 2-14 字节没有 HTTP 那么多冗余的 Header 信息传输效率极高。全双工客户端和服务器可以随时互发消息互不干扰。连接管理心跳保活为了防止连接因长时间无数据而被防火墙或路由器切断WebSocket 内置了心跳机制Ping/Pong。客户端或服务器定期发送 Ping 帧对方回复 Pong 帧以此证明“我还活着”。 WebSocket vs HTTP本质区别为了让你一目了然我做了一个对比表表格特性HTTPWebSocket连接方式短连接请求-响应后即断开虽有 Keep-Alive 但仍受限长连接一次握手持久保持通信方向单向只能客户端主动请求服务器不能主动推全双工双向随意发服务器可主动推送头部开销大每次请求都携带完整的 Header极小握手后仅需少量字节头部适用场景网页加载、API 接口调用、表单提交聊天室、实时游戏、股票行情、协同办公️ 前端如何使用最简代码示例浏览器原生支持 WebSocket使用非常简单。以下是一个标准的客户端实现流程javascript// 1. 创建连接 (注意协议是 ws:// 或 wss://) const ws new WebSocket(ws://localhost:8080); // 2. 连接成功握手完成 ws.onopen () { console.log(连接已建立); // 发送数据 ws.send(Hello Server!); }; // 3. 收到服务器消息 ws.onmessage (event) { console.log(收到消息:, event.data); }; // 4. 连接关闭 ws.onclose () { console.log(连接已断开); }; // 5. 发生错误 ws.onerror (err) { console.error(发生错误:, err); }; 典型应用场景根据搜索到的资料WebSocket 主要应用于需要低延迟和高实时性的场景即时通讯IM如网页版微信、在线客服系统需要消息毫秒级送达。实时协作工具如腾讯文档、飞书文档多人同时编辑时光标位置和内容的同步必须依靠 WebSocket。金融行情股票、期货价格的实时跳动使用 WebSocket 推送比传统的轮询每隔几秒问一次服务器效率高得多。在线游戏网页小游戏的实时对战需要同步玩家的操作和位置。弹幕系统视频直播中的实时弹幕成千上万的用户同时收发数据。⚠️ 开发注意事项如果你打算在生产环境使用 WebSocket有几点非常重要安全性WSS就像 HTTP 需要升级为 HTTPS 一样WebSocket 在生产环境必须使用WSSWebSocket Secure它是基于 SSL/TLS 加密的默认端口是 443防止数据被窃听。Nginx 配置如果使用 Nginx 做反向代理必须配置Upgrade和Connection头部否则 WebSocket 握手会失败退化成普通 HTTP 请求。心跳与重连网络是不稳定的客户端需要实现断线自动重连机制并配合心跳检测来维持连接活跃。总结来说WebSocket 是现代 Web 开发中实现实时交互的基础设施它让浏览器从“只能听命行事”变成了可以“随时对话”的智能终端。