最近在使用 OpenCode 的时候，我希望它能够像 Codex Desktop 的 Computer Use / Chrome Extension 一样，直接控制我正在使用的 Chrome 浏览器。

目前官方的 Computer Use 和 Chrome Extension 在 Linux 上并不是完整可用的状态，不过通过 OpenCode 的 MCP 能力，我们可以使用 @opencode-ai/browser-control，在 Manjaro Linux 上实现类似的浏览器控制功能。

本文记录我实际配置和测试成功的过程。

一、最终实现的效果

配置完成后，可以直接在 OpenCode 中让 AI 操作 Chrome，例如：

打开网页
查看当前页面
获取网页标题和 URL
查找页面元素
点击按钮
输入文字
滚动页面
切换 Tab
操作当前 Chrome 浏览器

整体架构如下：

OpenCode
   │
   ▼
browser-control-mcp
   │
   ▼
Browser Control Relay
   │
   ▼
Chrome Extension
   │
   ▼
Chrome

与单纯使用 Playwright 启动一个新的 Chromium 不同，Browser Control 的一个重要特点是可以控制现有的 Chromium/Chrome 浏览器环境。

因此可以继续使用 Chrome 中已有的：

Cookie
登录状态
LocalStorage
当前打开的 Tab
Chrome Extension

也就是说，可以实现类似：

                  ┌── Cookie
                  ├── 登录状态
OpenCode          ├── LocalStorage
   │              ├── Chrome Extensions
   ▼              └── 当前 Tabs
Browser Control
   │
   ▼
Chrome

二、我的运行环境

本文使用的环境如下：

操作系统：Manjaro Linux
浏览器：Google Chrome
AI Agent：OpenCode
Browser Control：0.8.2
Chrome Extension：0.0.25
Extension Protocol：2
Node.js：22+

OpenCode 的配置文件是：

~/.config/opencode/opencode.jsonc

注意这里是：

opencode.jsonc

而不是：

opencode.json

三、为什么使用 Browser Control

OpenCode 本身支持 MCP，可以通过 MCP 扩展各种能力。

如果只是让 AI 访问网页，Playwright MCP 等方案已经可以满足很多需求。

但是我更希望实现的是：

让 OpenCode 控制我平时正在使用的 Chrome，而不是启动一个全新的、干净的 Chromium。

例如，我可能已经在 Chrome 中登录了某个网站：

Chrome
├── Google
├── GitHub
├── ChatGPT
├── 公司后台
└── 其他网站

如果启动一个全新的 Chromium，那么这些登录状态都不存在。

Browser Control 的意义就在于，它可以连接现有的浏览器环境，让 AI 操作真实的 Chrome。

四、安装前检查 Node.js

当前 @opencode-ai/browser-control 要求 Node.js 至少为 22.19。

首先检查：

node -v
npm -v

如果 Node.js 版本已经满足要求，就可以继续。

如果版本比较旧，可以使用 fnm 安装 Node.js 22。

安装 fnm：

curl -fsSL https://fnm.vercel.app/install | bash

重新打开终端后：

fnm install 22
fnm use 22

检查：

node -v

确保 Node.js 版本满足要求。

五、安装 Browser Control

使用 npm 全局安装：

npm install --global @opencode-ai/browser-control

安装完成后，可以检查：

which browser-control

以及：

which browser-control-mcp

例如：

/usr/bin/browser-control-mcp

说明 MCP Server 已经安装成功。

注意：不要直接运行 browser-control-mcp –help

browser-control-mcp 和普通 CLI 程序不太一样。

它实际上是一个 MCP stdio Server，启动后会等待 OpenCode 通过 stdin/stdout 使用 MCP JSON-RPC 协议与它通信。

因此不要使用：

browser-control-mcp --help

作为测试方法。

如果直接运行，很可能看到：

SyntaxError: Unexpected end of JSON input
    at JSON.parse (...)

这并不代表 Browser Control 安装失败。

