This commit is contained in:
IndieKKY
2024-10-06 17:42:15 +08:00
parent 5ce146803e
commit 751961687b
6 changed files with 82 additions and 23 deletions

View File

@@ -29,12 +29,12 @@ const closeSidePanel = async () => {
} }
const methods: { 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() closeSidePanel()
}, },
[MESSAGE_TO_EXTENSION_ADD_TASK]: async (params, context) => { ADD_TASK: async (params, context) => {
// 新建任务 // 新建任务
const task: Task = { const task: Task = {
id: v4(), id: v4(),
@@ -49,7 +49,7 @@ const methods: {
return task return task
}, },
[MESSAGE_TO_EXTENSION_GET_TASK]: async (params, context) => { GET_TASK: async (params, context) => {
// 返回任务信息 // 返回任务信息
const taskId = params.taskId const taskId = params.taskId
const task = tasksMap.get(taskId) const task = tasksMap.get(taskId)
@@ -70,7 +70,7 @@ const methods: {
task, task,
} }
}, },
[MESSAGE_TO_EXTENSION_SHOW_FLAG]: async (params, context) => { SHOW_FLAG: async (params, context) => {
await setBadgeOk(context.tabId!, params.show) await setBadgeOk(context.tabId!, params.show)
}, },
} }

View File

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

View File

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

View File

@@ -21,7 +21,7 @@ const useMessaging = () => {
}, []) }, [])
const sendInject = useCallback(async <T = any>(method: string, params?: any): Promise<T> => { 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], tags: [TAG_TARGET_INJECT],
method, method,
params: params ?? {}, params: params ?? {},

View File

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

59
src/typings.d.ts vendored
View File

@@ -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' type MessageFrom = 'extension' | 'inject' | 'app'
interface MessageData { interface MessageData {