你有没有想过：微信网页版为什么消息秒到，而你自己写的网页要刷新才能看到新数据？Fireship 频道的百秒神课《WebSockets in 100 Seconds》，用一分钟多的时间讲透了这背后的技术分水岭——HTTP 天生"一问一答"，而实时通信需要一根“永远在线的电话线”。本文把这条视频的一分钟展开成一篇完整的技术地图：从轮询、长轮询到 WebSocket 的演进逻辑，握手协议的真实细节，以及“什么时候根本不该用 WebSocket”的工程判断。没看过视频能完全看懂，看过的人会多懂一层协议背后的取舍。
| 项目 | 信息 |
|---|---|
| 视频标题 | WebSockets in 100 Seconds（WebSocket 百秒课） |
| 所属系列 | Fireship「in 100 Seconds」百秒讲解系列 |
| 频道 | Fireship（主理人 Jeff Delaney，面向现代 Web 开发者的高热度技术频道） |
| 领域 | Web 开发 / 实时通信 / 网络协议 |
| 发布时间 | 2020年前后（据频道页面，本次未能实时核验） |
| 播放量 | 未能实时核验（百秒系列长期为该频道头部内容，以视频页面为准） |
| 视频形态 | 概念讲解 + 极速代码演示（用 Node.js 起一个最小可跑的实时服务，并演示消息广播） |
数据说明：本文写作时实时抓取渠道不可用，播放量、发布日期等动态数据未引用精确数字，均以视频页面为准。协议层面的知识点，已对照 RFC 6455 等 一手协议文档交叉确认，读者可按文末参考来源自行验证。
这条视频值得深读的原因在于：WebSocket 是前端工程师面试的高频题、实时产品的地基，却也是被误用最多的技术之一——很多人背过“全双工、长连接”八个字，说不清它到底解决了 HTTP 的什么病。这条百秒课恰好把“病根—土办法—正解”三步讲清楚了。
按视频的叙事顺序，它的论证链是三层：先立靶子（HTTP 不擅长实时），再给土办法（轮询），最后亮正解（WebSocket）。
HTTP 的世界模型极其朴素：客户端发请求，服务器回响应，连接结束。这个模型为“浏览网页”而生——你要一篇文章，我给你一篇，两不相欠。但如果你的需求是“服务器有新消息时，第一时间告诉我”，问题就来了：服务器没法主动敲门，它只能坐在门口等客户端来问。在 HTTP 的语义里，主动权永远在浏览器手里。这就是为什么早期的网页聊天室、股票行情页，体验总是“一顿一顿”的——不是网速慢，是模型不对。
最直觉的补丁是轮询（Polling）：浏览器用定时器每隔一秒发一次请求，问“有新消息吗？”没有就返回空，有就返回数据。这招粗暴但有效，代价是绝大部分请求都在空转：十次提问九次白问，每一次还都拖着完整的 HTTP 请求头（Cookie、User-Agent 等动辄上千字节）在网络上跑。轮询的本质是用带宽和延迟换实时感——问得越勤，浪费越多；问得越懒，消息越迟。
长轮询（Long Polling）进了一步：客户端发问后，服务器不马上回答，而是把请求挂住，直到有新数据才响应；客户端收到后立刻再问，维持一个准实时的循环。这把空转请求变成了“挂着等”的连接，延迟大幅下降。2000 年代中期的网页 IM、行情推送，靠的基本就是这套被后来者称为 Comet 的技术——它好用，但依然在滥用 HTTP 的语义：每个消息都要经历一次完整的请求-响应开销，服务器还要养着大量半开连接。
视频的主角登场。WebSocket 的思路是：既然 HTTP 只能“你问我答”，那就先用 HTTP 完成一次握手，然后把这条连接改造成双向通道。流程是：浏览器发一个特殊的 HTTP 请求，带上 Upgrade: websocket 头；服务器如果支持，回一个状态码 101 Switching Protocols；从这一刻起，这条 TCP 连接不再说 HTTP 的“一问一答”方言，改说 WebSocket 的“帧”语言——双方随时可以主动发消息，谁也不用先举手。这就是“全双工”的含义：像打电话，不像寄信。新的地址协议是 ws:// 与加密的 wss://。
视频后半段用极短的时间演示了服务端代码：用 Node.js（配合 Socket.IO 这类库）监听连接，收到消息就向所有客户端广播——十几行代码，一个多人实时聊天室的骨架就立起来了。这是百秒课的典型叙事策略：先让你看见“能做到”，再谈“做规范”。而生产环境的账本——鉴权、断线重连、多机扩展——视频没时间展开，正是本文后面要替它补齐的部分。
视频里每一句轻描淡写的话，背后都有真实的协议史与工程实践：
1. RFC 6455（2011）。WebSocket 协议的正式标准，由 Ian Fette 与 Alexey Melnikov 起草，IETF 于 2011 年 12 月发布。握手用的 Sec-WebSocket-Key、数据帧格式、ping/pong 心跳帧，全部定义在这份文档里。今天所有浏览器和服务器实现，遵循的都是它。
2. HTML5 运动的产物。WebSocket 的雏形由 WHATWG 的 Ian Hickson 在 2008 年前后提出，最初叫 TCPConnection，本意是给 HTML5 补一块“浏览器与服务器常驻双向通道”的拼图。它诞生于社区对 Comet 类hack的不满，是“标准取代补丁”的经典案例。
3. Comet 时代（2006）。“长轮询”这套打法在 2006 年被 Alex Russell 命名为 Comet（取“彗星”之意，暗喻服务器推送）。那个年代 Gmail、网页 IM 等产品的实时感，几乎全靠这类技巧硬扛，直到 WebSocket 普及才逐渐退场。
4. 电话交换的百年隐喻。“全双工”不是软件行业的新词：1878 年人工电话交换机出现后，通话双方通过接线员建立专线，两边可以同时说话——这就是全双工；对讲机一次只能一个人讲，是半双工。WebSocket 之于 HTTP，正是把“寄信”升级成了“打电话”。
5. Socket.IO（2010）。视频中演示用的库，由 Guillermo Rauch 创建。它当年爆红的杀手锏是自动降级：浏览器支持 WebSocket 就用 WebSocket，不支持就自动退回长轮询——恰好把本文要点二、三、四串成了一条技术演进链。今天现代浏览器已全面支持 WebSocket，这类兼容层更多提供的是房间、广播、自动重连等工程便利。
6. 后来的竞争者们。WebSocket 并非实时通信的终点：只需服务器单向推送的场景，SSE（Server-Sent Events）用纯 HTTP 就能做到自动重连的事件流；HTTP/2（RFC 7540）一度内置服务器推送，后因实用性不佳被 Chrome 于 2022 年移除；基于 QUIC 的 HTTP/3（RFC 9114）之上，WebTransport 正在提供更新的多路复用通道；音视频点对点则是 WebRTC 的领地。没有银弹，只有场景匹配——这句评论是理解整个实时通信版图的钥匙。
证据充分的部分。“HTTP 原生不擅长服务器主动推送”是协议架构层面的事实；“轮询浪费、长轮询占资源、WebSocket 一次握手长期双向”的对比，与 RFC 6455 及各主流实现的行为完全一致。这层教学是扎实的。
需要打折或补充的部分，有四处：
1. 用一张决策表替代条件反射。遇到实时需求先问三个问题：数据往哪个方向流？多高频？能否丢？——单向服务器推送选 SSE；低频状态同步选轮询；双向高频交互（聊天、协同编辑、联机游戏）才上 WebSocket；音视频点对点找 WebRTC。先选型再写码，能省掉一半的返工。
2. 把生产检查清单钉在墙上。上线 WebSocket 服务前过一遍：心跳（ping/pong）保活、指数退避的断线重连、消息序号与幂等、握手阶段的身份鉴权、网关与负载均衡的空闲超时配置。这五项覆盖了该技术九成的事故来源。
3. 用浏览器 DevTools 看见“帧”。打开开发者工具的 Network 面板，点开任意 WebSocket 连接，你能直接看到每一帧的收发内容——把抽象的“长连接”变成肉眼可见的数据流。调试实时应用，这是性价比最高的一个习惯。
flowchart TD
A[需求: 服务器要主动推消息] --> B[HTTP 病根: 只能一问一答]
B --> C[土办法: 轮询]
B --> D[土办法: 长轮询]
C --> E[代价: 空转多 延迟高]
D --> F[代价: 占连接 开销大]
E --> G[正解: WebSocket]
F --> G
G --> H[一次HTTP握手]
H --> I[101 切换协议]
I --> J[双向帧通道 常开]
J --> K[适用: 双向高频低延迟]
J --> L[不适用: 单向低频场景]
L --> M[替代: SSE 或轮询]
本文由「51学通信」技术团队出品。51学通信由通信行业18年老兵爱卫生（微信ID: gprshome201101）维护，聚焦5G/6G核心网、3GPP标准解读、通信前沿技术深度分析。 出版作品有《5G核心网原理与实践》《IMS原理与实践》等4本通信专业书籍。知识星球「51学通信」提供深度技术答疑和行业洞察。
[!tip] 51学通信知识星球 星主：爱卫生（微信：gprshome201101）——公众号「51学通信」创办者，19 年通信行业运维与讲师经验，著有《GPRS网络信令实例详解》《EPC原理与实践》《5G核心网原理与实践》三本纸质书（各大电商平台有售）。 星球定位：深耕 5G 核心网、IMS、NFV/AI、云原生等 ICT 领域，主打运维岗位与信令分析。 当前规模：5200 篇主题 / 990 个回答，198 元/年。 加入福利：加入星球后请加爱卫生微信，拉您进知识星球年度陪伴与答疑群——不限量回复您的各种问题，另有群内分享。 AI 加持：51学通信知识星球已作为 skill 接入 WorkBuddy，使用 deepseek-4-flash 在海量星球帖子中精准找贴、找视频、找 FAQ 和案例，做总结、找文档和 PPT 等场景全覆盖。