OpenSider：让浏览器驱动 Agent

OpenSider 是一个开源免费的浏览器插件（扩展程序），用于将本机 CLI Agent 集成到浏览器侧边栏，让你在浏览器窗口中直接与 Agent 无缝对接工作。

项目地址（欢迎安装体验和Star🙏）：github.com/parksben/op...

前阵子在做几款线上产品的调研，需要对技术选型、服务报价、限制条款等因素做多维度的横向比较和分析。这些信息往往散落在多个网页上，得把它们一页页读完，再整理成一张可以横向对比的表。

这类工作最适合交给本机的 AI Agent 去做。我平时用 Claude Code 和 Codex，改代码、写脚本都很顺。

真正卡住我的是一件很小的事：它看不到我浏览器里已经打开的那十几个标签页，也不知道我在这些页面中实际的访问/操作状态。

为此我试过三条路，但各自均有不小短板：

方案	复用真实浏览器	对话入口	跨页操作
Playwright / CDP	✗ 另起干净浏览器，登录态与表单带不过去	终端或脚本	需自行编排流程
各家官方插件	✓	编辑器侧边	受插件能力限制，且绑定自家模型
Browser MCP	✓	终端	每打开一个页面都要补一条指令

三条路都能走通，但都极不顺手。归根到底，它们都止步于一个问题：Agent 缺的不是智能，而是对用户浏览上下文的感知与还原。

于是有了 OpenSider

想清楚之后，我把两者的关系倒了过来：不让 Agent 去够浏览器，而是让浏览器把当前访问的网页信息和状态交给 Agent。

做法是让浏览器当客户端、本机 Agent 当执行器。浏览器把 "用户在看什么" 主动塞给 Agent，让 Agent 结合这个信息来决定下一步做什么。为了让 Agent 更丝滑地操作网页，浏览器也需要未 Agent 提供一系列的工具。

基于这个思路，在 AI 的加持下，我落地了一个开源的浏览器插件：OpenSider

基于这个插件，原来的很多需要在浏览器网页和 Agent UI 来回跳转的工作变得相当简单（只需要在浏览器中直接给 Agent 下达指令，Agent 便能跟你在同一个浏览器上下文工作），Agent 操作网页的能力也大大提升（通过插件提供的 API，Agent 可以在已加载的多个网页间跳转、切换来执行任务，不需要每次工具调用都冷启一个浏览器窗口或标签）。

下面分五个部分介绍这个插件的主要构成：

一、产品形态

插件安装并开启后，浏览器侧边栏中可选择本地已安装的 Agent(CLI) 进行聊天（所有支持 ACP 协议的 Agent 均可连接，如 Claude Code CLI、Github Copilot CLI、OpenCode CLI 等等）。

插件的本质是一个连接层：通过 ChatUI 让用户可以直接与本地 Agent 对话，同时将浏览器状态信息实时同步到会话的上下文中，让 Agent 与用户看到 "同一套页面"。

二、使用方式

插件的使用仅需三步：

安装插件（给你正在使用的 Agent 发送安装提示词）；
启动插件以连接本地 Agent；
在 ChatUI 中直接与 Agent 对话。

仍以最初的那次产品调研为例，我在浏览器侧边栏里输入：

「帮我把 A/B/C 这几家产品的定价页都看一遍，出一张横向对比的表格。」

Agent 会自动切到对应标签页，读取定价、套餐等信息，生成对比表并输出结果。整个过程不需要复制链接、切换终端，也不需要重新登录页面。

三、主要功能

复用真实浏览器状态： 站点的用户身份（登录态）、填写的表单状态都会保留复用，不需要重新还原现场。
就地开始协同： 当前在哪个页面，Agent 就结合这个页面的信息工作。也可以拾取网页元素进行提问。
网页自动化： 页面跳转、读取、点击、填表、截图等操作作为工具注入给 Agent，自动化操作在网页中实时呈现（模拟鼠标点击、键盘输入等）。
Agent和模型均可自由切换： 支持一键切换 Agent/模型，同一会话中也可使用不同的 Agent，不受终端工具束缚。
数据、产物均存本地： 会话数据、Agent 产物内容均保存在本地，可以重复使用。

四、技术原理

核心方案： 基于 Chrome Native Messaging Host 实现浏览器与本地 Agent 的桥接：侧边栏连接时启动，断开时退出，进程不常驻。这层 Host 通过 ACP 协议拉起你选择的 CLI，并把网页自动化工具经由同一连接暴露给 Agent。全程不需要额外的后台服务。

插件和页面之间的通信也没有定义新协议，而是直接基于文件通信。一轮完整的交互流程：

插件将浏览器标签页等信息写入工作区下的多个文件
Agent 实时读取这些文件，掌握页面内容和可操作控件
Agent 需要操作页面时，向 commands/ 目录写入指令
插件执行指令，把结果写回 results/

对 Agent 而言，操作一个网页和读写一个文件没有本质区别。

五、安装 OpenSider

为了兼顾不同平台（MacOS/Windows/Linux等系统）和具体的运行环境，OpenSider 没有将安装工具固化为发布产物，而是提供了一个线上 Skill 和一系列的工具脚本（含二进制文件）给 Agent。

仅需将一段安装提示词发给你常用的 Agent 应用，便可在 Agent 的操作引导下完成插件的安装：

text 复制代码

帮我安装 OpenSider 浏览器扩展。
请先读取 https://raw.githubusercontent.com/parksben/opensider/main/skills/opensider/SKILL.md，按其安装流程执行。