# @framers/agentos-ext-web-browser 中文文档

规范地址：https://npmcn.com/package/%40framers/agentos-ext-web-browser/

版本：1\.3\.5
npm 元数据更新时间：2026-11-11T08:00:30.416Z
中文译文更新时间：2026-11-15T12:19:21.407Z
软件包许可：Apache-2\.0

本文由上游 README 翻译，可能存在偏差，请结合原文核对 API、命令与配置。版权与许可归原作者所有。

原始 npm 页面：https://www.npmjs.com/package/%40framers/agentos-ext-web-browser
原文对照：https://npmcn.com/package/%40framers/agentos-ext-web-browser/?lang=original
项目主页：https://github.com/framerslab/agentos-extensions/tree/master/registry/curated/research/web-browser#readme
源码仓库：https://github.com/framerslab/agentos-extensions

## 关键信息（来自 npm 元数据）

- 包体积（解压后）：110 kB，44 个文件
- 模块格式：ES Module
- TypeScript 类型：包内自带
- Node.js 要求：\>=22
- 运行依赖：2 个
- peer 依赖：@framers/agentos \>=0\.10\.40
- 首次发布：2026-02-06T12:51:26.646Z
- 最新版本发布：2026-11-11T08:00:29.730Z
- 近 30 天下载量：20402（2026-10-16 至 2026-11-14，npm 官方下载统计）
- 已发布版本数：10（近 12 个月 10 个）

## 中文简介

AgentOS 浏览器自动化扩展

## 安装

```sh
npm install @framers/agentos-ext-web-browser
```

也可以使用：`pnpm add @framers/agentos-ext-web-browser`、`yarn add @framers/agentos-ext-web-browser`、`bun add @framers/agentos-ext-web-browser`

## README

# AgentOS 网页浏览器扩展

AgentOS代理的浏览器自动化能力 - 导航页面,刮取内容,点击元素,并抓取截图.

## 特征

-   **导航**: 转到任意 URL并获取页面内容
-   **拼图**: 使用 CSS 选择器提取内容
-   **点击**: 有页面元素的互动
-   **类型**: 填入表格和输入字段
-   **截图**: 抓取可视快照
-   **页面快照**: 获取智能交互的无障碍树

## 安装

```bash
npm install @framers/agentos-ext-web-browser
```

## 快速启动

```typescript
import { AgentOS } from '@framers/agentos';

const agentos = await AgentOS.create({
  extensionManifest: {
    packs: [
      {
        package: '@framers/agentos-ext-web-browser',
        options: {
          headless: true,
          timeout: 30000,
          viewport: { width: 1920, height: 1080 },
        },
      },
    ],
  },
});
```

## 工具

### 浏览器( n)

导航到 URL并检索页面内容 .

```typescript
const result = await gmi.executeTool('browser_navigate', {
  url: 'https://example.com',
  waitFor: 'networkidle2',
  returnText: true
});
// Returns: { url, status, title, text, loadTime }
```

### 浏览器( s)

使用 CSS 选择器提取内容 .

```typescript
const result = await gmi.executeTool('browser_scrape', {
  selector: 'article h2',
  limit: 10
});
// Returns: { selector, count, elements: [{ tag, text, html, attributes }] }
```

### 浏览器 单击

点击元素.

```typescript
const result = await gmi.executeTool('browser_click', {
  selector: 'button.submit',
  waitForNavigation: true
});
// Returns: { success, element, newUrl }
```

### 浏览器类型

将文本输入输入字段.

```typescript
const result = await gmi.executeTool('browser_type', {
  selector: 'input[name="search"]',
  text: 'AgentOS documentation',
  clear: true
});
// Returns: { success, element, text }
```

### 浏览器( s)

抓取截图.

```typescript
const result = await gmi.executeTool('browser_screenshot', {
  fullPage: true,
  format: 'png'
});
// Returns: { data (base64), format, width, height, size }
```

### 浏览器( s)

获取无障碍树进行智能互动.

```typescript
const result = await gmi.executeTool('browser_snapshot', {});
// Returns: { url, title, elements, links, forms, interactable }
```

## 配置

