HTML5基础教程（二十一）WebSocket：告别“轮询”尬聊！WebSocket：让网页和服务器谈一场永不分手的恋爱

第一章：一场由“HTTP尬聊”引发的“血案”

想象一下这个场景：你正在和一个反应慢半拍的朋友聊天。你每问一句“在吗？”，他就回一句“在的”。然后你再问“有新消息吗？”，他回“没有”。过了两秒，你又问“现在呢？”，他无奈地回“还是没有”…… 如此循环往复，直到他真的有新消息告诉你为止。

是不是感觉血压有点上来了？效率低得令人发指！但在WebSocket出现之前，我们的网页应用（客户端）和服务器（Server）之间的通信，很大程度上就是基于这种名为 “轮询（Polling）” 的尬聊模式。

传统的HTTP协议是一个单向、无状态的协议。它的生命周期永远是：客户端发起请求 -> 服务器响应 -> 连接关闭。就像你打完一次电话就立刻挂断，想问下一个问题就得重拨。为了实现“实时”效果，前端JavaScript只能傻傻地每隔几秒（比如1秒）就发起一个新的HTTP请求去问服务器：“数据有变化吗？（Any update?）”

这种方式带来了几个致命伤：

1. 性能浪费：大量的请求头（Header）、响应头在网络中穿梭，其中很多请求的响应体都是“没有更新”，有效信息密度极低，浪费带宽和服务器资源。
2. 延迟严重：数据真正更新后，必须要等到下一个请求周期才能被获取，实时性取决于轮询的间隔，陷入“要实时就得疯狂轮询，疯狂轮询就拖垮服务器”的死循环。
3. 服务器压力：无论有无数据，服务器都要处理海量的无效请求，连接不断建立又断开，开销巨大。

于是，在人们对实时Web应用的强烈渴望中，WebSocket应运而生，它就像一位社交大师，彻底打破了这场尬聊。

第二章：WebSocket——握手之后，便是坦途

WebSocket是HTML5提供的一种在单个TCP连接上进行全双工通信的网络协议。说白了，就是在浏览器和服务器之间建立一条长期的、双向的通信通道。

一旦连接建立，双方随时都可以主动发送数据给对方，就像接起了一条永不挂断的电话线，你们可以自由地对讲，再也没有了“请求-响应”的束缚。

它的核心工作流程堪称优雅：

一次友好的握手（Handshake）：
WebSocket并非凭空出现，它巧妙地利用了HTTP协议来“敲门”。客户端首先发送一个特殊的HTTP请求，这个请求头里包含了一些“暗号”：

GET /chat HTTP/1.1
Host: server.example