OpenBrowserClaw

免责声明：OpenBrowserClaw 是一个个人开源项目。它与任何加密货币、模因币、代币或社交媒体账号均无关联。如果您看到声称与此项目有关联的币种、代币或社交媒体账号，它们均属非法仿冒，且未得到作者的认可。请务必保持警惕，并自行做好研究。

基于浏览器的个人 AI 助手。无需任何基础设施——浏览器本身就是服务器。

本项目是对 NanoClaw 的纯浏览器端重构。秉承相同的理念，代码简洁易懂，专为单个用户设计，完全在浏览器标签页中运行。

快速开始

cd openbrowserclaw
npm install
npm run dev

打开 http://localhost:5173，粘贴您的 Anthropic API 密钥，即可开始聊天。

架构图

┌──────────────────────────────────────────────────────────┐
│  浏览器标签页（PWA）                                       │
│                                                          │
│  ┌──────────┐  ┌──────────┐  ┌────────────────────────┐  │
│  │ 聊天界面 │  │ 设置界面 │  │ 任务管理器           │  │
│  └────┬─────┘  └─────┬────┘  └───────┬────────────────┘  │
│       └──────────────┼───────────────┘                   │
│                      ▼                                   │
│              协调器（主线程）                  │
│              ├── 消息队列与路由                 │
│              ├── 状态机（空闲/思考/响应）         │
│              └── 任务调度器（cron）               │
│                      │                                   │
│          ┌───────────┼───────────┐                       │
│          ▼           ▼           ▼                       │
│     IndexedDB      OPFS    代理 Worker                  │
│     (消息、   (群组    (Claude API                   │
│      任务、       文件、    工具使用循环、               │
│      配置)     存储)    WebVM 沙盒)               │
│                                                          │
│  通道：                                               │
│  ├── 浏览器聊天（内置）                             │
│  └── Telegram Bot API（可选，纯 HTTPS）             │
└──────────────────────────────────────────────────────────┘

核心文件

文件	用途
src/index.ts	入口文件，启动 UI
src/orchestrator.ts	状态机、消息路由、代理调用
src/agent-worker.ts	Web Worker：Claude API 工具使用循环
src/tools.ts	工具定义（bash、读写文件、fetch 等）
src/vm.ts	WebVM 封装（v86 Alpine Linux 在 WASM 中）
src/db.ts	IndexedDB：消息、会话、任务、配置
src/storage.ts	OPFS：按群组划分的文件存储
src/router.ts	将消息路由到正确通道
src/channels/browser-chat.ts	浏览器内聊天通道
src/channels/telegram.ts	Telegram Bot API 通道
src/task-scheduler.ts	Cron 表达式解析
src/crypto.ts	AES-256-GCM 加密用于存储凭据
src/ui/	聊天、设置和任务管理组件

工作流程

1. 您在浏览器聊天中输入消息（或通过 Telegram 发送）
2. 协调器检查触发模式，保存至 IndexedDB，并加入处理队列
3. 代理 Worker（Web Worker）将您的消息及对话历史发送至 Anthropic API
4. Claude 回应，可能使用工具（bash、文件 I/O、fetch、JavaScript）
5. 工具结果会循环反馈给 Claude，直到其生成最终文本回复
6. 回复会被路由回原始通道（浏览器聊天或 Telegram）

可用工具

工具	功能
bash	在沙盒化的 Linux VM（Alpine 在 WASM 中）中执行 Shell 命令
javascript	在隔离作用域中执行 JS 代码（比 bash 更轻量）
read_file / write_file / list_files	管理 OPFS 中按群组划分的工作空间内的文件
fetch_url	通过浏览器 fetch() 进行 HTTP 请求（受 CORS 限制）
update_memory	将上下文持久化至 CLAUDE.md（每次对话都会加载）
create_task	使用 cron 表达式安排定期任务

Telegram 集成

可选功能。完全基于 HTTPS 实现，无需 WebSockets 或其他特殊协议。

1. 在 Telegram 上使用 @BotFather 创建一个机器人
2. 打开 OpenBrowserClaw 的设置页面，粘贴机器人 Token
3. 向您的机器人发送 /chatid 获取聊天 ID
4. 将聊天 ID 添加到设置中
5. 来自 Telegram 的消息会与浏览器聊天的消息一样被处理

注意：Telegram 侧的消息会排队等待，只有当浏览器标签页处于打开状态时，机器人才会响应。一旦标签页关闭，消息处理将暂停，直到标签页重新打开。

WebVM（可选）

bash 工具会在 v86 模拟的 Alpine Linux 环境中运行命令。如需启用：

1. 下载 v86 WASM 二进制文件和 Alpine rootfs 镜像
2. 将它们放置在 public/assets/ 目录下：
   • public/assets/v86.wasm
   • public/assets/v86/libv86.js
   • public/assets/alpine-rootfs.ext2
3. 第一次使用时，虚拟机会自动启动（耗时约 5–15 秒）。

如果没有这些资源，bash 工具会返回一条友好的错误提示。其他工具则无需依赖 WebVM 即可正常工作。

与 NanoClaw 的对比

