一个简单的 Chrome 浏览器扩展,支持划词翻译功能,默认对接本地 Ollama,也可以连接任何兼容 OpenAI Chat Completions 协议的云端服务(如百度千帆、OpenAI、Moonshot 等),并支持流式实时显示。
下面给出扩展与 Ollama 的完整交互规范(请求字段、流式响应格式、示例请求/响应),以及一个简单的本地 Node.js 测试脚本,用来验证 Ollama /api/generate 的流式输出是否符合扩展的期望。
注意:此脚本假设你在本地运行 Ollama(默认地址 http://localhost:11434)并且 Node.js >= 18(包含全局 fetch)。
-
/api/tags (GET)
- 用途:侧边栏设置面板用来加载可用模型列表
- 示例:GET http://localhost:11434/api/tags
- 期望返回:JSON,包含
models数组,数组元素对象包含name或model字段
-
/api/generate (POST)
-
用途:生成(支持流式)文本,扩展以流式 NDJSON 为首选
-
请求头:Content-Type: application/json
-
请求体示例: { "model": "llama3:latest", "prompt": "<由扩展构造的 prompt,见 background.js 的 buildPrompt>", "stream": true }
-
流式响应(NDJSON,每行一个 JSON)示例: {"response":"Hello"}\n {"response":" world"}\n {"done":true}\n 扩展会把每一行解析为 JSON,累积
response字段的值并通过 long-lived port 将{ partial, cumulative }发送给 content/popup,结束时发送{ done: true, final: cumulative }。 -
非流式响应回退:如果响应不是流(
response.body不存在),扩展会尝试 parse JSON,读取response字段作为最终结果并返回。
-
-
curl 测试范例(不流式示例) curl -X POST 'http://localhost:11434/api/generate'
-H 'Content-Type: application/json'
-d '{"model":"llama3:latest","prompt":"Hello","stream":false}' -
本地 Node.js 测试脚本(流式 NDJSON 解析)
-
路径:
tools/ollama_test.js -
用法: node tools/ollama_test.js [apiBaseUrl] [model] [text] 例如: node tools/ollama_test.js http://localhost:11434 llama3:latest "这是一个测试,翻译成英文"
-
该脚本会把每个收到的增量
response打印为[PARTIAL],最终打印[DONE]及累计结果,行为与扩展后台的handleStreamResponse一致。
-
-
运行前提
- 本地运行 Ollama(或把
apiBaseUrl指向你的 Ollama 实例) - Node.js >= 18(若低版本,请安装 Node 18+ 或用 Python 脚本替代)
- 本地运行 Ollama(或把
-
确保已安装 Ollama 并运行服务:
ollama serve
-
下载或克隆此项目到本地目录
-
在 Chrome 浏览器中打开
chrome://extensions/ -
开启右上角的"开发者模式"
-
点击"加载已解压的扩展程序"
-
选择包含
manifest.json的项目目录
- 在任意网页上选择需要翻译的文本
- 鼠标释放后会自动显示翻译结果的提示框;或右键点击选区并选择“翻译 选中内容”手动触发
- 按 ESC 键或等待 3 秒可关闭提示框
点击浏览器工具栏中的扩展图标会打开固定在浏览器右侧的设置侧边栏(需要 Chrome 114+ 并允许扩展使用 Side Panel 权限),你可以在其中调整:
- 源语言:中文或英文
- 目标语言:中文或英文
- 模型:llama3、gpt-oss、qwen3-coder-30b(可扩展)
- API 地址:默认为
http://localhost:11434 - 服务类型:Ollama(本地)或 OpenAI / 兼容服务(云端)
- 生成参数:可调节 Temperature、Top P、Top K、Context Window、Max Tokens(num_predict) 等采样配置,分别作用于 Ollama
options与 OpenAI 请求体。其中 Max Tokens 会在请求前依据原文与当前模型特性自动调整(至少 512),思考/Reasoning 模型会额外预留 Token,面板中的数值作为上限参考 - OpenAI 模式下可额外配置:手动模型名称、API Key、自定义请求模板、额外请求头(JSON)
- 扩展内置请求头过滤,默认会去掉对本地 Ollama 的
Origin预检;如仍遇到 403,可考虑代理方案 - 侧边栏支持滚动、自动保存表单状态,适合在浏览网页时随时调整参数;如需更多空间,可展开“测试 ▾”分区获取调试反馈
- 在设置面板顶部把“服务类型”切换为 OpenAI / 其他。
- 将
API 端点填写为目标接口地址,例如https://qianfan.baidubce.com/v2/chat/completions。 - 在“模型”输入框中填入服务提供的模型 ID(例如
gpt-oss-20b)。 - 在 API Key 栏位填写密钥。如果服务要求完整的
Authorization值(含Bearer前缀),可以直接粘贴整串密钥;扩展会自动避免重复添加Bearer。 - 如需额外请求头(例如百度千帆的
appid),在 自定义 Headers 文本框输入 JSON 对象:{"appid": "你的 AppID"}。 - 若需要自定义请求体,可在“请求模板 (JSON)”中填入完整模板,并使用占位符:
{{model}}会被替换成当前模型名{{prompt}}会被替换成扩展生成的提示词{{messages}}代表[{"role":"user","content":prompt}]{{stream}}会被替换为true(若目标 API 不支持流式,可直接在模板中写死为false)- 新增的采样占位符:
{{temperature}}、{{top_p}}、{{top_k}}、{{num_ctx}}、{{num_predict}}
- 保存后,可在“测试 ▾”面板中输入一段文字并点击“执行测试翻译”快速验证连通性。测试请求同样会携带上方配置的自定义请求头。
确保 Ollama 服务运行在 http://localhost:11434,并已安装模型(如 gpt-oss、llama3 等):
ollama pull gpt-oss- 需要本地运行 Ollama 服务;若直连遇到 403,请确保 Ollama 的
OLLAMA_ORIGINS配置允许扩展 origin(或使用系统代理来转发请求)。 - 翻译结果将以流式方式实时显示,提示框会持续存在,点击页面其他区域或按 ESC 时关闭
如需修改代码,请编辑相应文件后重新加载扩展。