7.0
热点
AI SCORE
开源项目2025-05-18 19:48
Chrome侧面板AI网页浏览Agent
Hacker News · github.com#Agent#Chrome#自动化
Editor brief · 编辑速览
开源项目在Chrome侧面板实现AI Agent，支持自动化网页交互和信息抽取。为自动化工作流提供新的交互入口。
你的浏览器内 AI 助手。用自然语言控制 Web。
**重要更新（2025 年 10 月 22 日）：**我（Parsa）已经停止开发 BrowserBee，请谨慎使用。如果你好奇原因，事情是这样的：我在 5 月开发 BrowserBee，是为了探索这样一种方案的有效性——将由 LLM 驱动的 Agent 直接嵌入浏览器，并赋予它广泛的工具权限，用来观察和操控网页。
此后，市面上陆续出现了多款“AI 浏览器”和浏览器扩展：Perplexity 的 Comet、OpenAI 的 Atlas、Anthropic 的 Claude for Chrome（不得不说，它看起来和 BrowserBee 相似得有些可疑！），以及许多规模较小的产品，当然还有 Chrome 中的 Gemini。The Browser Company 推出的 Dia 甚至以高价被收购。
不过，我停止开发 BrowserBee 的主要原因并不是这些，而是我逐渐意识到：这项技术——也就是让当前这一代 LLM 与网页交互——还没有真正成熟。在 DOM、截图等标准表示方式下，网页的信息密度比文档或代码低一个数量级，而文档和代码恰恰是 LLM 最擅长处理的内容。因此，要想让这类产品可靠工作，我们要么需要更优秀的网页表示方式，要么需要能力强得多的模型。让 LLM 通过操作 DOM 预订航班，有点像让它使用汇编语言开发 Web 应用。考虑到这个领域正在获得巨额投资，我们有理由期待未来几个月乃至几年内会出现不错的进展。
BrowserBee 是一款隐私优先的开源 Chrome 扩展，让你可以使用自然语言控制浏览器。它结合了 LLM 在指令解析与规划方面的能力，以及 Playwright 稳健的浏览器自动化能力，从而完成各种任务。
除了 LLM 之外，BrowserBee 完全在你的浏览器中运行，因此它可以安全地与已经登录的网站交互，例如你的社交媒体账号或电子邮箱，而不会牺牲安全性，也不需要后端基础设施。与市面上其他“browser use”类产品相比，这让它更适合个人使用，也更加方便。
browser_navigate 将浏览器导航到指定 URL。输入必须是完整 URL，例如 https://example.com
将浏览器导航到指定 URL。输入必须是完整 URL，例如 https://example.com
browser_wait_for_navigation 等待网络进入空闲状态（Playwright）。
browser_wait_for_navigation
等待网络进入空闲状态（Playwright）。
browser_navigate_back 返回上一页（history.back()）。无需输入。
browser_navigate_back
返回上一页（history.back()）。无需输入。
browser_navigate_forward 前往下一页（history.forward()）。无需输入。
browser_navigate_forward
前往下一页（history.forward()）。无需输入。
browser_get_active_tab 返回当前活动标签页的信息，包括其索引、URL 和标题。
browser_get_active_tab
返回当前活动标签页的信息，包括其索引、URL 和标题。
browser_navigate_tab 将指定标签页导航到某个 URL。输入格式：tabIndex|url（例如 1|https://example.com）
将指定标签页导航到某个 URL。输入格式：tabIndex|url（例如 1|https://example.com）
browser_screenshot_tab 按索引截取指定标签页的屏幕截图。输入格式：tabIndex[,flags]（例如 1,full）
browser_screenshot_tab
按索引截取指定标签页的屏幕截图。输入格式：tabIndex[,flags]（例如 1,full）
browser_click 点击元素。输入可以是 CSS selector，也可以是需要在页面上匹配的文本字面量。
点击元素。输入可以是 CSS selector，也可以是需要在页面上匹配的文本字面量。
browser_type 输入文本。格式：selector|text（例如 input[name="q"]|hello）
输入文本。格式：selector|text（例如 input[name="q"]|hello）
browser_handle_dialog 接受或关闭最近出现的 alert、confirm 或 prompt 对话框。输入 accept 或 dismiss。对于 prompt 对话框，可以追加 |text 来提供回复文本。
browser_handle_dialog
接受或关闭最近出现的 alert、confirm 或 prompt 对话框。输入 accept 或 dismiss。对于 prompt 对话框，可以追加 |text 来提供回复文本。
browser_get_title 返回当前页面标题。
返回当前页面标题。
browser_snapshot_dom 捕获当前页面的 DOM 快照，可配置 selector、clean、structure 和 limit 选项。
捕获当前页面的 DOM 快照，可配置 selector、clean、structure 和 limit 选项。
browser_query 针对你提供的 CSS selector，返回最多 10 段 outerHTML。
针对你提供的 CSS selector，返回最多 10 段 outerHTML。
browser_accessible_tree 返回 AX accessibility tree 的 JSON（默认仅返回 interesting 内容）。输入 all 可导出完整树。
browser_accessible_tree
返回 AX accessibility tree 的 JSON（默认仅返回 interesting 内容）。输入 all 可导出完整树。
browser_read_text 返回页面上的所有可见文本，并按照 DOM 顺序拼接。
返回页面上的所有可见文本，并按照 DOM 顺序拼接。
browser_screenshot 截取当前页面的屏幕截图，支持完整页面截图选项。
截取当前页面的屏幕截图，支持完整页面截图选项。
browser_move_mouse 将鼠标光标移动到绝对屏幕坐标。输入格式：x|y（示例：250|380）
将鼠标光标移动到绝对屏幕坐标。输入格式：x|y（示例：250|380）
browser_click_xy 在绝对坐标处单击鼠标左键。输入格式：x|y（示例：250|380）
在绝对坐标处单击鼠标左键。输入格式：x|y（示例：250|380）
browser_drag 使用鼠标左键进行拖放。输入格式：startX|startY|endX|endY（示例：100|200|300|400）
使用鼠标左键进行拖放。输入格式：startX|startY|endX|endY（示例：100|200|300|400）
browser_press_key 按下单个按键。输入为按键名称（例如 Enter、ArrowLeft、a）。
按下单个按键。输入为按键名称（例如 Enter、ArrowLeft、a）。
browser_keyboard_type 在当前焦点位置输入任意文本。输入就是要键入的文本字面量。使用 \n 表示换行。
browser_keyboard_type
在当前焦点位置输入任意文本。输入就是要键入的文本字面量。使用 \n 表示换行。
browser_tab_list 返回已打开标签页的列表，包括它们的索引和 URL。
返回已打开标签页的列表，包括它们的索引和 URL。
browser_tab_new 打开一个新标签页。可选输入为要导航到的 URL，否则打开空白标签页。
打开一个新标签页。可选输入为要导航到的 URL，否则打开空白标签页。
browser_tab_select 按索引将焦点切换到某个标签页。输入为 browser_tab_list 返回的整数索引。
按索引将焦点切换到某个标签页。输入为 browser_tab_list 返回的整数索引。
browser_tab_close 关闭标签页。输入为要关闭的标签页索引；留空时默认为当前标签页。
关闭标签页。输入为要关闭的标签页索引；留空时默认为当前标签页。
save_memory 保存如何在某个网站上完成特定任务的记忆。当你希望记住一段有用的操作序列，以供将来参考时，请使用此工具。
保存如何在某个网站上完成特定任务的记忆。当你希望记住一段有用的操作序列，以供将来参考时，请使用此工具。
lookup_memories 查找特定网站域名下存储的记忆。在网站上开始一项任务时，应将它作为第一步，检查是否存在可以复用的已保存模式。
查找特定网站域名下存储的记忆。在网站上开始一项任务时，应将它作为第一步，检查是否存在可以复用的已保存模式。
get_all_memories 获取所有域名下存储的全部记忆。当你想查看所有可用记忆时，请使用此工具。
获取所有域名下存储的全部记忆。当你想查看所有可用记忆时，请使用此工具。
delete_memory 根据 ID 删除某条记忆。当一条记忆不再有用或不再准确时，请使用此工具。
根据 ID 删除某条记忆。当一条记忆不再有用或不再准确时，请使用此工具。
clear_all_memories 清除存储的所有记忆。请谨慎使用，因为它会删除所有域名下的全部记忆。
清除存储的所有记忆。请谨慎使用，因为它会删除所有域名下的全部记忆。
**社交媒体管家：**检查你的社交媒体账号，汇总通知和消息，并协助你回复。
**新闻策展助手：**从你偏好的新闻来源和博客中收集并汇总最新头条，为你提供快速、个性化的简报。
**个人助理：**帮助处理日常任务，例如阅读和发送电子邮件及消息、预订航班、查找商品等。
**研究助理：**收集和整理信息，协助你深入研究公司、职位信息、市场趋势和学术出版物等主题。
**知识收藏与总结：**快速总结文章、提取关键信息，并保存有价值的洞见以供日后参考。
**与任意网站对话：**提出问题、生成摘要、填写表单等。
有关我们计划为 BrowserBee 添加的最新功能列表，请参阅 ROADMAP.md。
如果你有兴趣参与实现其中任何功能，或以任何方式改进 BrowserBee，请前往 CONTRIBUTING.md。有关测试基础设施和 CI/CD pipeline 的信息，请参阅 .github/WORKFLOWS.md。
你有三种方式可以安装 BrowserBee：
chrome://extensions/前往 chrome://extensions/
启用“Developer mode”（右上角的开关）
点击“Load unpacked”，然后选择解压后的目录
在弹出的选项页面中设置 Anthropic、OpenAI、Gemini 的 LLM API key，和/或配置 Ollama
npm install 或 pnpm install 安装依赖（大约需要 3 分钟）npm run build 或 pnpm build 构建扩展chrome://extensions/dist 目录前往 chrome://extensions/
启用“Developer mode”
点击“Load unpacked”，然后选择 dist 目录
在弹出的选项页面中设置 Anthropic、OpenAI、Gemini 的 LLM API key，和/或配置 Ollama
BrowserBee 现已登陆 Chrome Web Store 🎉
Alt+Shift+B，打开侧边栏由于 BrowserBee 使用 Chrome DevTools Protocol（CDP）连接标签页，最好让它始终连接到一个基础标签页，并在整个 session 期间保持该标签页开启（如果需要，BrowserBee 可以打开新标签页）。如果你关闭了已连接的标签页，请使用相应按钮重新连接到新的标签页。
每个 Chrome 窗口可以运行一个 BrowserBee 实例，各个实例彼此隔离运行。
BrowserBee 无法连接没有 URL 的标签页（例如新标签页），也无法连接 URL 以 chrome:// 或 chrome-extension:// 开头的标签页。
加入我们的 Discord 社区，与 BrowserBee 用户和开发者交流：
BrowserBee 使用了以下优秀的开源项目：
playwright-crx，用于在浏览器内使用 Playwrightplaywright-mcp，用于实现浏览器工具**在浏览器内运行 Playwright。**Playwright 为 LLM 与现代网站及 Web 应用交互提供了一套稳健、标准的接口。我见过的大多数“browser use”方案，例如 Browser Use 和 Playwright MCP，主要用于以“后端服务—浏览器”的方式远程控制浏览器。这种方式非常适合强大的企业自动化场景；而 @ruifigueira 已经证明，我们可以用浏览器扩展巧妙地封装 Playwright，从而降低面向终端用户场景的复杂度。
**“反思并学习”的记忆模式。**有些环境能够为 AI Agent 提供丰富的反馈，这正是其中之一。在这种环境中，Agent 不仅拥有大量可以与环境交互的工具，还具备强大的观察能力，能够理解自己的行为对环境产生了什么影响。
例如，当 Agent 的任务是完成一次商品购买时，它很可能可以借助不同工具——例如鼠标和键盘交互——通过不断尝试一路推进到最终目标。同时，通过定期截取屏幕截图，它通常也能判断任务是否已经成功完成。这里存在一种对 Agent 很有价值的学习信号。通过让 Agent 编码并记忆这些经验，我们可以提升它未来执行类似任务时的表现和效率，尤其是对规模更小、能力更弱的模型而言。
在我有限的测试中，如果记住最优的工具调用序列，有时可以将一项任务所需的 token 数量——进而包括成本——降低 5 倍甚至更多。
**与网页交互对 LLM 驱动的 Agent 来说仍然是一项艰巨任务。**DOM 和截图都是复杂、信息密度低的模态，LLM 处理起来速度慢、成本高，而且难度很大。以网页和一段代码作比较：平均而言，代码中的每个 token 所承载的信息量，要远高于 HTML 页面中的 token 或截图中的像素。因此，要让这类产品真正具备完全可行性，我们既需要巧妙简化的表示方式，也需要成本更低、速度更快的模型。
**为什么还要使用 LLM？**在这种场景下，LLM Agent 能提供的核心价值，是发现完成一项任务所需的路径或操作序列。这个序列随后可以被编码为一组工具调用，甚至直接编码成普通 JavaScript（参见 Playwright Codegen）。一旦操作序列已经明确，按部就班执行就很简单了——根本不再需要 LLM。
**隐私优先的个人 AI 工具才是正确方向。**毫无疑问，未来我们大多数人都会拥有某种始终在线的 AI 仆从。我认为，要安全地走到那一步，唯一的方式是依靠开源软件，让它以透明的方式与我们的数据和 LLM 交互。
这类软件还有广阔的构建空间，也存在能够支撑其发展的商业模式，例如提供托管版本。因此，我真的很希望看到并使用更多稳健的开源 AI 助手。