消息通讯

packages/message/client.ts

@@ -0,0 +1,32 @@
+export function sendMessage(action: string, params?: any): Promise<any> {
+  return new Promise((resolve, reject) => {
+    chrome.runtime.sendMessage({ action, data: params }, (res) => {
+      if (res.code) {
+        console.error(res);
+        reject(res.message);
+      } else {
+        resolve(res.data);
+      }
+    });
+  });
+}
+
+export function connect(action: string, params?: any): Promise<chrome.runtime.Port> {
+  return new Promise((resolve) => {
+    const port = chrome.runtime.connect();
+    port.postMessage({ action, data: params });
+    resolve(port);
+  });
+}
+
+export class Client {
+  constructor(private prefix: string) {
+    if (!this.prefix.endsWith("/")) {
+      this.prefix += "/";
+    }
+  }
+
+  do(action: string, params?: any): Promise<any> {
+    return sendMessage(this.prefix + action, params);
+  }
+}

packages/message/message_queue.ts

@@ -1,12 +1,12 @@
-import { ApiFunction } from "./server";
+import { connect } from "./client";
+import { ApiFunction, Server } from "./server";
 
 export class Broker {
   constructor() {}
 
   // 订阅
-  subscribe(topic: string, handler: (message: any) => void) {
-    const con = chrome.runtime.connect({ name: topic });
-    con.postMessage({ action: "subscribe", topic });
+  async subscribe(topic: string, handler: (message: any) => void) {
+    const con = await connect("messageQueue", { action: "subscribe", topic });
     con.onMessage.addListener((msg: { action: string; topic: string; message: any }) => {
       if (msg.action === "message") {
         handler(msg.message);
@@ -24,6 +24,10 @@ export class Broker {
 export class MessageQueue {
   topicConMap: Map<string, { name: string; con: chrome.runtime.Port }[]> = new Map();
 
+  constructor(api: Server) {
+    api.on("messageQueue", this.handler());
+  }
+
   handler(): ApiFunction {
     return ({ action, topic, message }: { action: string; topic: string; message: any }, con) => {
       if (!con) {
@@ -53,7 +57,10 @@ export class MessageQueue {
     }
     list.push({ name: topic, con });
     con.onDisconnect.addListener(() => {
+      let list = this.topicConMap.get(topic);
+      // 移除断开连接的con
       list = list!.filter((item) => item.con !== con);
+      this.topicConMap.set(topic, list);
     });
   }
 

packages/message/server.ts

@@ -5,18 +5,22 @@ export class Server {
 
   constructor(private env: string) {
     chrome.runtime.onConnect.addListener((port) => {
-      const handler = (msg: { action: string }) => {
+      const handler = (msg: { action: string; data: any }) => {
         port.onMessage.removeListener(handler);
-        this.connectHandle(msg.action, msg, port);
+        this.connectHandle(msg.action, msg.data, port);
       };
       port.onMessage.addListener(handler);
     });
 
     chrome.runtime.onMessage.addListener((msg, sender, sendResponse) => {
-      this.messageHandle(msg.action, msg, sender, sendResponse);
+      this.messageHandle(msg.action, msg.data, sender, sendResponse);
     });
   }
 
+  group(name: string) {
+    return new Group(this, name);
+  }
+
   on(name: string, func: ApiFunction) {
     this.apiFunctionMap.set(name, func);
   }
@@ -45,3 +49,22 @@ export class Server {
     }
   }
 }
+
+export class Group {
+  constructor(
+    private server: Server,
+    private name: string
+  ) {
+    if (!name.endsWith("/")) {
+      this.name += "/";
+    }
+  }
+
+  group(name: string) {
+    return new Group(this.server, `${this.name}${name}`);
+  }
+
+  on(name: string, func: ApiFunction) {
+    this.server.on(`${this.name}${name}`, func);
+  }
+}