【自问自答】在 IM 消息设计中，如何支持快速移植？

Question

一开始实现的是pc客户端，后面想要移植到 m 端、 pc web 端。

如何设计可以快速移植？

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。

Answer 1

设计上可以考虑分层。将 IM 系统设计成模块化的结构，每个模块之间松散耦合，方便在不同平台上重用和移植。

将用户界面（Vue 虚拟 dom）、基础能力（请求、音视频）等模块分离开来。

举个例子，访问本地数据库的模块。设计一个接口，支持 CURD，通过依赖翻转，在使用时传入本地化的方案。

// 定义抽象的数据访问接口
interface DataAccess {
  saveMessage(msg: Message): void;
  getMessage(id: number): Message | undefined;
  getAllMessages(): Message[];
  // ...
}

// 本地化的数据访问层，实现 DataAccess 接口
class LocalDataAccess implements DataAccess {
  private db: LocalDB;
  constructor() {
    // 初始化本地数据库连接
    this.db = new LocalDB();
  }
  saveMessage(msg: Message) {
    // 实现具体的保存逻辑
    this.db.saveMessage(msg);
  }
  getMessage(id: number): Message | undefined {
    // 实现具体的读取逻辑
    return this.db.getMessage(id);
  }
  getAllMessages(): Message[] {
    // 实现具体的读取逻辑
    return this.db.getAllMessages();
  }
  // ...
}

// 在使用数据访问层的代码中，通过依赖注入的方式传入具体的实现
class MessageService {
  private dataAccess: DataAccess;
  constructor(dataAccess: DataAccess) {
    this.dataAccess = dataAccess;
  }
  saveMessage(msg: Message) {
    this.dataAccess.saveMessage(msg);
  }
  getMessage(id: number): Message | undefined {
    return this.dataAccess.getMessage(id);
  }
  getAllMessages(): Message[] {
    return this.dataAccess.getAllMessages();
  }
  // ...
}

// 在创建 MessageService 实例时，传入具体的数据访问层实现
const messageService = new MessageService(new LocalDataAccess());

通过上述的方式，针对不同的端，实现一份基础能力即可。

本文参与了SegmentFault 思否面试闯关挑战赛，欢迎正在阅读的你也加入。