autotab-starter · 编程与开发工具

你是否曾为重复性浏览器操作感到疲惫？

每天打开浏览器，登录 Notion、填写表格、截图存档、批量上传——这些操作机械、耗时、毫无成就感。传统的浏览器自动化工具（如 Selenium）需要编写大量代码，学习曲线陡峭；RPA 平台则价格昂贵，且不够灵活。

autotab 来了。它是美国 Planetary Computers 公司开源的 AI 浏览器自动化工具，GitHub 收获 1013 颗星。autotab 的核心理念非常独特：用「演示」代替「编程」——你只需要在浏览器里点几下，它就能自动生成对应的 Python 代码，然后随时回放执行。

背景：为什么我们需要「演示式」浏览器自动化？

浏览器自动化并非新鲜事物。Selenium 自 2004 年起就是 Web 测试的事实标准，Playwright、Puppeteer 等工具相继出现。然而，这些工具都有一个共同特点：你需要先写代码，才能让浏览器做事。

这在以下场景中成为痛点：

非技术人员想要自动化日常网页操作，却不懂编程
快速原型验证：想验证某个网页操作流程，需要反复写代码调试
频繁变化的网页：传统脚本依赖 CSS 选择器，网页改版后容易失效

大语言模型（LLM）的崛起给这一领域带来了新的可能性。GPT-4 等模型能够理解自然语言指令并操作 DOM 元素。autotab 正是在这一技术背景下诞生的——它将 AI 与浏览器操作结合，让「演示即编程」成为现实。

核心功能：从演示到代码的四步工作流

Step 1：录制（Record）

用户运行 autotab record 命令，autotab 会启动一个 Chrome 浏览器窗口，自动打开 autotab Chrome 扩展面板。用户通过点击和输入进行操作演示，扩展会记录所有 DOM 交互事件（包括点击、输入、悬停、元素选择）。

录制过程中支持两种模式：

Record Mode（Cmd+E）：记录实际交互动作
Select Mode（Cmd+I）：选中特定元素进行复制、悬停或文本注入

Step 2：生成代码

录制结束后，autotab 自动在 agents/ 目录下生成一个 Python 文件（基于 src/template.py 模板）。生成的代码包含所有 Selenium 原生 API 调用，例如：

from selenium.webdriver.common.by import By
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.support.ui import WebDriverWait
import utils.auth as auth
from utils.driver import get_driver

def main(params_filepath=None):
    driver = get_driver()
    # 自动生成的步骤代码...

Step 3：编辑与定制

生成的代码可直接在本地编辑。用户可以添加登录逻辑（google_login()、login()）、修改等待策略、插入业务逻辑。这是人机协作的关键环节——AI 负责生成框架，人的领域知识负责填充细节。

Step 4：回放（Play）

运行 autotab play --agent <agent_name>，autotab 执行已保存的 Python 脚本，自动重现录制时的所有操作。如果某些步骤失败，脚本支持标准 Python 调试（pdb），用户可以单步排查问题。

技术架构：三层分离的模块化设计

autotab 采用清晰的模块化架构，代码结构如下：

autotab-starter/
├── src/
│   ├── main.py          # CLI 入口（record/play 命令）
│   ├── record.py        # 录制模式控制逻辑
│   ├── play.py          # 回放模式控制逻辑
│   ├── template.py      # Agent 代码生成模板
│   ├── _loader.py       # 扩展加载器
│   ├── extension/       # Chrome 扩展（JS）
│   ├── mirror/          # 镜像窗口（OpenCV 视频流）
│   ├── server/          # FastAPI 本地服务
│   └── utils/
│       ├── auth.py      # Google 登录 + Cookie 管理
│       ├── config.py    # YAML 配置解析（Pydantic 模型）
│       ├── driver.py    # Undetected ChromeDriver 封装
│       ├── concurrency.py  # 异步任务线程池
│       ├── params.py    # JSON 参数加载
│       └── url_utils.py # URL 解析工具
└── agents/              # 用户生成的 Agent 文件存放目录

核心技术选型

组件	技术选型	说明
浏览器驱动	Undetected ChromeDriver	绕过反爬检测，自动处理 Chrome 更新
浏览器控制	Selenium WebDriver	业界标准的浏览器自动化接口
Web 服务	FastAPI + Uvicorn	本地 HTTP 服务（用于镜像窗口）
视频镜像	OpenCV + NumPy	实时将浏览器画面流式传输到独立窗口
配置管理	PyYAML + Pydantic	类型安全的配置模型验证
并发模型	ThreadPoolExecutor	支持最多 8 个并发任务线程

