Page 263 - Web性能权威指南

17.1 WebSocket API

浏览器提供的 WebSocket API 可谓简约。当然，简约背后隐藏着连接管理和消息处
理等底层细节。发起新连接，需要 WebSocket 资源的 URL 和一些应用回调：

var ws = new WebSocket('wss://example.com/socket'); ➊
ws.onerror = function (error) { ... } ➋
ws.onclose = function () { ... } ➌
ws.onopen = function () { ➍
ws.send("Connection established. Hello server!"); ➎
}
ws.onmessage = function(msg) { ➏
if(msg.data instanceof Blob) { ➐
processBlob(msg.data);
} else {
processText(msg.data);
}
}
➊ 打开新的安全 WebSocket 连接（wss）
➋ 可选的回调，在连接出错时调用
➌ 可选的回调，在连接终止时调用
➍ 可选的回调，在 WebSocket 连接建立时调用
➎ 客户端先向服务器发送一条消息
➏ 回调函数，服务器每发回一条消息就调用一次
➐ 根据接收到的消息，决定调用二进制还是文本处理逻辑

这个 API 非常直观。事实上，应该说它与上一章介绍的 EventSource API 很像。这
是故意这么设计的，因为 WebSocket 也提供类似和扩展的功能。当然，除了相似性
之外，还有很多重要的差别。下面我们就逐个介绍。

模拟 WebSocket

WebSocket 已经经历了很多次版本升级、实现回滚和安全考验。好消息是，RFC
6455 定义的最新版本（v13）已经得到所有现代浏览器支持。唯一尚未支持它的
是 Opera mini，可参见 caniuse.com/websockets。
与 使 用 腻 子 脚 本 模 拟 SSE 类 似（ 参 见 16.1 节 的“ 使 用 自 编 JavaScript 模 拟
EventSource”），WebSocket 也可以使用 JavaScript 库来模拟。不过，模拟 WebSocket
最难的地方不是 API，而是传输层！因此，选择的腻子脚本及其后备机制（XHR、
轮询、EventSource、iframe 轮询，等等）对模拟方案的性能会有很大影响。

252 ｜ 第 17 章