一、引言
WebSocket API 是 HTML5 标准化之后引入的一项重要技术，它允许服务器与客户端之间建立持久的连接，并在一个单独的持久连接上进行全双工通信。这种通信方式改变了传统的HTTP请求-响应模式，使得服务器能够主动向客户端推送信息，从而实现了真正的实时通信。
二、WebSocket API 概述
WebSocket API 提供了一组用于建立和管理 WebSocket 连接的函数和事件。这些函数和事件使开发者能够轻松地实现实时通信功能。以下是 WebSocket API 的主要组成部分：
- WebSocket 构造函数
var ws = new WebSocket("ws://example.com/socketserver");- 使用
WebSocket构造函数创建一个新的 WebSocket 对象，并指定服务器的地址和端口。这里使用的是 WebSocket URL 协议（ws://或wss://用于加密连接）。
- WebSocket 属性
readyState：表示 WebSocket 连接的状态。可能的值有CONNECTING（正在连接）、OPEN（已打开）、CLOSING（正在关闭）和CLOSED（已关闭）。bufferedAmount：表示已发送但尚未被服务器确认的 UTF-8 文本字节数。extensions：表示服务器选择的扩展。protocol：表示服务器选择的子协议。url：表示 WebSocket 连接的 URL。
- WebSocket 方法
send(data)：用于向服务器发送数据。数据可以是文本（字符串）或二进制数据（Blob 或 ArrayBuffer）。close([code[, reason]])：用于关闭 WebSocket 连接。可以指定关闭代码和关闭原因。
- WebSocket 事件
onopen：当 WebSocket 连接成功建立时触发。onmessage：当从服务器接收到数据时触发。可以通过event.data获取数据。onerror：当 WebSocket 连接发生错误时触发。onclose：当 WebSocket 连接关闭时触发。可以通过event.code和event.reason获取关闭代码和关闭原因。
三、WebSocket API 使用示例
以下是一个简单的 WebSocket API 使用示例：
var socket = new WebSocket("ws://example.com/socketserver"); socket.onopen = function(event) { console.log("Connection open!"); socket.send("Hello, server!"); }; socket.onmessage = function(event) { console.log("Received message from server: " + event.data); }; socket.onerror = function(error) { console.log("WebSocket error: " + error); }; socket.onclose = function(event) { console.log("WebSocket connection closed with code " + event.code + " and reason " + event.reason); };
在上面的示例中，首先创建了一个 WebSocket 对象并指定了服务器的地址。然后，通过监听 onopen、onmessage、onerror 和 onclose 事件来处理连接建立、接收数据、错误和连接关闭的情况。在 onopen 事件中，向服务器发送了一条消息。在 onmessage 事件中，打印了从服务器接收到的消息。
四、总结
WebSocket API 提供了一种实现实时通信的强大工具。通过监听连接状态、发送和接收数据以及处理错误和关闭事件，开发者可以轻松地构建出具有实时交互功能的 Web 应用程序。无论是在线聊天、实时数据监控还是协同办公等场景，WebSocket API 都能够发挥出其独特的优势。
