tmp

src/chrome/background.ts

@@ -29,12 +29,12 @@ const closeSidePanel = async () => {
 }
 
 const methods: {
-  [key: string]: (params: any, context: MethodContext) => Promise<any>
+  [K in AllExtensionMessages['method']]: (params: Extract<AllExtensionMessages, { method: K }>['params'], context: MethodContext) => Promise<any>
 } = {
-  [MESSAGE_TO_EXTENSION_CLOSE_SIDE_PANEL]: async (params, context) => {
+  CLOSE_SIDE_PANEL: async (params, context) => {
     closeSidePanel()
   },
-  [MESSAGE_TO_EXTENSION_ADD_TASK]: async (params, context) => {
+  ADD_TASK: async (params, context) => {
     // 新建任务
     const task: Task = {
       id: v4(),
@@ -49,7 +49,7 @@ const methods: {
 
     return task
   },
-  [MESSAGE_TO_EXTENSION_GET_TASK]: async (params, context) => {
+  GET_TASK: async (params, context) => {
     // 返回任务信息
     const taskId = params.taskId
     const task = tasksMap.get(taskId)
@@ -70,7 +70,7 @@ const methods: {
       task,
     }
   },
-  [MESSAGE_TO_EXTENSION_SHOW_FLAG]: async (params, context) => {
+  SHOW_FLAG: async (params, context) => {
     await setBadgeOk(context.tabId!, params.show)
   },
 }

src/messaging/layer2/ExtensionMessaging.ts

@@ -1,5 +1,5 @@
 import Layer1Protocol from '../layer1/Layer1Protocol'
-import { L2ReqMsg, L2ResMsg, MESSAGE_TO_EXTENSION_HANDSHAKE, MESSAGE_TO_EXTENSION_ROUTE } from '../const'
+import { L2ReqMsg, L2ResMsg } from '../const'
 
 type PortContext<L2ReqMsg, L2ResMsg> = {
   id: string
@@ -12,22 +12,22 @@ type PortContext<L2ReqMsg, L2ResMsg> = {
   tags?: string[] // 标签，用来筛选消息发送目标
 }
 
-type L2MethodHandler<L2ReqMsg, L2ResMsg> = (params: any, context: MethodContext, portContext: PortContext<L2ReqMsg, L2ResMsg>) => Promise<any>
-type L2MethodHandlers<L2ReqMsg, L2ResMsg> = {
-  [key: string]: L2MethodHandler<L2ReqMsg, L2ResMsg>
+type L2MethodHandler<M extends ExtensionMessage, K, L2ReqMsg, L2ResMsg> = (params: Extract<M, { method: K }>['params'], context: MethodContext, portContext: PortContext<L2ReqMsg, L2ResMsg>) => Promise<any>
+type L2MethodHandlers<M extends ExtensionMessage, L2ReqMsg, L2ResMsg> = {
+  [K in M['method']]: L2MethodHandler<M, K, L2ReqMsg, L2ResMsg>
 }
 
-class ExtensionMessaging {
+class ExtensionMessaging<M extends ExtensionMessage> {
   portIdToPort: Map<string, PortContext<L2ReqMsg, L2ResMsg>> = new Map()
-  methods?: L2MethodHandlers<L2ReqMsg, L2ResMsg>
+  methods?: L2MethodHandlers<M, L2ReqMsg, L2ResMsg>
 
   debug = (...args: any[]) => {
     console.debug('[Extension Messaging]', ...args)
   }
 
-  init = (methods: L2MethodHandlers<L2ReqMsg, L2ResMsg>) => {
-    const innerMethods: L2MethodHandlers<L2ReqMsg, L2ResMsg> = {
-      [MESSAGE_TO_EXTENSION_HANDSHAKE]: async (params: any, context: MethodContext, portContext: PortContext<L2ReqMsg, L2ResMsg>) => {
+  init = (methods: L2MethodHandlers<M, L2ReqMsg, L2ResMsg>) => {
+    const innerMethods: L2MethodHandlers<MessagingExtensionMessages, L2ReqMsg, L2ResMsg> = {
+      HANDSHAKE: async (params, context: MethodContext, portContext: PortContext<L2ReqMsg, L2ResMsg>) => {
         const tags = params.tags
         let tabId = params.tabId
 
@@ -44,7 +44,7 @@ class ExtensionMessaging {
         portContext.tags = tags
         portContext.ready = true
       },
-      [MESSAGE_TO_EXTENSION_ROUTE]: async (params: any, context: MethodContext) => {
+      ROUTE: async (params, context: MethodContext) => {
         return this.broadcastMessageExact([context.tabId!], params.tags, params.method, params.params)
       },
     }
@@ -59,17 +59,18 @@ class ExtensionMessaging {
       // 创建消息处理器
       const l1protocol = new Layer1Protocol<L2ReqMsg, L2ResMsg>(async (req: L2ReqMsg) => {
         const { tabId } = portContext
-        const method = this.methods?.[req.method]
+        const method = this.methods?.[req.method as keyof typeof this.methods]
+        console.log('msg>>>', tabId, req, method != null)
         if (method != null) {
           return method(req.params, {
             from: req.from,
             event: req,
             tabId,
             // sender: portContext.port.sender,
-          }, portContext).then(data => ({
+          }, portContext).then((data) => ({
             code: 200,
             data,
-          })).catch(err => {
+          })).catch((err) => {
             console.error(err)
             return {
               code: 500,

src/messaging/layer2/InjectMessaging.ts

@@ -69,9 +69,8 @@ class InjectMessaging {
         //握手
         this.l1protocol.sendMessage({
             from: 'inject',
-            method: MESSAGE_TO_EXTENSION_HANDSHAKE,
+            method: 'HANDSHAKE',
             params: {
-                type: 'inject',
                 tags: [TAG_TARGET_INJECT],
             },
         })
@@ -95,7 +94,7 @@ class InjectMessaging {
         if (method === 'setVideoInfo') {
             console.log('sendApp>>>', method, params)
         }
-        return this.sendExtension(MESSAGE_TO_EXTENSION_ROUTE, {
+        return this.sendExtension('ROUTE', {
             tags: [TAG_TARGET_APP],
             method,
             params,

src/messaging/layer2/useMessaging.ts

@@ -21,7 +21,7 @@ const useMessaging = () => {
     }, [])
 
     const sendInject = useCallback(async <T = any>(method: string, params?: any): Promise<T> => {
-        return await sendExtension(MESSAGE_TO_EXTENSION_ROUTE, {
+        return await sendExtension('ROUTE', {
             tags: [TAG_TARGET_INJECT],
             method,
             params: params ?? {},

src/messaging/layer2/useMessagingService.ts

@@ -77,7 +77,7 @@ const useMessagingService = (methods?: {
       // 初始化
       pmh.sendMessage({
           from: 'app',
-          method: MESSAGE_TO_EXTENSION_HANDSHAKE,
+          method: 'HANDSHAKE',
           params: {
               tabId,
               tags: [TAG_TARGET_APP],

src/typings.d.ts

@@ -1,3 +1,62 @@
+interface Message<T = any> {
+  method: string;
+  params: T;
+}
+
+interface ExtensionMessage<T = any> extends Message<T> {
+}
+
+interface InjectMessage<T = any> extends Message<T> {
+}
+
+interface AppMessage<T = any> extends Message<T> {
+}
+
+
+
+
+
+interface ExtensionHandshakeMessage extends ExtensionMessage<{ tabId?: number, tags: string[] }> {
+  method: 'HANDSHAKE';
+}
+
+interface ExtensionRouteMessage extends ExtensionMessage<{ tags: string[], method: string, params: any }> {
+  method: 'ROUTE';
+}
+
+type MessagingExtensionMessages = ExtensionHandshakeMessage | ExtensionRouteMessage
+
+
+
+
+
+
+interface ExtensionCloseSidePanelMessage extends ExtensionMessage<{}> {
+  method: 'CLOSE_SIDE_PANEL';
+}
+
+interface ExtensionAddTaskMessage extends ExtensionMessage<{ taskDef: TaskDef }> {
+  method: 'ADD_TASK';
+}
+
+interface ExtensionGetTaskMessage extends ExtensionMessage<{ taskId: string }> {
+  method: 'GET_TASK';
+}
+
+interface ExtensionShowFlagMessage extends ExtensionMessage<{ show: boolean }> {
+  method: 'SHOW_FLAG';
+}
+
+type AllExtensionMessages = ExtensionCloseSidePanelMessage | ExtensionAddTaskMessage | ExtensionGetTaskMessage | ExtensionShowFlagMessage
+
+interface MessageResponse<T = any> {
+  success: boolean;
+  data?: T;
+  error?: string;
+}
+
+
+
 type MessageFrom = 'extension' | 'inject' | 'app'
 
 interface MessageData {