Skip to content

WebSocket 实时通信核心功能实现

这是一个最小但完整的 WebSocket 实时通信实现,展示了 WebSocket 协议和实时应用开发的核心概念和实现方式。

项目结构

websocket-system/
├── src/
│   ├── server.js           # WebSocket 服务器
│   ├── client.js           # WebSocket 客户端
│   ├── rooms.js            # 房间管理
│   └── messages.js         # 消息处理
├── test/
│   ├── server.test.js      # 服务器测试
│   ├── client.test.js      # 客户端测试
│   └── rooms.test.js       # 房间测试
├── package.json
└── README.md

安装依赖

bash
npm install

运行测试

bash
npm test

核心功能

1. WebSocket 服务器

实现 WebSocket 服务器,支持连接管理、消息处理和房间功能。

2. WebSocket 客户端

实现 WebSocket 客户端,支持连接、消息发送和接收。

3. 房间管理

实现房间功能,支持加入、离开和房间消息。

4. 消息处理

实现消息路由和广播功能。

使用示例

使用服务器

javascript
const { WebSocketServer } = require('./src/server');

const server = new WebSocketServer({ port: 8080 });

server.on('connection', (client) => {
  console.log(`Client connected: ${client.id}`);
});

server.on('message', (message) => {
  console.log('Message received:', message);
});

console.log('WebSocket server running on port 8080');

使用客户端

javascript
const { WebSocketClient } = require('./src/client');

const client = new WebSocketClient('ws://localhost:8080');

client.connect().then(() => {
  console.log('Connected to server');

  // 加入房间
  client.joinRoom('chat');

  // 发送消息
  client.sendMessage('chat', 'Hello, World!');

  // 监听消息
  client.on('message', (message) => {
    console.log('Message received:', message);
  });
});

可扩展功能点

1. 消息持久化

将消息保存到数据库:

javascript
// TODO: 实现消息持久化
async function saveMessage(message) {
  // 保存消息到数据库
  // 用于消息历史和审计
}

2. 私聊功能

实现点对点聊天:

javascript
// TODO: 实现私聊功能
async function sendPrivateMessage(from, to, content) {
  // 发送私聊消息
  // 只发送给指定用户
}

3. 文件传输

支持文件发送:

javascript
// TODO: 实现文件传输
async function sendFile(room, file) {
  // 发送文件
  // 支持二进制数据传输
}

4. 消息加密

端到端加密:

javascript
// TODO: 实现消息加密
async function encryptMessage(message, key) {
  // 加密消息
  // 使用 AES 或其他加密算法
}

5. 消息撤回

支持消息撤回功能:

javascript
// TODO: 实现消息撤回
async function recallMessage(messageId) {
  // 撤回消息
  // 通知所有客户端
}

下一步

查看 05-lesson-plan.md 了解详细的课程计划。


架构师AI杜公众号二维码

扫描二维码关注"架构师AI杜"公众号,获取更多技术内容和最新动态