正确的验证方式应该是通过 OpenCode 的 MCP 状态，或者使用 Browser Control 自己提供的诊断命令。

六、安装 OpenCode Skill

建议同时安装 Browser Control 对应的 OpenCode Skill：

npx skills add anomalyco/browser-control --skill browser-control -g

Skill 和 MCP 的作用是不一样的。

可以简单理解为：

Skill
  ↓
告诉 Agent 如何以及什么时候使用 Browser Control

MCP
  ↓
真正向 Agent 提供浏览器操作工具

七、安装 Chrome Extension

Browser Control 需要 Chrome Extension 与本地 Browser Control Relay 通信。

首先找到 Extension 目录：

printf '%s\n' "$(npm root --global)/@opencode-ai/browser-control/extension/dist"

例如可能得到：

/usr/lib/node_modules/@opencode-ai/browser-control/extension/dist

记住这个目录。

打开 Chrome Extension 管理页面

在 Chrome 地址栏输入：

chrome://extensions

打开右上角的：

Developer mode（开发者模式）

然后点击：

Load unpacked（加载已解压的扩展程序）

选择刚才得到的：

.../@opencode-ai/browser-control/extension/dist

目录。

安装完成后，可以把 Browser Control Extension 固定到 Chrome 工具栏，方便查看 Extension 状态。

八、启动 Browser Control Relay

Browser Control 使用一个本地 Relay 与 Chrome Extension 通信。

默认地址：

http://127.0.0.1:19989

这里有一个比较重要的地方：

正常使用不需要手动启动 Relay。

Browser Control 的 relay-backed CLI 命令会自动启动 detached Relay。

例如可以直接执行：

browser-control execute 'return { ok: true, title: await page.title(), url: page.url() }'

执行后，Relay 会自动启动。

然后查看状态：

browser-control status

如果正常，会看到类似：

Relay: http://127.0.0.1:19989 (0.8.2)
Extension: connected (0.0.25)
Extension protocol: 2 (compatible)
Active targets: 1

九、使用 doctor 检查环境

Browser Control 提供了 doctor 命令，可以检查整个运行环境：

browser-control doctor

正常情况下：

Status: ok

并且主要检查应该都是 [ok]。

例如：

[ok] package metadata
[ok] browser-control bin
[ok] browser-control-mcp bin
[ok] relay HTTP endpoint
[ok] relay build
[ok] extension connection
[ok] extension version
[ok] extension protocol
[ok] targets readable
[ok] sessions readable

我的实际测试结果中：

Relay: reachable (0.8.2)
Extension: connected (0.0.25), protocol 2 compatible
Targets: active=1
Sessions: total=1 connected=1

这说明 Browser Control 本身已经正常工作。

十、配置 OpenCode MCP

接下来把 Browser Control 接入 OpenCode。

OpenCode 配置文件：

~/.config/opencode/opencode.jsonc

打开：

nano ~/.config/opencode/opencode.jsonc

加入：

{
  "$schema": "https://opencode.ai/config.json",

  // 你的其他 OpenCode 配置
  // ...

  "mcp": {
    "browser-control": {
      "type": "local",
      "command": [
        "browser-control-mcp"
      ],
      "enabled": true
    }
  }
}

如果原来的 opencode.jsonc 已经有 mcp 配置，不要创建第二个 mcp，只需要加入：

"browser-control": {
  "type": "local",
  "command": [
    "browser-control-mcp"
  ],
  "enabled": true
}

例如原来已经有其他 MCP：

"mcp": {
  "其他-mcp": {
    "type": "local",
    "command": [
      "xxx"
    ]
  },

  "browser-control": {
    "type": "local",
    "command": [
      "browser-control-mcp"
    ],
    "enabled": true
  }
}

即可。

十一、重新启动 OpenCode

完全退出 OpenCode，然后重新启动：

opencode

进入 TUI 后，在右侧应该能够看到：

browser-control Connected

也可以使用：

/mcp

查看 MCP 状态。

正常情况下：

browser-control connected

到这里，整个 MCP 连接已经完成。

