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杜"公众号,获取更多技术内容和最新动态