Web Agent Protocol

Web Agent Protocol

概述

Web Agent Protocol（WAP）是一种标准化框架，旨在通过记录和回放浏览器操作，实现用户、Web Agent 和浏览器之间的无缝交互。它将操作记录与执行分开，从而实现高效自动化和重复使用。WAP 的 Python SDK 实现了完整规范，让你可以轻松地：

1. 收集 用户交互数据，使用 OTA‑WAP Chrome 扩展。
2. 转换 原始事件流，生成 精确回放 或 智能回放 操作列表。
3. 转换 已记录的操作，将其转换为 MCP 服务，供任何 Agent 或用户重复使用
4. 使用 WAP-Replay 协议 回放 这些列表，确保浏览器操作准确无误。

WAP 完整演示

不使用 WAP

WAP 记录

WAP 回放

使用 WAP 的示例

设置

使用以下命令安装依赖项：

创建 conda 环境

conda create -n WAP python=3.11

激活 conda 环境

conda activate WAP

安装依赖项

pip install -r requirements.txt

设置你的仓库源路径：

set PYTHONPATH=C:/path/to/webagentprotocol # for Windows
export PYTHONPATH=/path/to/webagentprotocol # for Linux

在仓库根目录下创建 .env 文件，并填入你自己的 API 密钥：

OPENAI_API_KEY=sk-proj-...
DEEPSEEK_API_KEY=sk-...

记录

WAP 记录扩展

请参阅 OTA‑WAP Chrome 扩展，在 Chrome 浏览器中设置操作捕获器。

启动数据收集服务

运行以下命令，启动服务以从扩展收集数据：

python action_collect_server.py

服务启动后，你就可以使用 WAP Chrome 扩展开始记录页面操作。

服务默认监听 http://localhost:4934/action-data，请确保扩展设置中的 Host 和 Port 与此服务配置一致。 每个会话都会保存到：

data/YYYYMMDD/taskid/summary_event_<timestamp>.json

WAP 后端服务收到的格式化数据示例如下：

{
  "taskId": "MkCAhQsHgXn7YgaK",
  "type": "click",
  "actionTimestamp": 1746325231479,
  "eventTarget": {
    "type": "click",
    "target": "<a ota-use-interactive-target=\"1\" data-ordinal=\"3\" href=\"https://www.allrecipes.com/recipe/68925/cheesy-baked-salmon/\" data-tax-levels=\"\" data-doc-id=\"6592066\" class=\"comp mntl-card-list-card--extendable mntl-universal-card mntl-document-card mntl-card card card--no-image\" id=\"mntl-card-list-card--extendable_3-0\">\n<div class=\"loc card__top\"><div class=\"card__media mntl-image card__media universal-image__container\">...",
    "targetId": "mntl-card-list-card--extendable_3-0",
    "targetClass": "comp mntl-card-list-card--extendable mntl-universal-card mntl-document-card mntl-card card card--no-image"
  },
  "allEvents": {},
  "pageHTMLContent": "<header data-tracking-container=\"true\" data-collapsible=\"true\" class=\"comp header mntl-header mntl-header--magazine mntl-header--open-search-bar mntl-header--myr\" id=\"header_1-0\"><a data-tracking-container=\"true\" id=\"mntl-skip-to-content_1-0\" class=\"mntl-skip-to-content mntl-text-link\" rel=\"nocaes\" href=\"#main\"></a><div class=\"mntl-header__menu-top\">..."
}

生成回放列表

模式	命令
精确回放 – 精确重现每个操作	python wap_replay/generate_exact_replay_list.py --data_dir_path data/<date>/<task_id> --output_dir_path data_processed/exact_replay
智能回放 – 精简的目标导向步骤	python wap_replay/generate_smart_replay_list.py --data_dir_path data/<date>/<task_id> --output_dir_path data_processed/smart_replay

将 <task_id> 替换为扩展程序生成的文件夹 （例如：em3h6UBDZykz0gnH）。

输出结构：

data_processed/smart_replay/
 ├─ subgoals_<task_id>/                     # intermediate prompts & replies
 └─ wap_smart_replay_list_<task_id>.json   # final smart replay list for the agent

data_processed/exact_replay/
 └─ wap_smart_replay_list_<task_id>.json   # final exact replay list for the agent

回放

python run_replay.py --model-provider openai --wap_replay_list data_processed/exact_replay/wap_exact_replay_list_<task_id>.json --max-concurrent 1

对于智能回放，请将路径替换为智能回放 JSON 文件，以测试此模式。

转换为 MCP 服务

python wap_replay\generate_mcp_server.py --task_id <task_id>

转换后的 MCP 服务将位于 mcp_servers 文件夹下

使用 MCP 回放

使用 MCP 回放需要打开 2 个终端。在第一个终端中

python wap_service.py

在第二个终端中

python mcp_client.py

然后在第二个终端中输入提示词

example: find a top rated keyboard on amazon.ca using smart replay

使用我们的桌面应用回放

我们提供开箱即用的桌面应用来运行回放列表。安装简单，无需额外的设置和部署步骤。访问 WAP Replay Tool 发布页面了解详情。

故障排查

ModuleNotFoundError – 请在项目根目录运行命令，或导出 PYTHONPATH=.（Windows 请设置 PYTHONPATH=.）。

“no task‑start file” – 请确保扩展程序记录了完整会话； 生成器要求恰好有一条 task-start 记录和一条 task-finish 记录。

致谢

Browser-Use: https://github.com/browser-use/browser-use

MCP: https://github.com/modelcontextprotocol/python-sdk

DOM Extension: https://github.com/kdzwinel/DOMListenerExtension