特性	NanoClaw	OpenBrowserClaw
运行环境	Node.js 进程	浏览器标签页
代理沙盒	Docker/Apple Container	Web Worker + WebVM
数据库	SQLite (better-sqlite3)	IndexedDB
文件系统	文件系统	OPFS
主要通信渠道	WhatsApp	浏览器内聊天
其他渠道	Telegram, Discord	Telegram
代理 SDK	Claude Agent SDK	原生 Anthropic API
后台任务	launchd 服务	setInterval（需标签页打开）
部署方式	自托管服务器	静态文件（任意 CDN）
依赖包数量	~50 个 npm 包	运行时依赖为 0

开发指令

npm run dev        # Vite 开发服务器，支持 HMR
npm run build      # 生产构建 → dist/
npm run preview    # 预览生产构建
npm run typecheck  # TypeScript 类型检查

部署步骤

npm run build
# 将 dist/ 目录上传至任何静态托管平台：
# GitHub Pages、Cloudflare Pages、Netlify、Vercel、S3 等

无需服务器。项目仅包含 HTML、CSS 和 JS 文件。

安全性

OpenBrowserClaw 是一个概念验证项目。所有数据都保留在您的浏览器中，除了调用 Anthropic API 之外，不会向任何服务器发送数据。以下是当前安全状况的坦诚分析：

它做了什么：

• API 密钥在静止状态下使用 AES-256-GCM 加密，并通过存储在 IndexedDB 中的不可提取 CryptoKey 进行保护。JavaScript 无法导出原始密钥材料。
• 所有存储（IndexedDB、OPFS）均由浏览器限制为同源作用域。
• 代理运行在 Web Worker 中，与 UI 线程分离。

它尚未做到的事情：

• 加密可以防止一般的检查（例如开发者工具、磁盘取证），但无法抵御针对同一源的完整 XSS 攻击；如果攻击者获得了脚本执行权限，便可以直接调用加密/解密 API。
• javascript 工具会在 Worker 中执行 eval()，而该 Worker 拥有 fetch() 的访问权限。这意味着 Claude 可以通过 JS 工具发起任意 HTTP 请求，完全不受任何 fetch_url 限制的影响。
• 出站 HTTP 请求（无论是通过 fetch_url 还是 JS 工具）都没有用户确认步骤。
• Telegram 机器人令牌目前以明文形式存储。

这是一个单用户本地工具，而非多租户平台。欢迎为改进安全模型贡献力量。

OpenBrowserClaw 快速上手指南

OpenBrowserClaw 是一款基于浏览器的个人 AI 助手，无需后端服务器基础设施，所有逻辑均在浏览器标签页内运行。它是 NanoClaw 的浏览器原生重构版，专为单用户设计。

环境准备

在开始之前，请确保您的开发环境满足以下要求：

• 操作系统：Windows、macOS 或 Linux（主流现代系统均可）。
• Node.js：建议安装 LTS 版本（v18+），用于运行构建工具。
• 包管理器：npm（随 Node.js 安装）或 yarn/pnpm。
• API Key：需要拥有 Anthropic API Key 以驱动 AI 模型。
• 浏览器：推荐使用最新版的 Chrome、Edge 或 Firefox（需支持 Web Workers, IndexedDB, OPFS 等现代特性）。

提示：国内开发者若遇到 npm 安装缓慢，可临时切换至国内镜像源：

npm config set registry https://registry.npmmirror.com

安装步骤

1. 克隆项目代码 将仓库克隆到本地目录：

   git clone <repository-url> openbrowserclaw
   cd openbrowserclaw
   

   (注：请将 <repository-url> 替换为实际的仓库地址)

2. 安装依赖 安装项目所需的开发依赖：

   npm install
   

3. 启动开发服务器 运行本地开发环境（基于 Vite，支持热更新）：

   npm run dev
   

基本使用

1. 访问应用 终端运行成功后，打开浏览器访问显示的地址（默认为 http://localhost:5173）。

2. 配置 API Key

   • 在界面中找到设置区域（Settings）。
   • 粘贴您的 Anthropic API key。
   • 密钥将通过 AES-256-GCM 加密存储在浏览器的 IndexedDB 中。

3. 开始对话 直接在浏览器聊天窗口输入消息即可与 AI 交互。OpenBrowserClaw 会自动调用 Claude 模型，并支持以下工具能力：

   • 代码执行：在隔离环境中运行 JavaScript。
   • 文件操作：读写浏览器私有文件系统 (OPFS)。
   • 网络请求：通过 fetch 获取外部数据。
   • Linux 命令：(可选) 若配置了 WebVM 资产，可在 WASM 沙箱中运行 Alpine Linux 命令。

4. 可选：启用 Telegram 机器人

   • 在 Telegram 通过 @BotFather 创建机器人并获取 Token。
   • 将 Token 填入 OpenBrowserClaw 的设置页面。
   • 向机器人发送 /chatid 获取聊天 ID 并填入设置。
   • 注意：由于是无服务器架构，浏览器标签页必须保持开启状态，Telegram 消息才能被处理和响应。

安全提示：本项目为个人本地工具，数据仅存储于您的浏览器中（除发送给 Anthropic API 的请求外）。请勿在生产环境或多租户场景中直接使用，且需注意浏览器标签页关闭后定时任务将停止运行。