企业官网建设流程全解析

• 人工智能
• AI 应用
• AI 写作
• 媒体生成
• 工作流自动化
• 网页爬虫
• 浏览器控制

Beav 是一款开箱即用的小红书 AI 运营工作台，除了采集、素材库和 AI 写作之外，它还能让 AI Agent 真正操控你的 Chrome 浏览器。本文带你拆解 Beav 浏览器 AI 控制的完整链路：桌面端 AI 如何通过MCP协议下发指令、经Native Host桥接进程转发、最终由Chrome 扩展在真实页面上完成点击、输入与截图。

如上图，Beav 的 Agent 会自主执行「检查选题库 → 搜索小红书候选内容 → 生成选题」这类跨页面任务，期间多次调用浏览器工具。这一切看起来像魔法，本质却是一条清晰可查的四级链路。

全景：Agent 操控浏览器的 4 跳链路

Beav 没有让 AI 直接碰浏览器，而是拆成四个各司其职的环节：

用一句话概括：App AI → MCP server → native-host socket → Chrome extension → page，这条链路正是 Plugin/README.md 里定义的控制面合同。

第一跳：AI 工作台如何"拿到"浏览器工具

桌面端启动时会自动注册一个名为Beav Browser Control的 MCP server（browser_control_mcp.rs#L8-L11），它通过 stdio 指向 App 自身的兼容模式，不需要用户手动导入任何 MCP 配置。

对 Agent 而言，浏览器能力被归一化成了一个 facade：打开/跳转标签页、DOM 快照、元素查询、点击、输入、滚动、截图……都以operation参数的形式出现，而 MCP 和 Native Host 只是背后的适配层（Plugin/README.md#L60）。Rust 侧维护了一份明确的白名单ENABLED_TOOLS（约 60 个工具，见 browser_control_mcp.rs#L13-L77），AI 只能调用授权范围内的能力。

第二跳：MCP 服务——AI 的"浏览器工具箱"

MCP（Model Context Protocol）是 AI 调用外部工具的标准协议。开发态的 mcp-server.mjs 实现了协议里最核心的两个方法：

• tools/list：向 AI 报菜单——「我会tabs.list、page.click、page.domSnapshot、page.screenshot……」，每个工具带输入 schema（mcp-server.mjs#L148-L151）
• tools/call：AI 点单后，把请求打包成 JSON-RPC 转发给 Native Host 的本地 socket（mcp-server.mjs#L152-L173）

这里有个值得学习的设计：MCP server 本身不直接操作浏览器，它只做协议转发和参数校验。工具清单优先从 Native Host 实时拉取，拉取失败才退回本地FALLBACK_TOOLS兜底（mcp-server.mjs#L180-L192），保证菜单永远和能力源一致。

第三跳：Native Host——串起桌面与浏览器的桥

这是整条链路里最"巧"的一环。Chrome 扩展无法被桌面进程随意唤起，但 Chrome 提供了一个官方机制Native Messaging：扩展可以启动一个外部程序，并通过 stdin/stdout 与它安全通信。

Beav 的 host.mjs 同时扮演着双面人：

1. 面向 Chrome：作为 native messaging host 启动，读取 4 字节长度前缀 + JSON 的消息格式（host.mjs#L388-L417），并在 com.redbox.browser_control.json 中声明allowed_origins，只接受指定扩展 ID 的连接
2. 面向桌面：在本地开一个 unix socket（Windows 上是命名管道），用换行分隔的 JSON-RPC 接收 MCP server / Agent 客户端的请求（host.mjs#L333-L373）

转发时它做了两件关键小事（host.mjs#L193-L225）：

• ID 重映射：socket 侧的请求 ID 换成agent:N转发给扩展，响应再按原 ID 回传，避免两侧 ID 空间冲突
• 超时看门狗：默认 60 秒未完成即返回明确的超时错误，AI 不会无限挂起

反向通道同样重要：扩展端的 CDP 事件、下载状态、会话生命周期事件会经publishBrowserEvent（host.mjs#L124-L138）回传给桌面端，让 AI 能"感知"页面变化，而不是只能单向发令。