认证机制设计

auth 模块是整个系统的关键依赖。系统支持两种认证方式：

Google OAuth Cookie 回放：首次登录后保存 Cookie（google_cookies.json），后续运行直接注入 Cookie，绕过二次验证（2FA）。Cookie 仅保存登出状态的最小集，安全性相对可控。
通用网站登录：支持用户名/密码登录和「Login with Google」两种模式，配置在 .autotab.yaml 中按域名管理。

镜像窗口（Mirror）

autotab 的一大亮点是「镜像窗口」功能。当用户执行 record 命令时，系统会同时打开一个 OpenCV 渲染的独立窗口，实时显示浏览器内容。这个窗口不干扰浏览器焦点，用户可以一边操作一边观察录制效果。这部分通过 multiprocessing.Process 以守护进程方式运行，与主浏览器进程隔离。

上手门槛：需要什么准备？

环境要求

Python >= 3.9
Chrome 浏览器（必须安装）
chromedriver（通过 brew install --cask chromedriver 或系统包管理器安装）
autotab API Key（免费获取，用于登录 autotab 云端服务）

安装流程

git clone https://github.com/Planetary-Computers/autotab-starter.git
cd autotab-starter
make install        # 一键安装所有依赖
autotab record      # 开始录制

整个安装过程约 5-10 分钟，首次还需要配置 .autotab.yaml 文件（含 API Key 和网站凭证）。

适用人群

✅ 需要自动化重复网页操作的用户（数据采集、表单填写、截图存档）
✅ 快速验证网页操作流程的产品/测试人员
✅ AI 爱好者：体验 LLM 驱动的浏览器控制
⚠️ 纯新手用户：仍需理解 Python 基础和 Chrome 扩展机制
❌ 追求无头（Headless）运行的用户：当前版本需要图形界面，计划中

项目现状与局限性

⚠️ 已知问题

不支持无头模式：自动化运行时 Chrome 窗口必须在前台聚焦，否则交互容易失败。作者表示正在开发云端无头版本。
依赖 autotab 云端服务：录制功能需要连接 api.autotab.com，需要有效的 API Key。纯离线使用受限。
Cookie 安全：Google Cookie 保存在本地文件，虽然是登出状态，但一旦泄露仍存在风险。
反爬绕过：使用 Undetected ChromeDriver 可能与某些网站的服务条款冲突，用户需自行判断合法性。
项目活跃度下降：README 显示 2023 年 12 月后项目不再维护，团队正在开发 autotab V1（独立版本，无外部依赖）。

行业意义与未来展望

autotab 代表了一种新兴的「演示驱动自动化」（Demonstration-Based Automation）范式。与传统 RPA 相比，它利用 AI 理解自然语言和 DOM 结构，降低了自动化门槛。

从技术趋势看，这一方向有几个演进方向值得关注：

云端无头运行：消除图形界面依赖，自动化可在服务器上批量执行
多模态理解：结合视觉模型，即使网页结构变化也能定位目标元素
自主 Agent：从「记录回放」进化为「自然语言指令驱动」，自主规划操作步骤

autotab 的 stars 突破 1000 大关（1013★），说明社区对演示驱动自动化有真实需求。其背后的 Planetary Computers 公司正从「云服务+本地工具」向「独立产品」转型，这一进程值得持续关注。

项目链接：https://github.com/Planetary-Computers/autotab-starter | 官网：https://autotab.com

你是否曾为重复性浏览器操作感到疲惫？

背景：为什么我们需要「演示式」浏览器自动化？

这在以下场景中成为痛点：

非技术人员想要自动化日常网页操作，却不懂编程
快速原型验证：想验证某个网页操作流程，需要反复写代码调试
频繁变化的网页：传统脚本依赖 CSS 选择器，网页改版后容易失效

核心功能：从演示到代码的四步工作流

Step 1：录制（Record）

录制过程中支持两种模式：

Record Mode（Cmd+E）：记录实际交互动作
Select Mode（Cmd+I）：选中特定元素进行复制、悬停或文本注入

Step 2：生成代码

录制结束后，autotab 自动在 agents/ 目录下生成一个 Python 文件（基于 src/template.py 模板）。生成的代码包含所有 Selenium 原生 API 调用，例如：