架构变成：

OpenCode
   │
   │ MCP
   ▼
browser-control-mcp
   │
   ▼
Browser Control Relay
   │
   │ WebSocket
   ▼
Chrome Extension
   │
   ▼
Chrome

十二、第一次测试

连接成功后，建议先进行简单测试。

在 OpenCode 中输入：

使用 browser-control 打开 https://example.com，
然后告诉我页面标题。

如果正常，Chrome 会打开 Example Domain，OpenCode 会读取页面并返回标题。

还可以测试当前页面：

使用 browser-control 查看当前 Chrome 页面，
告诉我当前页面的 URL 和 title。
不要修改页面内容。

十三、测试网页操作能力

接下来可以测试实际的网页操作。

例如：

使用 browser-control 打开百度首页，
搜索“OpenCode”，
然后告诉我搜索结果页面的标题。

这个过程会涉及：

打开网页
   ↓
读取页面
   ↓
找到搜索框
   ↓
输入文字
   ↓
点击/提交
   ↓
等待页面变化
   ↓
读取结果

如果整个过程都可以正常完成，说明 OpenCode 的 Browser Use 链路已经打通。

十四、验证当前 Chrome Tab

Browser Control 的一个重要能力是控制现有 Chrome。

先打开平时使用的 Chrome，并打开几个网页。

然后在 OpenCode 中输入：

使用 browser-control 查看我当前 Chrome 中已经打开的 Tab。
不要创建新的浏览器窗口。
告诉我每个 Tab 的标题和 URL。

如果 OpenCode 能够看到当前 Chrome 中已经打开的 Tab，就说明 Browser Control 已经能够访问实际的浏览器环境。

此时整个结构就是：

OpenCode
    │
    ▼
Browser Control
    │
    ▼
你的 Chrome Profile
    │
    ├── Cookie
    ├── 登录状态
    ├── LocalStorage
    ├── Chrome Extensions
    └── 当前 Tabs

这也是我选择 Browser Control 而不是单纯启动一个新 Chromium 的主要原因。

十五、重启电脑以后怎么使用？

配置完成以后，重启电脑不需要重新安装。

日常使用非常简单。

第一步：启动 Chrome

正常打开平时使用的 Chrome。

Chrome Extension 会自动加载。

第二步：启动 OpenCode

opencode

OpenCode 会启动：

browser-control-mcp
        ↓
Browser Control Relay
        ↓
Chrome Extension

Relay 会在需要的时候自动启动。

不需要手动执行：

browser-control serve

第三步：检查 MCP

进入 OpenCode 后：

/mcp

如果看到：

browser-control connected

就可以直接使用。

例如：

使用 browser-control 打开 GitHub。

或者：

查看当前 Chrome 页面，并告诉我页面标题。

所以以后正常使用的流程就是：

启动 Chrome
     ↓
启动 OpenCode
     ↓
/mcp 确认 connected
     ↓
直接让 AI 操作 Chrome

不需要重新安装 npm 包，也不需要重新加载 Chrome Extension。

十六、常见问题

1. `browser-control doctor` 显示 Relay stopped

例如：

Relay: stopped

一般不需要手动启动。

执行一次：

browser-control execute 'return { ok: true }'

它会自动启动 Relay。

然后再次检查：

browser-control status

2. `browser-control-mcp --help` 报 JSON.parse 错误

例如：

SyntaxError: Unexpected end of JSON input

这是因为 browser-control-mcp 是 MCP stdio Server，不是普通 CLI。

不要直接运行它进行测试。

应该通过 OpenCode：

/mcp

查看连接状态。

3. OpenCode 中显示 browser-control disconnected

首先检查：

browser-control status

然后：

browser-control doctor

如果看到：

Extension: disconnected

打开：

chrome://extensions

检查 Browser Control Extension 是否启用。

如果 Relay 正常而 Extension 没有连接，可以重新加载 Extension。

4. Browser Control 升级以后 Extension 版本不一致

升级 Browser Control 后：