安装这一步由 install-native-host.mjs 自动完成，还会自动发现已加载的 Beav 扩展 ID，用户无需手写 manifest。

第四跳：Chrome 扩展——在真实页面上动手

指令抵达扩展后台（service worker）后，browserControlBackground.js 是总调度。连接与自愈逻辑在 nativeTransport.js：chrome.runtime.connectNative建立长连接，断开后每 5 秒自动重连（nativeTransport.js#L78-L116），这保证了浏览器重启、扩展更新后链路能自动恢复。

具体页面操作走「内容脚本动态注入」：AI 控制脚本browserControlContent.js不常驻页面，只在收到指令时才注入目标标签页（dynamicContentInjection.js#L1-L4），注入后通过消息通道执行 DOM 快照、点击、输入、滚动等动作（dynamicContentInjection.js#L12-L83）。需要更底层能力时（如截图、网络事件、文件选择器），则走 CDP（Chrome DevTools Protocol）通道（cdpTransport.js）。

所有命令统一经过 commandRouter.js 的路由表分发，每一步都产生可回放的路由事件（开始/成功/失败/耗时），这让"AI 刚才到底做了什么"变得完全可审计。

安全护栏：动作分级与审批机制

AI 操控浏览器最大的风险是误操作。Beav 在 browserPolicy.js 里给每个动作打了等级标签：

• observe / navigate：读页面、跳转——自由通行
• local_filter：改页面但不影响远端状态（如键盘输入）——本地放行
• state_changing：执行脚本、修改远端状态（如表单提交）——必须持有审批 token（browserPolicy.js#L42-L47）

危险信号也会被显式识别：中英文的「保存、提交、发布、删除、改价、退款」等文本（browserPolicy.js#L1），以及Page.crash、Storage.clearDataForOrigin这类破坏性 CDP 方法（browserPolicy.js#L3）都会被策略层重点对待。此外，被 AI 纳入会话的标签页会显示「Beav 控制中」角标，任务finalize后自动关闭或交还用户——你随时知道哪个页面正被 Agent 使用。

Agent 视角的 API：像 Playwright，但更克制

对编程的 Agent 来说，Beav 提供了 Codex 同款的对象式入口（browser-client.mjs）：browser.tabs.new()建页、tab.goto(url)导航、tab.playwright.locator(selector)定位元素、tab.screenshot()截图、browser.tabs.finalize()收尾。官方文档 docs/browser-runtime.md 还写明了"纪律"：先看 DOM 快照再截图、点击前先确认定位器唯一、任务结束必须 finalize——这套规范显著降低了 AI 的"幻觉操作"概率。

快速上手与自检

🔧 想要验证本机链路是否健康，插件目录提供了三个诊断命令（Plugin/README.md#L84-L90）：

1. pnpm diagnose:browser-control—— 检查 native host manifest、launcher 和 socket 状态
2. pnpm agent:call -- --method host.getInfo—— 直连 socket 验证桥接进程
3. pnpm smoke:browser-control—— 用临时 Chromium profile 做端到端回归

常见故障（如 GUI Chrome 的 PATH 找不到 Node 导致 host 启动即退出）在 docs/browser-troubleshooting.md 中有系统排查步骤。

总结

Beav 的浏览器 AI 控制是一个教科书级的分层设计：

• MCP 管"说什么"——标准化 AI 的工具调用协议
• Native Host 管"走哪条路"——利用 Chrome 官方 Native Messaging 打通桌面与浏览器的安全边界
• 扩展管"怎么做"——动态注入 + CDP 双通道执行真实页面操作
• Policy 管"能不能做"——动作分级、审批 token、危险方法拦截

每一层都可以独立诊断、独立重启、独立失败，链路断在任何一跳，AI 都会收到明确的错误而非静默超时。这也是"开箱即用"背后真正的工程含量所在。

• 人工智能
• AI 应用
• AI 写作
• 媒体生成
• 工作流自动化
• 网页爬虫
• 浏览器控制