| 选项 | 类型 | 默认 | 说明 |
| --- | --- | --- | --- |
| `headless` | 布尔 | `true` | 在无头模式下运行浏览器 |
| `timeout` | 编号 | `30000` | 默认超时( 毫秒) |
| `userAgent` | 字符串 | \- 说吧 | 自定义用户代理 |
| `viewport.width` | 编号 | `1920` | 视图口宽度 |
| `viewport.height` | 编号 | `1080` | 视图端口高度 |
| `executablePath` | 字符串 | 自动 | Chrome 可执行文件的路径 |

## 使用大小写

### 网络研究代理

```typescript
// Search and scrape information
await gmi.executeTool('browser_navigate', { url: 'https://google.com' });
await gmi.executeTool('browser_type', { selector: 'input[name="q"]', text: 'AI agents 2024' });
await gmi.executeTool('browser_click', { selector: 'input[type="submit"]', waitForNavigation: true });
const results = await gmi.executeTool('browser_scrape', { selector: '.g h3' });
```

### 窗体自动化

```typescript
await gmi.executeTool('browser_navigate', { url: 'https://signup.example.com' });
await gmi.executeTool('browser_type', { selector: '#email', text: 'user@example.com' });
await gmi.executeTool('browser_type', { selector: '#password', text: 'securepass123' });
await gmi.executeTool('browser_click', { selector: 'button[type="submit"]' });
```

### 视觉验证

```typescript
await gmi.executeTool('browser_navigate', { url: 'https://myapp.com' });
const screenshot = await gmi.executeTool('browser_screenshot', { fullPage: true });
// Send screenshot to vision model for analysis
```

## 依赖关系

这个扩展需要Chrome/Chrimium安装在系统中. 用这个 `puppeteer-core` 它不捆绑浏览器.

## 许可证

Apache-2.0 框架.dev

## 常见问题

### @framers/agentos-ext-web-browser 是什么？

AgentOS 浏览器自动化扩展

### 如何安装 @framers/agentos-ext-web-browser？

在项目目录运行 npm install @framers/agentos-ext-web-browser，或使用 pnpm add / yarn add / bun add。它还需要宿主项目提供 peer 依赖：@framers/agentos（\>=0\.10\.40）。npm 7 及以上与 pnpm 8 及以上默认会自动安装必需的 peer 依赖，Yarn 需要手动安装。

### @framers/agentos-ext-web-browser 支持 TypeScript 吗？

支持。包内自带 TypeScript 类型声明（package\.json 声明了 types 入口），安装后即可获得类型提示，无需再安装 @types 包。

### @framers/agentos-ext-web-browser 支持 ESM 还是 CommonJS？

以 ES Module 形式发布，推荐使用 import 引入。在 CommonJS 项目中，Node\.js 20\.19\+ / 22\.12\+ 可以直接 require\(\) 不含顶层 await 的 ES Module，更早的版本需要改用动态 import\(\)。

### @framers/agentos-ext-web-browser 需要什么版本的 Node\.js？

package\.json 的 engines 字段要求 Node\.js \>=22。版本不符时 npm 默认只给出警告，开启 engine-strict 后会拒绝安装。

### @framers/agentos-ext-web-browser 可以商用吗？

@framers/agentos-ext-web-browser 使用 Apache-2\.0 许可。宽松许可：允许商业使用、修改和再分发，并附带明确的专利授权；分发时需保留许可与 NOTICE 文件，修改过的文件要注明改动。以上为概括，不构成法律意见，请以许可原文为准。

### @framers/agentos-ext-web-browser 的下载量有多少？

根据 npm 官方下载统计，@framers/agentos-ext-web-browser 在 2026/10/16 – 2026/11/14 这 30 天内被下载 20,402 次，日均约 680 次。下载量会把 CI 构建、镜像同步和作为其他包依赖的安装一并计入，适合横向比较热度，不能直接等同于使用人数。

### @framers/agentos-ext-web-browser 还在维护吗？

最新版本 1\.3\.5 发布于 2026/11/11（4 天前）；至今共发布 10 个版本，其中过去 12 个月发布了 10 个；首次发布于 2026/02/06。发布频率只是参考信号：功能稳定的工具可能很少需要更新，建议结合源码仓库的 issue 和提交记录判断。