前端AI 应用本地部署【免费下载链接】FluentReadAn open-source browser extension for bilingual translation. 一款开源的浏览器双语翻译插件。项目地址https://gitcode.com/gh_mirrors/fl/FluentRead点击查看免费下载导读本文讲解 FluentRead一款开源双语翻译浏览器插件如何调用 Chrome 浏览器内置的本地翻译模型在不把文本上传到第三方服务的情况下完成本机文字翻译。你将掌握完整的操作路径——从在设置中选择“Chrome 内置翻译”、执行“准备 Chrome 本地翻译”到理解语言包下载、可用性判断和故障排查的底层逻辑同时我们会结合仓库源码provider 适配层、Offscreen 执行环境、设置页准备逻辑与配套测试说明每一步背后的实现原理帮助你判断该能力在特定设备与 Chrome 版本上是否可用以及不可用时该如何替换翻译服务。Chrome 内置翻译在 FluentRead 中的定位FluentRead 的翻译服务是高度可插拔的云端服务DeepL、Google、OpenAI 兼容接口等与本地能力并行注册于统一的 provider 体系。Chrome 内置翻译是其中的一种本地 provider其特点是翻译由 Chrome 浏览器在本机模型上完成文本不离开设备首次使用某个语言对时需要下载模型下载仍需联网可用性高度依赖 Chrome 版本、设备、浏览器策略与模型下载状态并非所有电脑都能使用全部语言。在源码中这一 provider 的实现位于 src/providers/translation/chrome-translator.tscreateChromeTranslator将统一的翻译请求转换为 Chrome Offscreen 消息并通过能力受约束的 Offscreen Document 执行浏览器本地翻译。该模块被设计为纯 provider 适配层不管理页面 DOM、UI 生命周期或配置持久化缓存、去重与超时总预算由翻译 broker 统一协调见 src/services/translation/broker.ts。值得注意的是浏览器能力检测层 对chromeTranslation能力做了严格限定只有在Manifest V3 且浏览器为 Chrome的构建目标下该能力才为真Chrome 产物即使被 Edge 加载也会在运行时通过 userAgent 检测关闭该能力applyRuntimeBrowserConstraints将 Edge 环境的chromeTranslation置为false。这意味着“Chrome 内置翻译”并不是一个可以无条件依赖的通用选项。准备语言完整操作步骤当你的桌面 Chrome 支持本地翻译且已准备相应语言时即可用浏览器内置模型在本机完成文字翻译。FluentRead 中的操作路径如下在设置中把翻译服务切换为Chrome 内置翻译并确认源语言与目标语言点击设置中的准备 Chrome 本地翻译按提示等待模型下载期间保持设置页打开准备完成后回到网页重新执行翻译。其中第 2 步并非“点了就下载”那么简单。在设置页组件 src/features/settings/ui/services/ServiceConfiguration.vue 中点击“准备 Chrome 本地翻译”会直接在当前点击上下文中调用prepareChromeTranslationInPage实现位于 src/features/settings/model/chromeTranslationPreparation.ts。这个函数有一个关键约束必须在 click handler 的第一个 await 之前同步调用因为 Chrome 的模型下载要求用户激活user activation一旦先 await 再创建模型下载请求就会失去激活状态。源码中prepareChromeTranslationInPage在首个 await 之前同时启动LanguageDetector.create与Translator.create正是为了确保两个下载请求都保留用户激活。准备过程分为三个阶段ChromePreparationPhaseinitializing初始化→downloading下载带进度百分比→verifying验证。下载阶段通过监听downloadprogress事件上报进度验证阶段则执行一轮确定性的自检用内置样本文本运行语言识别与翻译并要求识别置信度不低于MIN_CHROME_LANGUAGE_CONFIDENCE定义于 src/core/language/detect.ts值为0.4。如果检测语言与预期不一致会抛出detection-mismatch错误翻译结果为空则抛出invalid-translation错误。设置页会显示本次准备的语言对、下载百分比、当前阶段与错误详情准备成功后会在browser.storage.session中清除对应的待准备记录并显示“本次语言对已就绪”的状态相关文案见 src/core/i18n/messages/zh-CN.ts 中settings.services.chromePreparation.*一组。一次准备只对应当前语言组合这是最容易被忽略的要点一次准备只对应当前语言组合。换成另一种语言时可能需要再次准备。源码从两个层面落实了这一点Offscreen 执行端 src/app/offscreen/translation.ts 中translateWithChromeApi将请求的from/to语言码直接传给 ChromeTranslator.create({sourceLanguage, targetLanguage})模型实例按语言对创建设置页的准备逻辑同样按语言对工作resolveChromeTranslationPreparationPair会基于当前配置解析出确定的自检语言对语言目录 中列出了 Chrome 官方支持的 40 种语言含zh简体与zh-Hant繁体每种语言都有内置的验证样本文本。此外待准备状态会被持久化到浏览器 session 存储src/platform/browser/chromeTranslationPreparationRequest.ts 以源语言:目标语言为独立会话键保存最近请求供设置页读取、定向清除并跨上下文订阅变更。因此当你换了一组语言对时扩展能感知到这是新的语言对从而提示重新准备。自动源语言的注意点使用“自动源语言”from auto时Chrome 需要先运行语言检测模型确定原文语言再创建对应语言对的翻译模型。这意味着自动识别场景下检测模型与翻译模型都需要就绪准备与排查链路更长。源码对 auto 的处理非常谨慎在 Offscreen 端 src/app/offscreen/translation.ts 的translateWithChromeApi中只有当from auto时才调用detectChromeLanguage检测文本与带结构哨兵的翻译正文严格分离sourceLanguageDetectionText与text是两条独立数据避免把检测样本混入待翻译正文请求载荷构造 src/providers/translation/chromeTranslatorRequest.ts 中的buildChromeOffscreenTranslationData只在源语言为auto且提供了检测样本时才携带sourceLanguageDetectionText字段若检测器返回的语言不可靠置信度低于 0.4、结果为空或und扩展会抛出ChromeLanguageUndeterminedError提示“无法可靠识别源语言请增加文本长度或手动选择源语言”当 auto 模式遭遇NotAllowedError模型需要用户激活时扩展会给出专门提示请在设置中选择网页实际源语言并点击“准备 Chrome 本地翻译”后重试。实操建议使用自动源语言遇到问题时可以先在设置中明确指定原语言再重试准备与翻译。这既缩短了模型链路也让错误定位更直接。相关回归测试见 tests/chromeTranslatorLanguageRegression.test.ts其中验证了“auto 源语言下携带独立检测样本”“非 auto 时不携带样本”“请求级语言覆盖不被全局配置覆盖”等行为。显示不可用怎么办可用性受Chrome 版本、设备、浏览器策略、语言和下载状态多重因素影响不是每台电脑都能使用所有语言。原文档给出两条基本建议先检查网络与浏览器更新暂时无法准备时换用其他翻译服务继续阅读。源码将这一现实映射为一组结构化的错误语义错误场景处理方式浏览器不支持 Chrome 内置翻译provider 直接抛出“当前浏览器不支持 Chrome 内置翻译请在设置中切换翻译服务”模型需要用户激活NotAllowedError抛出preparation-required记录待准备语言对到 session 存储提示用户点击“准备 Chrome 本地翻译”模型/语言包不可用NotSupportedError、ChromeModelUnavailableError提示检查 Chrome 更新、网络与管理策略chrome://on-device-internals可查看模型下载状态单次文本超限QuotaExceededError提示缩短文本后重试模型未就绪/网络错误OperationError、NetworkError、InvalidStateError等提示稍后重试或检查网络连接这些错误映射集中在 Offscreen 端的friendlyChromeTranslationErrorsrc/app/offscreen/translation.ts与设置页的formatChromePreparationErrorsrc/features/settings/ui/services/ServiceConfiguration.vue中。设置页还额外提供了 Chrome 官方 Translator API 文档、Language Detector 文档、官方排错入口与 API 演示站点的快捷链接并在折叠面板中展示 Chrome 原始错误信息方便深入排查。一个重要边界首次下载仍需联网必须强调本地模型的首次下载仍然需要联网不能把尚未准备的语言当作已经离线可用。这一点在源码中体现得十分直接每次翻译请求的默认超时为300 秒5 分钟DEFAULT_CHROME_TRANSLATION_TIMEOUT_MS见 src/providers/translation/chrome-translator.ts注释明确“首次创建语言包可能包含下载”Offscreen 端通过availability()检查与downloadprogress监听区分unavailable / downloadable / downloading / available四种状态下载未完成时翻译不会就绪配套测试 tests/chromeTranslatorLanguageRegression.test.ts 验证了“为首次下载保留五分钟超时”的行为timeoutMs: 300_000。因此离线可用是“模型已下载且准备完成后”的结果而非“选了本地翻译就离线可用”。网络、策略与版本的多重限制Chrome 本地翻译的可用性还受浏览器策略约束例如企业策略可能禁用相关 API 或模型下载语言支持范围也以 Chrome 官方目录为准仓库中的 40 语言清单见 src/features/settings/model/chromeTranslationPreparation.ts。从源码结构看扩展自身不维护“哪些语言可用”的运行时判定而是把权威结果交给 Chrome 的availability()与create()调用——checkModelAvailability中availability仅作为兼容性提示未知实现抛错时仍让create()给出权威结论见 src/app/offscreen/translation.ts。这种设计避免了把语言目录当作运行时可用性的替代与源码注释中的声明一致。当你遇到持续不可用时可以按以下顺序排查确认当前浏览器确实是 Google ChromeEdge 加载的产物不会启用此能力检查 Chrome 版本是否满足 Translator API 的 stable 版本要求Offscreen 端在检测不到 API 时会提示“请确保使用 Google Chrome v138 stable 或更高版本”在chrome://on-device-internals查看模型下载状态检查浏览器更新与网络尤其首次下载检查是否存在组织策略限制仍无法准备时回到 FluentRead 设置中切换其他翻译服务继续阅读。从请求到译文一条完整的调用链为帮助理解“准备”之外的真实翻译路径这里给出源码中的完整调用链用户在网页触发翻译请求到达 provider 层 src/providers/translation/chrome-translator.ts 的createChromeTranslator该函数先校验message.origin翻译文本非空、capabilities.chromeTranslation为真随后用buildChromeOffscreenTranslationData构造载荷src/providers/translation/chromeTranslatorRequest.ts载荷通过CHROME_TRANSLATE_OFFSCREEN消息发送给 Offscreen Document消息路由见 src/app/offscreen/messageRouter.ts超时上限 300 秒并携带CANCEL_CHROME_TRANSLATE_OFFSCREEN取消消息以便中止Offscreen 端 src/app/offscreen/translation.ts 的translateWithChromeApi解析请求、必要时先做语言检测再调用 ChromeTranslator完成翻译优先translateStreaming流式接口其次translate并在finally中调用destroy()释放模型资源响应回到 provider校验requestId匹配后返回译文若返回preparation-required则把语言对写入待准备存储提示用户去设置页准备。整条链路中provider 层不直接触碰 Chrome API而是通过 platform 层的 Offscreen clientsrc/platform/offscreen/client.ts与消息路由器解耦这也解释了为什么“准备”必须在设置页完成——只有设置页的点击上下文能提供 Chrome 模型下载所需的用户激活。总结Chrome 内置翻译为 FluentRead 提供了一条完全本地的翻译路径选择服务、准备语言对、回到网页翻译三步即可完成。但它不是无条件的默认选项——语言组合、模型下载、Chrome 版本、设备与浏览器策略共同决定可用性首次下载仍需联网且每次准备只对应当前语言组合。理解这些边界并在不可用时及时切换其他翻译服务云端 provider 同样通过统一的 provider 注册表 接入是稳定使用该能力的关键。源码层面的调用链与错误映射也为深入排查提供了清晰的依据。赞分享前端AI 应用本地部署【免费下载链接】FluentReadAn open-source browser extension for bilingual translation. 一款开源的浏览器双语翻译插件。项目地址https://gitcode.com/gh_mirrors/fl/FluentRead点击查看免费下载相关推荐FluentRead 使用 Chrome 本地翻译语言准备、可用性排查与源码实现解析FluentRead 使用 Chrome 本地翻译语言准备、可用性排查与源码实现解析 导读 本文围绕 FluentRead一款开源的浏览器双语翻译插件中“前端AI 应用本地部署FluentRead 网页翻译语言排除机制解析从 Issue 627 简繁共存需求到不翻译语言配置落地FluentRead 网页翻译语言排除机制解析从 Issue 627 简繁共存需求到不翻译语言配置落地 这篇技术指南围绕 FluentRead开源双语翻译浏前端AI 应用本地部署如何搭建同花顺行业板块热点追踪面向量化新手的数据采集指南如何搭建同花顺行业板块热点追踪面向量化新手的数据采集指南 每次想看当天哪些板块在领涨都得手动打开行情页、逐页翻找、记下涨幅和成分股费时还容易漏。开源项目金融科技数据分析机器学习上一篇Leaflet-GeoSearch 项目常见问题解决方案下一篇Simple Form 与 Hotwire 集成现代化 Rails 表单的终极指南 创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考