diff --git a/src/chrome/background.ts b/src/chrome/background.ts index 1c79c7d..5cc3ca4 100644 --- a/src/chrome/background.ts +++ b/src/chrome/background.ts @@ -29,12 +29,12 @@ const closeSidePanel = async () => { } const methods: { - [key: string]: (params: any, context: MethodContext) => Promise + [K in AllExtensionMessages['method']]: (params: Extract['params'], context: MethodContext) => Promise } = { - [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) }, } diff --git a/src/messaging/layer2/ExtensionMessaging.ts b/src/messaging/layer2/ExtensionMessaging.ts index 164ab5e..34c1667 100644 --- a/src/messaging/layer2/ExtensionMessaging.ts +++ b/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 = { id: string @@ -12,22 +12,22 @@ type PortContext = { tags?: string[] // 标签,用来筛选消息发送目标 } -type L2MethodHandler = (params: any, context: MethodContext, portContext: PortContext) => Promise -type L2MethodHandlers = { - [key: string]: L2MethodHandler +type L2MethodHandler = (params: Extract['params'], context: MethodContext, portContext: PortContext) => Promise +type L2MethodHandlers = { + [K in M['method']]: L2MethodHandler } -class ExtensionMessaging { +class ExtensionMessaging { portIdToPort: Map> = new Map() - methods?: L2MethodHandlers + methods?: L2MethodHandlers debug = (...args: any[]) => { console.debug('[Extension Messaging]', ...args) } - init = (methods: L2MethodHandlers) => { - const innerMethods: L2MethodHandlers = { - [MESSAGE_TO_EXTENSION_HANDSHAKE]: async (params: any, context: MethodContext, portContext: PortContext) => { + init = (methods: L2MethodHandlers) => { + const innerMethods: L2MethodHandlers = { + HANDSHAKE: async (params, context: MethodContext, portContext: PortContext) => { 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(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, diff --git a/src/messaging/layer2/InjectMessaging.ts b/src/messaging/layer2/InjectMessaging.ts index b0bae73..c83afe4 100644 --- a/src/messaging/layer2/InjectMessaging.ts +++ b/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, diff --git a/src/messaging/layer2/useMessaging.ts b/src/messaging/layer2/useMessaging.ts index 167f3f1..4f5259b 100644 --- a/src/messaging/layer2/useMessaging.ts +++ b/src/messaging/layer2/useMessaging.ts @@ -21,7 +21,7 @@ const useMessaging = () => { }, []) const sendInject = useCallback(async (method: string, params?: any): Promise => { - return await sendExtension(MESSAGE_TO_EXTENSION_ROUTE, { + return await sendExtension('ROUTE', { tags: [TAG_TARGET_INJECT], method, params: params ?? {}, diff --git a/src/messaging/layer2/useMessagingService.ts b/src/messaging/layer2/useMessagingService.ts index 6afa067..069ab45 100644 --- a/src/messaging/layer2/useMessagingService.ts +++ b/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], diff --git a/src/typings.d.ts b/src/typings.d.ts index 67fe0d6..84e759f 100644 --- a/src/typings.d.ts +++ b/src/typings.d.ts @@ -1,3 +1,62 @@ +interface Message { + method: string; + params: T; +} + +interface ExtensionMessage extends Message { +} + +interface InjectMessage extends Message { +} + +interface AppMessage extends Message { +} + + + + + +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 { + success: boolean; + data?: T; + error?: string; +} + + + type MessageFrom = 'extension' | 'inject' | 'app' interface MessageData {