ScriptCat架构深度解析5大执行上下文与消息通信机制揭秘【免费下载链接】scriptcatScriptCat, a browser extension that can execute userscript; 脚本猫一个可以执行用户脚本的浏览器扩展项目地址: https://gitcode.com/gh_mirrors/sc/scriptcatScriptCat作为一款现代化的浏览器用户脚本管理器不仅完全兼容Tampermonkey生态更通过创新的多进程架构和消息通信机制实现了脚本执行的安全隔离与高性能通信。本文将从技术架构角度深入剖析ScriptCat的核心设计原理揭示其如何通过五大执行上下文和统一消息层构建出一个分布式脚本执行系统。传统脚本管理器瓶颈→多进程隔离架构传统用户脚本管理器面临的核心挑战在于脚本执行的安全性与性能平衡。单一执行环境下的脚本隔离不足容易导致脚本间的相互干扰而过度隔离又会带来通信效率问题。ScriptCat采用Manifest V3规范下的多进程架构将扩展功能拆分为五个独立的执行上下文每个上下文运行在隔离的JavaScript环境中通过精心设计的消息通道进行通信。五大执行上下文的技术分工上下文入口文件执行环境能力核心职责Service Workersrc/service_worker.ts无DOM环境拥有chrome.*特权API中央枢纽脚本CRUD、权限验证、资源缓存、路由分发Content Scriptsrc/content.ts隔离的内容脚本世界桥接Service Worker与页面脚本提供安全隔离层Inject Scriptsrc/inject.ts页面主世界可访问unsafeWindow执行用户脚本直接与页面DOM交互Offscreen Documentsrc/offscreen.ts具备DOM能力的后台页面处理DOM相关操作Blobs、剪贴板、DOM解析、本地存储Sandbox (iframe)src/sandbox.ts沙盒化的iframe环境安全执行后台/定时脚本支持cron调度跨进程通信难题→统一消息层抽象在多进程架构中高效的跨上下文通信是系统设计的核心挑战。ScriptCat通过packages/message模块抽象了浏览器原生通信API提供了两种通信模式请求/回复RPC和发布/订阅广播。传输层抽象设计ScriptCat定义了多种传输实现每种针对特定的通信场景进行优化// Service Worker端引导示例 const message new ExtensionMessage(true); // backgroundPrimary true const server new Server(serviceWorker, message); // RPC监听器action前缀serviceWorker/ const messageQueue new MessageQueue(); // pub/sub广播总线传输层实现矩阵类名连接场景底层APIExtensionMessageSW ↔ Content/Inject/Offscreenchrome.runtime.sendMessage/onConnectCustomEventMessageContent ↔ InjectDOMCustomEvent分发WindowMessageOffscreen ↔ Sandboxwindow.postMessageServiceWorkerMessageSendSW → Offscreen (Chrome)clients.matchAll()postMessageMessageQueue广播状态变更chrome.runtime.sendMessageEventEmitter3RPC与Pub/Sub的双重通信模式请求/回复RPC模式适用于需要明确响应的操作如获取脚本值、执行特权API调用。每个RPC调用通过唯一的action字符串标识如script/installServer实例根据action前缀路由到相应的处理程序。// SW端注册 class ValueService { init(/* … */) { this.group.on(getScriptValue, this.getScriptValue.bind(this)); this.group.on(setScriptValues, this.setScriptValues.bind(this)); } } // 调用端 const value await client.do(value/getScriptValue, { uuid });发布/订阅广播模式用于状态变更通知任何关心特定主题的上下文都可以订阅变更事件。这种方式避免了频繁的请求/回复开销特别适合数据一致性维护。// 订阅脚本删除事件 this.mq.subscribeTDeleteScript[](deleteScripts, async (data) { for (const { storageName } of data) { const stillUsed await this.scriptDAO.find((_, s) getStorageName(s) storageName); if (stillUsed.length 0) await this.valueDAO.delete(storageName); } });GM API系统设计→权限验证与跨域通信ScriptCat的GM_*API系统是其兼容性的核心每个API调用实际上是一个小型客户端通过跨上下文转发到特权处理程序然后流式返回结果。API注册与权限验证机制ScriptCat使用装饰器模式注册API通过GMContext.API装饰器将方法映射到对应的grant权限声明// API注册装饰器实现 class GMContext { static API(param: ApiParam {}) { return (target, propertyName, descriptor) { const follow param.follow ?? propertyName; // 真实的grant权限 GMContextApiSet(follow, propertyName, descriptor.value, param); if (param.alias) GMContextApiSet(param.alias, param.alias, descriptor.value, param); // GM_x ↔ GM.x }; } }跨浏览器平台兼容性处理ScriptCat在Chrome和Firefox上的实现存在重要差异主要体现在Offscreen API的处理上Chrome使用Offscreen API创建隐藏文档通过ServiceWorkerMessageSend进行通信FirefoxMV3事件页面本身就具备DOM能力直接扮演Offscreen角色// 跨平台兼容性处理 const hasOffscreenDocument typeof chrome.offscreen?.createDocument function; if (hasOffscreenDocument) { const offscreen new ServiceWorkerMessageSend(); // Chrome: 与真实offscreen文档通信 new ServiceWorkerManager(server, messageQueue, offscreen).initManager(); setupOffscreenDocument(); // chrome.offscreen.createDocument(...) } else { const offscreen new EventPageOffscreenManager(message); // Firefox MV3: 事件页面即DOM环境 new ServiceWorkerManager(server, messageQueue, offscreen).initManager(); }数据持久化策略→分层存储架构ScriptCat采用分层数据存储架构针对不同数据特性和访问模式设计了多种存储后端存储后端选择矩阵存储类型适用场景技术实现RepoT复杂实体关系管理基于IndexedDB的对象存储DAOT简单键值对存储基于chrome.storage的键值存储OPFSRepo大文件/二进制数据基于Origin Private File System的文件存储数据一致性保障机制通过MessageQueue的发布/订阅机制ScriptCat确保了跨上下文的数据一致性。当脚本数据发生变化时Service Worker会广播变更事件所有相关上下文同步更新本地缓存// 数据变更广播示例 this.mq.publish(scriptUpdated, { scriptId: uuid, changes: { enabled: false, lastModified: Date.now() } }); // 其他上下文订阅更新 this.mq.subscribeScriptUpdate(scriptUpdated, (update) { this.localCache.update(update.scriptId, update.changes); });测试策略→模拟消息总线的单元测试ScriptCat的架构设计支持全面的单元测试通过MockMessage实现内存中的消息总线模拟无需浏览器环境即可测试跨上下文通信逻辑// 使用MockMessage进行单元测试 const mockMessage new MockMessage(); const server new Server(test, mockMessage); const client new Client(mockMessage); // 注册处理程序 server.group(test).on(echo, (params) ({ echo: params.message })); // 测试RPC调用 const result await client.do(test/echo, { message: Hello }); expect(result.echo).toBe(Hello);测试分层策略测试类型工具栈测试重点单元测试Vitest happy-dom服务逻辑、消息处理、数据操作集成测试真实MessageQueue Mock DAO跨服务协作、状态同步E2E测试Playwright 真实Chromium完整用户流程、浏览器API交互扩展开发模式→基于现有架构点的增量演进ScriptCat的架构设计支持模块化扩展开发者可以基于现有的扩展点进行功能增强无需重新发明轮子扩展模式决策树新增跨上下文消息选择现有服务的Group添加this.group.on(newAction, handler)新增广播事件使用this.mq.publish(newTopic, payload)发布状态变更新增持久化实体根据数据特性选择匹配的存储后端Repo/DAO/OPFSRepo新增GM API使用GMContext.API装饰器注册遵循权限验证流程新增服务根据服务类型选择对应的上下文和依赖注入模式架构演进原则ScriptCat遵循修复根本原因的工程原则避免使用as any类型断言和错误吞没。系统倾向于直接替换而非适配器三明治模式保持每个模块的职责单一和接口清晰。这种设计使得系统在保持向后兼容性的同时能够持续演进和优化。通过深入理解ScriptCat的五大执行上下文架构、统一消息层抽象、GM API系统设计和分层存储策略开发者可以更好地利用这一强大的脚本管理平台构建安全、高效、可扩展的用户脚本解决方案。该架构不仅解决了传统脚本管理器的性能和安全瓶颈还为未来的功能扩展奠定了坚实的技术基础。【免费下载链接】scriptcatScriptCat, a browser extension that can execute userscript; 脚本猫一个可以执行用户脚本的浏览器扩展项目地址: https://gitcode.com/gh_mirrors/sc/scriptcat创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考