零门槛打造AI自动化网页助手：从安装到实战的完整指南

Nanobrowser作为一款开源的多智能体浏览器自动化工具，通过内置Chrome扩展实现网页自动化操作，能帮助用户解放双手处理重复任务，轻松实现智能网页浏览与信息提取。无论是日常办公中的数据收集，还是复杂的网页交互流程，这款AI网页助手都能提供高效支持。

一文读懂Nanobrowser的核心价值

在信息爆炸的时代，手动处理网页信息不仅耗时还容易出错。Nanobrowser的出现，以AI多智能体协作的方式，让网页自动化变得简单高效。它能模拟人工操作，完成网页导航、元素点击、数据提取等任务，极大提升工作效率。无论是职场人士还是开发者，都能通过它快速实现网页自动化，将更多精力投入到创造性工作中。

3分钟完成环境检查：确保顺利安装

在开始安装Nanobrowser前，需确认你的环境满足以下要求：

• 浏览器：Chrome 或 Edge 最新版，以保证扩展功能正常运行。
• 网络：可访问互联网，用于下载扩展和相关依赖。
• 开发环境（可选）：若从源码构建，需安装Node.js v22.12.0+和pnpm v9.15.1+。

3种安装方案对比：选择最适合你的方式

方案一：Chrome商店一键部署（推荐新手）

1. 打开Chrome浏览器，访问Chrome Web Store中的Nanobrowser扩展页面。
2. 点击"添加到Chrome"按钮，在弹出的确认对话框中选择"添加扩展"。
3. 安装完成后，扩展图标将出现在浏览器工具栏，若未显示，可在工具栏右侧的"拼图"图标中找到并固定。

方案二：手动部署最新版本（尝鲜用户）

1. 从GitCode仓库下载最新发布的nanobrowser.zip文件。
2. 将ZIP文件解压到任意文件夹，如Documents/nanobrowser。
3. 打开Chrome浏览器，访问chrome://extensions/，开启右上角"开发者模式"开关。
4. 点击"加载已解压的扩展程序"，选择解压后的文件夹并确认添加。

方案三：从源码构建（开发者选项）

1. 克隆仓库：git clone https://gitcode.com/GitHub_Trending/na/nanobrowser，然后进入项目目录cd nanobrowser。
2. 安装依赖：pnpm install。
3. 构建扩展：pnpm build，构建完成的文件在dist目录，按方案二的步骤3 - 4加载。开发模式可使用热重载：pnpm dev。

5分钟配置流程：连接你的AI模型

步骤1：打开设置面板

点击浏览器工具栏的Nanobrowser图标打开侧边栏，再点击右上角⚙️图标进入设置界面。

步骤2：配置API密钥

在设置页面的"LLM Providers"选项卡中，添加你的API密钥，支持OpenAI、Anthropic、Google Gemini等多种LLM服务提供商，以及Ollama、Groq等兼容OpenAI格式的API。

步骤3：智能体模型分配

Nanobrowser采用多智能体架构，建议为不同角色分配合适模型：

• Planner：推荐Claude Sonnet 4，负责任务规划和策略制定。
• Navigator：推荐Claude Haiku 3.5，负责网页导航和元素交互。

新手必试的自动化场景：验证安装效果

安装配置完成后，可通过以下简单任务验证：

1. 打开任意网页，如GitHub Trending。
2. 在Nanobrowser侧边栏输入：帮我提取当前页面的前5个项目标题和链接。
3. 点击发送按钮，观察智能体自动浏览并提取信息的过程。

常见问题解决：让使用更顺畅

扩展无法加载

• 确保已启用开发者模式。
• 检查扩展文件是否完整。
• 尝试重启浏览器后重新加载。

智能体无响应

• 验证API密钥是否正确配置。
• 检查网络连接是否正常。
• 确认所选模型是否支持当前地区访问。

任务执行失败

• 尝试简化任务描述。
• 检查目标网站是否有反爬虫机制。
• 在设置中调整智能体的"思考深度"参数。

进阶探索：解锁更多高级功能

安装完成后，你可以：

• 查看AGENTS.md了解多智能体协作原理。
• 探索packages/storage/lib/中的API文档，开发自定义功能。
• 阅读CONTRIBUTING.md，加入社区讨论分享使用经验。

现在，你已拥有功能强大的AI网页自动化助手，开始探索Nanobrowser如何简化你的日常工作流程吧！