调整目录

packages/message/extension.ts

@@ -0,0 +1,54 @@
+import EventEmitter from 'eventemitter3';
+import { Connect } from '.';
+
+export class ExtServer {
+  private EE: EventEmitter;
+
+  constructor() {
+    this.EE = new EventEmitter();
+    chrome.runtime.onConnect.addListener((port) => {
+      this.EE.emit('connect', new ExtConnect(port));
+    });
+  }
+
+  onConnect(callback: (con: Connect) => void) {
+    this.EE.on('connect', callback);
+  }
+}
+
+export function connect() {
+  return new ExtConnect(chrome.runtime.connect());
+}
+
+export class ExtConnect implements Connect {
+  private EE: EventEmitter;
+  private port: chrome.runtime.Port;
+
+  constructor(port: chrome.runtime.Port) {
+    this.EE = new EventEmitter();
+    this.port = port;
+    port.onMessage.addListener((message) => {
+      this.EE.emit('message', message);
+    });
+    port.onDisconnect.addListener(() => {
+      this.EE.emit('disconnect');
+      this.EE.removeAllListeners();
+    });
+  }
+
+  postMessage(message: unknown) {
+    this.port.postMessage(message);
+  }
+
+  onMessage(callback: (message: unknown) => void) {
+    this.EE.on('message', callback);
+  }
+
+  onDisconnect(callback: () => void) {
+    this.EE.on('disconnect', callback);
+  }
+
+  disconnect() {
+    this.port.disconnect();
+  }
+}

packages/message/index.ts

@@ -0,0 +1,63 @@
+import EventEmitter from 'eventemitter3';
+import { v4 as uuidv4 } from 'uuid';
+
+export interface Server {
+  onConnect: (callback: (con: Connect) => void) => void;
+}
+
+export interface Connect {
+  postMessage: (message: unknown) => void;
+  onMessage: (callback: (message: unknown) => void) => void;
+  onDisconnect: (callback: () => void) => void;
+  disconnect: () => void;
+}
+
+// 消息通道, 通过连接封装消息通道
+export class MessageChannel {
+  private EE: EventEmitter;
+  // 实例id
+  private id: string;
+
+  constructor(private connect: Connect) {
+    this.EE = new EventEmitter();
+    this.id = uuidv4();
+    connect.onMessage((message) => {
+      // 判断消息是否为连接消息
+      if (message && typeof message === 'object') {
+        const data = message as { type: string; id: string };
+        // 判断实例
+        if (data.id == this.id) {
+          switch (data.type) {
+            case 'connect':
+              // 建立连接
+              break;
+            case 'message':
+              // 发送消息
+              break;
+          }
+        }
+      }
+    });
+  }
+
+  // 发送一次消息并接收结果
+  async send(message: unknown) {
+    return new Promise((resolve) => {
+      const callback = (message: unknown) => {
+        this.connect.onMessage(callback);
+        resolve(message);
+      };
+      this.connect.onMessage(callback);
+      this.connect.postMessage(message);
+    });
+  }
+
+  // 发送消息
+  postMessage(message: unknown) {
+    this.connect.postMessage({
+      type: 'message',
+      id: this.id,
+      data: message,
+    });
+  }
+}