npm update --global @opencode-ai/browser-control

建议重新执行：

browser-control doctor

重点检查：

extension version
extension protocol

如果出现版本不匹配，需要重新到：

chrome://extensions

加载新的：

.../@opencode-ai/browser-control/extension/dist

目录。

十七、几个常用命令

查看 Browser Control 版本

browser-control --version

查看运行状态

browser-control status

全面检查

browser-control doctor

执行 Browser Control

browser-control execute 'return { ok: true }'

查找 Chrome Extension 目录

printf '%s\n' "$(npm root --global)/@opencode-ai/browser-control/extension/dist"

OpenCode 配置文件

~/.config/opencode/opencode.jsonc

MCP 配置：

"mcp": {
  "browser-control": {
    "type": "local",
    "command": [
      "browser-control-mcp"
    ],
    "enabled": true
  }
}

十八、Browser Control 和 Playwright MCP 的区别

两者虽然都可以让 AI 操作网页，但侧重点不同。

项目	Browser Control	Playwright MCP
OpenCode MCP	✅	✅
浏览网页	✅	✅
点击	✅	✅
输入	✅	✅
DOM 操作	✅	✅
CDP	✅	✅
使用现有 Chrome	✅	可配置
使用现有登录状态	✅	取决于配置
当前 Chrome Tab	✅	通常需要额外配置
Chrome Extension	✅	通常不直接使用
更适合日常 Chrome	✅	△
更适合自动化测试	△	✅

如果需求是：

“让 AI 帮我自动化测试一个网站”

Playwright MCP 是非常合适的。

如果需求是：

“这是我平时使用的 Chrome，里面已经登录了很多网站，我希望 AI 直接帮我操作这个浏览器”

那么 Browser Control 更符合这个使用场景。

十九、使用时的安全注意事项

因为 Browser Control 可以操作真实 Chrome，所以它的权限实际上比一个全新的浏览器自动化环境更高。

例如 Chrome 中可能已经登录：

Google
GitHub
各种管理后台
邮箱
云服务
公司内部系统

因此不建议一开始就给 AI 下达涉及敏感操作的任务。

可以先从：

打开网页
读取页面
搜索内容
查看 Tab

这些低风险操作开始。

确认整个工作流程稳定以后，再逐步开放：

填写表单
提交数据
修改配置
删除内容

对于支付、账号安全、生产环境等敏感操作，建议始终人工确认。

二十、最终效果

配置完成后，我在 Manjaro Linux 上实现了下面这套架构：

                 ┌──────────────────────┐
                 │       OpenCode       │
                 │                      │
                 │     AI Agent / LLM   │
                 └──────────┬───────────┘
                            │
                            │ MCP
                            ▼
                 ┌──────────────────────┐
                 │  browser-control-mcp │
                 └──────────┬───────────┘
                            │
                            ▼
                 ┌──────────────────────┐
                 │ Browser Control      │
                 │ Relay :19989         │
                 └──────────┬───────────┘
                            │
                       WebSocket
                            │
                            ▼
                 ┌──────────────────────┐
                 │ Chrome Extension     │
                 └──────────┬───────────┘
                            │
                            ▼
                 ┌──────────────────────┐
                 │       Chrome         │
                 │                      │
                 │ Cookie / Session     │
                 │ Login / Tabs         │
                 │ Extensions           │
                 └──────────────────────┘

整个过程配置一次以后，日常使用非常简单：

opencode

然后在 OpenCode 中直接告诉 AI：

使用 browser-control 操作 Chrome……

即可。

对于目前希望在 Linux 上使用类似 Computer Use / Browser Use 能力的人来说，OpenCode + Browser Control 是一个非常实用的方案。

而且 OpenCode 的 MCP 架构并不依赖特定的模型供应商，因此即使 OpenCode 使用的是 OpenAI-compatible API 或其他模型服务，只要模型能够正常进行 Tool Calling，就可以把 Browser Control 作为 Agent 的浏览器工具使用。

一	二	三	四	五	六	日
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30