AI Bridge
让终端 AI 编程助手(如 DeepSeek)通过浏览器使用 Web AI 对话服务(豆包、ChatGPT)。
免责声明 本项目是一个技术实验,通过浏览器自动化实现终端 AI 与 Web AI 服务之间的通信桥接。用户应自行遵守各平台的使用规定。 本项目仅供个人学习和研究用途。如果你需要稳定可靠的 API 服务,建议使用各平台提供的官方 API——这不仅是对服务商的支持,也能获得更好的体验。 使用本项目产生的任何后果由用户自行承担。
工作原理
DeepSeek (OpenCode)
↕ MCP 协议 (stdio)
MCP Server (Node.js)
↕ WebSocket (localhost:9527)
Chrome 插件
↕ DOM 操作
豆包 / ChatGPT 网页
DeepSeek 遇到难题时,通过 MCP 工具发送问题。MCP Server 通过 WebSocket 指挥 Chrome 插件在 AI 聊天页面上操作——输入问题、等待回复、提取结果——然后返回给 DeepSeek。
功能特性
- 多平台支持:豆包、ChatGPT,通过调试面板可适配任意 AI 聊天网站
- 多实例支持:多个 OpenCode 实例可同时使用,通过主/副实例架构共享同一个 WebSocket 端口
- 会话管理:通过 sessionUrl 确保消息发到正确的对话
- 自动重连:插件断开后自动重连,MCP Server 端会等待重连而非直接报错
- 调试面板:页面上的浮动面板,可视化配置和测试 CSS 选择器与 DOM 操作
- 一键安装:
npx @soulchildtc/ai-bridge-mcp install自动配置 OpenCode
安装
1. 安装 MCP Server
方式一:通过 npx(推荐)
npx @soulchildtc/ai-bridge-mcp install
# 或指定 token
npx @soulchildtc/ai-bridge-mcp install my-secret-token
方式二:从源码安装
git clone https://github.com/soulchildtc/ai-bridge.git
cd ai-bridge
npm install
node mcp-server/index.js install
install 命令会:
- 安装 npm 依赖
- 显示要写入的配置并让你确认
- 自动写入
~/.config/opencode/opencode.jsonc(已有配置会合并,写入前自动备份)
2. 安装 Chrome 插件
- 打开
chrome://extensions - 右上角打开「开发者模式」
- 点击「加载已解压的扩展程序」,选择
chrome-extension目录
3. 配置选择器
项目内置了豆包和 ChatGPT 的默认配置,开箱即用,无需手动配置选择器。
打开豆包或 ChatGPT 页面时,调试面板会自动填充对应的选择器和操作方式。如果网站更新导致默认配置失效,可以按以下步骤重新配置:
- 打开豆包(doubao.com)或 ChatGPT(chatgpt.com)
- 点击页面右下角的蓝色 AI 按钮,打开调试面板
- 用 F12 开发者工具找到正确的 CSS 选择器,填入对应字段
- 点击「高亮」验证选择器是否匹配,点「测试」验证功能是否正常
- 确认无误后点击「保存配置」(保存后的配置优先于内置默认值)
其他 AI 平台(如智谱清言、Kimi 等)需要手动配置,参见下方「适配新平台」章节。
4. 启动使用
启动 OpenCode,插件会自动连接。DeepSeek-V4-Flash 遇到难题时可以让它调用 AI Bridge 向强模型求助。
MCP 工具
| 工具 | 说明 | |------|------| | check_connection | 检查与浏览器的连接状态 | | new_session | 新建咨询对话,返回 sessionUrl。如果上下文中已有 sessionUrl 应优先用 ask_ai | | ask_ai | 在已有对话中继续交流,需传入 sessionUrl 和 platform |
参数
new_session
message:咨询的问题platform:"doubao"或"chatgpt",默认"doubao"
ask_ai
message:继续对话的消息sessionUrl:new_session返回的会话 URLplatform:与new_session时一致
调试面板
在 AI 聊天页面点击右下角蓝色 AI 按钮打开,支持:
- 为每个字段选择操作方式(如输入方式:React Setter / execCommand / Paste)
- 高亮匹配的 DOM 元素
- 逐项测试每个功能
- 保存配置到 Chrome 存储(按域名隔离)
- 面板和按钮均可拖动
适配新平台
以添加智谱清言(chatglm.cn)为例:
第一步:修改 manifest.json
在 host_permissions 和 content_scripts.matches 中添加新域名:
"host_permissions": [
"https://www.doubao.com/*",
"https://chatgpt.com/*",
"https://chatglm.cn/*"
],
"content_scripts": [{
"matches": [
"https://www.doubao.com/*",
"https://chatgpt.com/*",
"https://chatglm.cn/*"
],
...
}]
第二步:修改 background.js
在 PLATFORM_URLS 中添加新平台:
const PLATFORM_URLS = {
doubao: { pattern: "https://www.doubao.com/*", openUrl: "https://www.doubao.com/chat/" },
chatgpt: { pattern: "https://chatgpt.com/*", openUrl: "https://chatgpt.com/" },
chatglm: { pattern: "https://chatglm.cn/*", openUrl: "https://chatglm.cn/" },
};
第三步:修改 index.js
在 MCP 工具的 platform 参数中添加新选项:
platform: z.enum(["doubao", "chatgpt", "chatglm"]).default("doubao")
搜索所有包含 z.enum 的地方(new_session 和 ask_ai 各一处),都加上新平台。
第四步:配置选择器
- 刷新插件,打开智谱清言网页
- 点击蓝色 AI 按钮,打开调试面板
- 用 F12 找到输入框、发送按钮、回复区域的 CSS 选择器
- 选择合适的操作方式(输入方式、生成完毕检测方式等)
- 逐项测试,确认无误后保存
第五步(可选):添加内置默认配置
在 chrome-extension/default-configs.js 中添加新平台的预设配置(content.js 和 debug-panel.js 共享此文件,只需改一处):
"chatglm.cn": {
input: { selector: "你找到的选择器", method: "react-setter" },
sendButton: { selector: "你找到的选择器", method: "click" },
responseArea: { selector: "你找到的选择器", method: "default" },
completionDetect: { selector: "", method: "text-only" },
newChat: { selector: "你找到的选择器", method: "click" },
newChatShortcut: "",
newChatUrl: "",
},
完成后,DeepSeek 就可以通过 platform: "chatglm" 使用智谱清言了。
多实例架构
OpenCode-1 → MCP Server(主实例,监听 9527)
↕
Chrome 插件
↕
OpenCode-2 → MCP Server(副实例,连接 9527)
OpenCode-3 → MCP Server(副实例,连接 9527)
- 第一个启动的 MCP Server 成为主实例,监听 WebSocket 端口
- 后续启动的自动切换为副实例,连接到主实例
- 请求通过 requestId 路由,互不干扰
- 同一时间只能处理一个 DOM 操作(浏览器页面串行)
日志
MCP Server 日志输出到 /tmp/ai-bridge.log:
tail -f /tmp/ai-bridge.log
Chrome 插件的日志通过 WebSocket 转发到同一个文件,也可以在聊天页面的 F12 控制台查看(搜索 [ai-bridge])。
配置
环境变量
| 变量 | 默认值 | 说明 | |------|--------|------| | AI_BRIDGE_MCP_TOKEN | 随机生成 | WebSocket 认证 Token,需与插件设置一致 | | SYNC_WS_PORT | 9527 | WebSocket 端口 | | AI_BRIDGE_LOG | /tmp/ai-bridge.log | 日志文件路径 |
已知问题与限制
多实例队列阻塞:多个 OpenCode 实例同时发起请求时,浏览器页面上的 DOM 操作是串行的(content.js 有请求队列)。如果实例 A 正在等待 ChatGPT 回复(可能需要几十秒),实例 B 的请求会排队等待,直到 A 完成。极端情况下可能触发实例 B 的 MCP 超时。
主实例退出后副实例无法工作:如果先启动的 OpenCode(主实例)退出,WebSocket 服务端随之关闭,副实例会断开连接。副实例会每 10 秒重试连接,但在主实例重新启动前无法工作。此时需要重启任意一个 OpenCode 来恢复。
自动打开的页面可能加载失败:当 AI 指定的平台页面未打开时,插件会自动打开。但如果页面加载较慢(特别是 ChatGPT),content script 可能未就绪。插件会尝试刷新页面重试,但仍有小概率失败。建议提前打开常用的 AI 聊天页面。
输入方式可能触发验证码:豆包使用 React Setter 注入文本,与人工输入的事件特征不同,可能触发验证码。通过验证后短时间内不会再触发。
ChatGPT 按钮状态异常:ChatGPT 偶尔出现回复完成后发送按钮仍停在"停止"状态的情况,导致下一次发送失败。刷新页面可恢复。
浏览器 Service Worker 生命周期:Chrome 的 Manifest V3 会在约 30 秒无活动后终止 Service Worker,WebSocket 连接随之断开。已通过 chrome.alarms 保活(每 10 秒检查)和自动重连缓解,但仍有极小概率出现短暂断连。MCP Server 端会等待最多 30 秒让插件重连。
单浏览器限制:同一时刻只能有一个浏览器实例连接 MCP Server。如果两个浏览器都安装了插件,会互相抢连接。
文件结构
ai-bridge/
├── mcp-server/
│ ├── package.json # Node.js 依赖
│ └── index.js # MCP Server + WebSocket + install 命令
└── chrome-extension/
├── manifest.json # 插件配置 (Manifest V3)
├── default-configs.js # 内置默认配置(新增平台只改这里)
├── background.js # WebSocket 客户端 + 消息路由 + 保活
├── content.js # DOM 操作 + Markdown 提取 + 请求队列
├── debug-panel.js # 调试面板 UI
├── popup.html # 设置页面
└── popup.js # 设置逻辑 + 连接状态显示





