连接管理

WebSocket 服务器地址

未连接

> 连接信息

连接状态

未连接

服务器地址

-

发送消息数

0

接收消息数

0

连接时间

-

协议版本

-

消息收发

等待连接...

WebSocket 演示工具已就绪，点击上方"连接"按钮开始

发送消息

> WebSocket 知识

什么是 WebSocket？

WebSocket 是一种在单个 TCP 连接上进行全双工通信的协议。与 HTTP 不同，WebSocket 允许服务器主动向客户端推送数据，无需客户端频繁轮询。这使得 WebSocket 非常适合实时应用场景，如在线聊天、实时游戏、协作编辑等。

WebSocket vs HTTP

特性	WebSocket	HTTP
连接方式	持久连接	短连接（请求 - 响应）
通信方向	双向（全双工）	单向（客户端发起）
服务器推送	支持	不支持（需轮询）
开销	低（握手后仅 2 字节帧头）	高（每次请求都有完整 HTTP 头）
适用场景	实时通信、在线游戏、协作工具	网页浏览、REST API

JavaScript 代码示例

// 创建 WebSocket 连接
const ws = new WebSocket('wss://echo.websocket.org');

// 连接打开
ws.onopen = () => {
    console.log('连接已建立');
    ws.send('Hello Server!');
};

// 接收消息
ws.onmessage = (event) => {
    console.log('收到消息:', event.data);
};

// 连接关闭
ws.onclose = () => {
    console.log('连接已关闭');
};

// 错误处理
ws.onerror = (error) => {
    console.error('WebSocket 错误:', error);
};
                

> 使用场景

在线聊天

实时消息推送，无需刷新页面

在线游戏

低延迟玩家状态同步

> 实时数据展示

股票行情、体育比分实时更新

> 协作编辑

多人同时编辑文档，实时同步