前端【免费下载链接】kiss-translatorA simple, open source bilingual translation extension Greasemonkey script (一个简约、开源的 双语对照翻译扩展 油猴脚本)项目地址https://gitcode.com/gh_mirrors/ki/kiss-translator点击查看免费下载导读本文围绕 KISS Translator简约翻译项目的英文文档 README.en.md系统讲解这一开源双语对照翻译扩展与油猴脚本的完整能力从浏览器扩展与油猴脚本的安装方式、六大翻译场景、自定义快捷键到个人规则 订阅规则 全局规则的规则优先级体系再到自定义 API 与 Hook 的高级接入方案。读完本文你将掌握 KISS Translator 的日常使用、常见故障排查如 Ollama 接口测试失败以及基于 Custom API 接入任意翻译服务的完整实操路径并了解其源码级的实现原理。项目定位简约、开源、双语对照KISS Translator 是一个简约、开源的双语对照翻译扩展 油猴脚本其英文文档开篇即点明项目理念保持简单Keep it simple, smart与开放源代码。它不是一个单一定制功能的工具而是一套覆盖网页全文翻译、输入框翻译、划词翻译、悬停翻译、YouTube 字幕翻译等主流场景的翻译工作台。从仓库结构看项目的双形态交付体现在浏览器扩展形态以 public/manifest.json 为入口采用 Manifest V3content_scripts注入content.js并覆盖all_urls与file://*/*油猴脚本形态通过REACT_APP_CLIENTuserscript构建相关逻辑集中在 src/userscript.js以kiss-translator.user.js形式分发。文档明确建议优先使用浏览器扩展原因是扩展功能更完整本地语言识别、右键菜单等而油猴脚本会面临更多使用问题跨域问题、脚本冲突等。这一建议也与仓库的构建脚本分工一致pnpm build会同时产出 chrome、edge、thunderbird、firefox、web、userscript-ios 等多个目标见 package.json。六大核心翻译场景README 将项目能力归纳为覆盖常见翻译场景的完整矩阵下面结合源码逐一展开。1. 网页双语对照翻译这是项目的主打能力。它同时支持自动识别文本与手动规则两种模式自动识别模式绝大多数网站无需编写规则即可翻译完整手动规则模式可针对特定网站做极致优化。翻译结果支持富文本翻译与渲染尽量保留原文中的链接及其他文本样式同时提供仅显示译文隐藏原文的开关。翻译样式下划线、背景色等均可自定义相关默认样式定义在 src/config/styles.js。2. 输入框翻译通过快捷键即时将输入框内的文本翻译成其他语言对应的快捷键为AltI。该能力的核心实现在 src/libs/inputTranslate.js并有配套测试 inputTranslate.test.js 覆盖其行为。3. 划词翻译在任意页面划选文字即可打开翻译弹窗支持多服务对比翻译可用多种翻译服务同时翻译并对比结果英文词典查询内置 Bing、Youdao 等词典服务常量定义见 src/config/api.js 中的OPT_DICT_BING、OPT_DICT_YOUDAO收藏词汇可将生词保存到词汇本相关组件与状态管理位于 src/views/Selection/FavBtn.js 与 src/hooks/FavWords.js。4. 鼠标悬停翻译悬停到网页段落即可触发翻译toggle_hover_node动作相关实现可参考 src/hooks/MouseHover.js。5. YouTube 字幕翻译这是项目的特色功能之一能力包括支持任意翻译服务对视频字幕进行翻译并双语显示内置基础的字幕合并与断句算法提升翻译质量支持AI 断句功能进一步提升效果字幕样式可自定义。源码层面src/subtitle/ 目录是一套完整的字幕子系统包含 BilingualSubtitleManager.js双语字幕管理、YouTubeCaptionProvider.jsYouTube 字幕源、sentenceBreaker.js断句与 youtubeAiSegmentation.jsAI 断句并通过 src/injectors/xmlhttp.js 拦截字幕请求。manifest.json中也将injector-subtitle.js声明为仅在https://www.youtube.com/*下可访问的资源。6. 独立翻译窗与设置弹窗AltD打开独立翻译窗口AltK打开设置弹窗AltO打开完整设置页面为桌面网页外的场景提供灵活入口。支持的翻译服务与底层常量README 列出的翻译服务覆盖传统机器翻译与 AI 大模型两条路线在 src/config/api.js 中均有对应的标识常量与请求参数定义类别服务源码常量传统机器翻译Google、Microsoft、Tencent、Volcengine、DeepL/DeepLX、Baidu、Yandex 等AI 大模型OpenAI、Gemini、Gemini2OpenAI 兼容端点、Claude、DeepSeek、Ollama、Cerebras、Zai 等聚合平台OpenRouter、OrcaRouter、Requesty、ePhoneAI、APIMart、OpenCodeGo云平台/无服务器AzureAI、CloudflareAI、SiliconFlow、AliyunBailian、QwenMT浏览器内置BuiltinAIChrome 内置 Gemini AI 翻译同一文件中还定义了影响翻译性能的关键默认参数理解这些常量有助于你判断聚合翻译的行为边界DEFAULT_HTTP_TIMEOUT 30调用超时秒DEFAULT_FETCH_LIMIT 10最大并行请求/任务数DEFAULT_BATCH_INTERVAL 400批处理合并请求的等待延迟毫秒DEFAULT_BATCH_SIZE 20每次请求最多合并的 DOM 段落数DEFAULT_BATCH_LENGTH 10000每次请求的最大字符数DEFAULT_BATCH_CONCURRENCY 10同时执行的聚合批次数量DEFAULT_CONTEXT_SIZE 3AI 翻译的上下文历史条数上限。聚合批量的调度实现位于 src/libs/batchQueue.js它在batchInterval窗口内收集多个待翻译任务按batchSize/batchLength合并为一次请求同时为每个调用者保持独立的取消Abort能力——该文件的开头注释明确写着Batch requests while keeping each callers cancellation independent并有配套的压力测试 batchQueue.cancellation.test.js。安装指南扩展与油猴脚本双通道浏览器扩展推荐目标平台渠道Chrome含 Kiwi Android、Orion iOSChrome 网上应用店EdgeEdge 扩展商店FirefoxFirefox Add-onsAMOThunderbird项目 Releases 下载Safari文档标记为未提供Safari Mac/iOS 均未完成Chrome 系扩展的核心配置见 public/manifest.jsonMV3、service_worker后台、all_urlsfile://*/*内容脚本注入、storage/tts/contextMenus/scripting/declarativeNetRequest等权限并声明了clipboardRead为可选权限。图标资源位于 public/images/包含 16/32/48/128 四档尺寸。油猴脚本Chrome/Edge/Firefox配合 Tampermonkey / Violentmonkey 使用安装kiss-translator.user.js也可从 Greasy Fork 获取iOS Safari配合 Userscripts Safari 使用安装kiss-translator-ios-safari.user.js油猴脚本的设置页面地址为options.html网页版设置页。油猴脚本注意事项由于跨域限制脚本需要把目标 API 域名加入白名单否则无法发出请求这也正是 README FAQ 中填写的接口在油猴脚本不能使用的答案。自定义快捷键体系README 给出的默认快捷键如下快捷键功能AltQ切换翻译AltD打开独立翻译窗口AltK打开设置弹窗AltS打开翻译弹窗 / 翻译选中文字AltO打开设置页面AltI输入框翻译这些快捷键对应 public/manifest.json 中commands字段的toggleTranslate、openSeparateWindow、openTranbox、_execute_action等命令其中_execute_action的默认键为AltKtoggleTranslate为AltQopenTranbox为AltSopenSeparateWindow为AltD。修改快捷键的位置在浏览器自身的扩展管理页面Chrome 为chrome://extensions/shortcutsFirefox 为about:addons。油猴脚本场景下如需自定义按键映射可参考 src/libs/shortcut.js 与 src/hooks/Shortcut.js。翻译规则体系与网页可视化编辑规则优先级规则优先级从高到低为个人规则 订阅规则 全局规则其中全局规则优先级最低但地位重要——它是系统的兜底默认规则。规则的加载与合并逻辑可参考 src/libs/rules.js 与 src/hooks/Rules.js。在网页上直接编辑规则README 中文版详细描述了可视化规则编辑器的完整流程英文版简略此处依据中文版与仓库实现补充打开网页翻译面板点击「编辑网站规则」选择规则用途后点击「选取元素」在网页上点选锁定元素通过祖先路径调整层级比较不同定位候选及匹配数量点击「确认添加定位」加入草稿最后在主面板「保存规则」落地。也可以通过「手动添加」输入 CSS 选择器。其关键设计约束包括规则类型支持翻译目标、排除区域、根容器、保留原文、段落边界编辑器的修改、删除、撤销、重做只作用于当前草稿与预览点击「保存规则」后才写入本地并触发同步打开编辑器不会自动保存规则也不会改变「自动扫描页面」设置目标选择器并非翻译白名单需要严格指定时应「禁用」自动扫描删除一条定位不等于排除区域其他规则或自动扫描仍可能覆盖它未保存草稿时退出或重新读取规则会弹出「保存规则 / 不保存 / 继续编辑」选择保存失败或检测到外部冲突会保留草稿「预计翻译范围」基于草稿规则只做高亮预览、不发送翻译请求范围内部排除项与语言/长度过滤仍然生效「查看译文」才会执行真实翻译。该编辑器的前端实现位于 src/views/RuleEditor/其中 index.js 是主面板FloatingPanel.js 与 usePanelPosition.js 负责浮动面板与定位会话与存储分别由 ruleEditorSession.js、ruleEditorStorage.js 承担。文档同时说明可视化选取目前支持桌面普通 DOM 网页及其动态内容iframe、Shadow DOM 内部、Canvas 文字与触屏专用操作暂未纳入不同源页面共享的 GM 存储没有跨源原子事务保证编辑器检测到外部变更时会提示重新读取油猴同源页面通过浏览器 Web Locks 协调写入。自定义 API 与 Hook接入任意翻译服务README 将自定义接口定位为理论上可以接入任何翻译接口并指向独立的接口文档 custom-api_v2.md。这套机制的核心是默认接口规范 双 HookRequest Hook / Response Hook。默认接口规范无需 Hook非聚合翻译的请求体与响应体// Request body { text: hello, // 需要翻译的文本 from: auto, // 原文语言 to: zh-CN // 目标语言 } // Response二选一 { text: 你好, src: en } { text: 你好, from: en }聚合翻译的请求体与响应体// Request body { texts: [hello], from: auto, to: zh-CN } // Response [ { text: 你好, src: en } ] // v2.0.4 起也支持 { translations: [ { text: 你好, src: en } ] }只要接口的请求/返回符合上述规范就无需编写任何 Hook。Prompt 占位符与类型Hook 中可替换的占位符包括{{from}}、{{to}}语言名称、{{fromLang}}、{{toLang}}语言代码、{{text}}、{{tone}}风格、{{title}}、{{description}}等Prompt 类型分为systemPrompt聚合翻译 System Prompt、nobatchPrompt非聚合 System Prompt、nobatchUserPrompt非聚合 User Prompt、subtitlePrompt字幕翻译 System Prompt。在源码中src/config/prompt.js 定义了line/xml/json三种聚合协议PROMPT_PROTOCOL_LINE/XML/JSON并管理着 batch system prompt、user prompt、subtitle prompt、dictionary prompt 四类模板的预设列表。两个实战 Hook 示例Ollama开启聚合翻译URL 为http://localhost:11434/v1/chat/completionsasync (args) { const body { model: gemma3, // 或 args.model messages: [ { role: system, content: args.systemPrompt }, { role: user, content: JSON.stringify({ targetLanguage: args.toLang, segments: args.texts.map((text, id) ({ id, text })), }), }, ], temperature: 0, max_tokens: 20480, stream: false, }; return { url: args.url, body, headers: { Content-type: application/json }, method: POST }; }; async ({ res, parseAIRes }) { return { translations: parseAIRes(res?.choices?.[0]?.message?.content) }; };注意文档明确提示 Ollama 需要设置环境变量OLLAMA_ORIGINS*才能允许浏览器跨域访问详见 FAQ 的 403 排查并可用systemctl show ollama | grep OLLAMA_ORIGINS验证环境变量是否生效。硅基流动禁用聚合翻译URL 为https://api.siliconflow.cn/v1/chat/completionsasync (args) { const body { model: tencent/Hunyuan-MT-7B, // 或 args.model messages: [ { role: system, content: args.systemPrompt }, { role: user, content: args.userPrompt }, ], temperature: 0, max_tokens: 20480, }; return { url: args.url, body, headers: { Content-type: application/json, Authorization: Bearer ${args.key} }, method: POST, }; }; async ({ res }) { return { translations: [[res?.choices?.[0]?.message?.content || ]] }; };语言代码约定Hook 参数中toLang/fromLang是插件标准语言代码to/from是转换为特定接口适用的代码若你的接口与标准代码表不一致需要自行映射custom-api_v2.md 内附 36 种语言的标准代码表从en、zh-CN、zh-TW到vi等。OpenCode 会话请求头内置OpenCodeGo接口会自动添加x-opencode-session请求头同一页面、同一接口配置与 URL 的请求复用一个随机 ID覆盖聚合、非聚合、流式、字幕及摘要请求刷新页面或 SPA 地址变化后开始新会话ID 不包含页面地址、原文或 API Key。使用 OpenAI 兼容接口接入 OpenCode 或需要手动指定会话 ID 时可在 Request Hook 中构造并清理同名请求头async (args, req args.req) { const sessionId 8fd946a1-bb92-4aa6-9766-724c9e435832; const headers { ...req.headers }; for (const name of Object.keys(headers)) { if (name.toLowerCase() x-opencode-session) delete headers[name]; } headers[x-opencode-session] sessionId; return { ...req, headers }; };字幕请求不执行 Request Hook如需为字幕手动指定 ID应在自定义请求头中配置 JSON如{x-opencode-session:...}内置接口会保留这个显式配置。常见问题排查FAQ 精要接口Ollama 等测试失败README 归纳了四类典型原因与对策地址填错例如 Ollama 有原生接口地址与 OpenAI 兼容地址本项目统一支持 OpenAI 兼容地址http://localhost:11434/v1/chat/completions不支持 Ollama 原生接口地址某些 AI 模型不支持聚合翻译可禁用聚合翻译或改用自定义接口参考 custom-api_v2.md某些 AI 模型参数不一致如 Gemini 原生接口参数不一致、部分模型版本不支持某些参数导致报错可通过 Hook 修改请求 body或更换为Gemini2OpenAI 兼容地址服务器跨域限制403如 Ollama 需在启动时设置OLLAMA_ORIGINS*。规则优先级个人规则 订阅规则 全局规则全局规则作为兜底。快捷键设置在浏览器扩展管理页设置Chrome 为chrome://extensions/shortcutsFirefox 为about:addons。油猴脚本接口不可用需要把目标 API 域名加入脚本白名单connect等授权否则请求无法发出。跨客户端数据同步与关联项目项目支持通过KISS-WorkerCloudflare/Docker 自部署或WebDAV实现跨客户端数据同步相关实现集中在 src/hooks/Sync.js 与 src/libs/sync.js另有大量验收测试如 SyncRollbackSerialization.acceptance.test.js验证同步的健壮性。同步服务采用自己部署、自己管理、数据私有的模式可同时用于分享个人私有规则列表。此外社区订阅规则由独立的 kiss-rules 仓库维护提供最新最全的订阅规则列表。开发指南与外部触发构建流程git clone https://gitcode.com/gh_mirrors/ki/kiss-translator.git cd kiss-translator git checkout dev # 提交 PR 建议推送到 dev 分支 pnpm install pnpm build项目使用 pnpm 管理依赖见 pnpm-lock.yamlpnpm build内部会依次执行版本同步src/scripts/sync-version.mjs、格式化以及build:chrome、build:edge、build:thunderbird、build:firefox、build:web、build:userscript-ios、build:rules等多个目标构建见 package.json。版本号管理机制可参考 VERSION_MANAGEMENT.md。config-overrides.js用于 react-app-rewired 的自定义配置。外部触发事件网页环境可以通过派发自定义事件与扩展交互README 给出了完整动作清单// toggle_translate 切换翻译 // toggle_styles 切换样式 // toggle_popup 打开/关闭控制面板 // toggle_transbox 打开/关闭翻译弹窗 // toggle_hover_node 翻译鼠标悬停段落 // input_translate 翻译输入框 window.dispatchEvent(new CustomEvent(kiss_translator, {detail: { action: toggle_translate }}));事件名常量在 src/config/msg.js 中定义EVENT_KISS_INNER kiss_translator_inner用于插件沙箱/内容脚本内部通信EVENT_KISS_TRANSLATOR kiss_translator暴露给网页环境。这意味着任何网页开发者都可以通过一行dispatchEvent在页面内触发翻译为第三方页面深度集成提供了公开入口。未来规划方向README 明确了项目后续的功能方向其中已完成标记[x]的有聚合发送文本优化请求策略、减少接口调用、提升性能、增强富文本翻译、强化自定义/AI 接口流式传输、上下文记忆、多轮对话、英文词典备灾机制翻译服务失效时 fallback 到本地词典、优化 YouTube 字幕支持改进流式字幕合并、减少断句。规划中标记[ ]的方向包括边缘 AI 计算本地轻量 LLM/ASR/OCR/TTS、分布式共享平台、文档翻译TXT/PDF/图片/漫画、自研翻译 Agent 以及使用现代框架的整体项目重构。结语KISS Translator 的价值在于简约而不简单它以一套统一的接口抽象同时驾驭传统机器翻译与 AI 大模型用聚合批量和流式传输优化翻译体验以可扩展的自定义 API 与 Hook 保持了对任意翻译服务的接入能力。无论是作为日常网页翻译工具、YouTube 字幕双语工具还是作为研究翻译工具链如何抽象多接口的参考实现它都提供了清晰的落地路径与完整的开源源码可供深入。赞分享前端【免费下载链接】kiss-translatorA simple, open source bilingual translation extension Greasemonkey script (一个简约、开源的 双语对照翻译扩展 油猴脚本)项目地址https://gitcode.com/gh_mirrors/ki/kiss-translator点击查看免费下载相关推荐KISS Translator 简约翻译开源双语对照翻译扩展与油猴脚本完整实战指南KISS Translator 简约翻译开源双语对照翻译扩展与油猴脚本完整实战指南 导读 本文围绕 README.md https://link.gitco前端KISS Translator简约开源的双语对照翻译扩展与油猴脚本实战指南KISS Translator简约开源的双语对照翻译扩展与油猴脚本实战指南 KISS Translator简约翻译是一个开源的浏览器翻译扩展与 Greas前端揭秘gh_mirrors/ag/agentset核心技术从向量存储到LLM集成的完整架构解析揭秘gh_mirrors/ag/agentset核心技术从向量存储到LLM集成的完整架构解析 gh_mirrors/ag/agentset是一个开源RAG平台创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考