from selenium.webdriver.common.by import By
from selenium.webdriver.common.keys import Keys
from selenium.webdriver.support.ui import WebDriverWait
import utils.auth as auth
from utils.driver import get_driver

def main(params_filepath=None):
    driver = get_driver()
    # 自动生成的步骤代码...

Step 3：编辑与定制

Step 4：回放（Play）

技术架构：三层分离的模块化设计

autotab 采用清晰的模块化架构，代码结构如下：

autotab-starter/
├── src/
│   ├── main.py          # CLI 入口（record/play 命令）
│   ├── record.py        # 录制模式控制逻辑
│   ├── play.py          # 回放模式控制逻辑
│   ├── template.py      # Agent 代码生成模板
│   ├── _loader.py       # 扩展加载器
│   ├── extension/       # Chrome 扩展（JS）
│   ├── mirror/          # 镜像窗口（OpenCV 视频流）
│   ├── server/          # FastAPI 本地服务
│   └── utils/
│       ├── auth.py      # Google 登录 + Cookie 管理
│       ├── config.py    # YAML 配置解析（Pydantic 模型）
│       ├── driver.py    # Undetected ChromeDriver 封装
│       ├── concurrency.py  # 异步任务线程池
│       ├── params.py    # JSON 参数加载
│       └── url_utils.py # URL 解析工具
└── agents/              # 用户生成的 Agent 文件存放目录

核心技术选型

组件	技术选型	说明
浏览器驱动	Undetected ChromeDriver	绕过反爬检测，自动处理 Chrome 更新
浏览器控制	Selenium WebDriver	业界标准的浏览器自动化接口
Web 服务	FastAPI + Uvicorn	本地 HTTP 服务（用于镜像窗口）
视频镜像	OpenCV + NumPy	实时将浏览器画面流式传输到独立窗口
配置管理	PyYAML + Pydantic	类型安全的配置模型验证
并发模型	ThreadPoolExecutor	支持最多 8 个并发任务线程

认证机制设计

auth 模块是整个系统的关键依赖。系统支持两种认证方式：

Google OAuth Cookie 回放：首次登录后保存 Cookie（google_cookies.json），后续运行直接注入 Cookie，绕过二次验证（2FA）。Cookie 仅保存登出状态的最小集，安全性相对可控。
通用网站登录：支持用户名/密码登录和「Login with Google」两种模式，配置在 .autotab.yaml 中按域名管理。

镜像窗口（Mirror）

上手门槛：需要什么准备？

环境要求

Python >= 3.9
Chrome 浏览器（必须安装）
chromedriver（通过 brew install --cask chromedriver 或系统包管理器安装）
autotab API Key（免费获取，用于登录 autotab 云端服务）

安装流程

git clone https://github.com/Planetary-Computers/autotab-starter.git
cd autotab-starter
make install        # 一键安装所有依赖
autotab record      # 开始录制

整个安装过程约 5-10 分钟，首次还需要配置 .autotab.yaml 文件（含 API Key 和网站凭证）。

适用人群

✅ 需要自动化重复网页操作的用户（数据采集、表单填写、截图存档）
✅ 快速验证网页操作流程的产品/测试人员
✅ AI 爱好者：体验 LLM 驱动的浏览器控制
⚠️ 纯新手用户：仍需理解 Python 基础和 Chrome 扩展机制
❌ 追求无头（Headless）运行的用户：当前版本需要图形界面，计划中

项目现状与局限性

⚠️ 已知问题

不支持无头模式：自动化运行时 Chrome 窗口必须在前台聚焦，否则交互容易失败。作者表示正在开发云端无头版本。
依赖 autotab 云端服务：录制功能需要连接 api.autotab.com，需要有效的 API Key。纯离线使用受限。
Cookie 安全：Google Cookie 保存在本地文件，虽然是登出状态，但一旦泄露仍存在风险。
反爬绕过：使用 Undetected ChromeDriver 可能与某些网站的服务条款冲突，用户需自行判断合法性。
项目活跃度下降：README 显示 2023 年 12 月后项目不再维护，团队正在开发 autotab V1（独立版本，无外部依赖）。

行业意义与未来展望

从技术趋势看，这一方向有几个演进方向值得关注：

云端无头运行：消除图形界面依赖，自动化可在服务器上批量执行
多模态理解：结合视觉模型，即使网页结构变化也能定位目标元素
自主 Agent：从「记录回放」进化为「自然语言指令驱动」，自主规划操作步骤

项目链接：https://github.com/Planetary-Computers/autotab-starter | 官网：https://autotab.com