看看会发生什么
当你点击。

单击导出时会发生什么？

Notes 浏览器示例有一个Export notes（导出笔记）按钮。点击后加载 notes.json，把两条笔记格式化为 CSV，再开始下载。

使用远程调试打开Chrome

用独立的浏览器配置和本地调试端口打开在线 Notes 示例。Linux 上：

google-chrome \
  --remote-debugging-port=9222 \
  --user-data-dir=/tmp/rea-notes-browser \
  https://rea.tools/examples/notes-web/

在macOS或Windows上使用已安装的浏览器的可执行路径。 你可以将页面URL替换为要检查的其他页面。

REA连接到这个现有的浏览器。 你可以控制页面，执行操作，并在完成后关闭浏览器。

让你的编程助手看一个动作

示例 prompt。把调试地址 http://127.0.0.1:9222 和页面网址交给助手。等它开始捕获，再点击按钮。

你的编程助手发现页面目标，启动观察窗口，并读取生成的证据。 然后，它可以检查导出后面的脚本。

或从终端捕获

查找页面的目标ID:

npx -y rea-agents@latest list-browser-targets \
  http://127.0.0.1:9222 --json

选择网址为 Notes 示例的目标，把下面的 TARGET_ID 换成目标 ID，再运行：

npx -y rea-agents@latest inspect-web-page \
  http://127.0.0.1:9222 TARGET_ID \
  --observation-ms 10000 \
  --include-accessibility-text \
  --include-json-body-shapes --json

让命令连接几秒钟，再在浏览器中点击Export notes。观察时间窗口结束后会返回结果。

捕获的结果包括所选页面、该窗口期间的网络活动以及JSON响应的形状。 较早的请求在此捕获之外。

读取请求和导出脚本

npx -y rea-agents@latest inspect-web-page \
  http://127.0.0.1:9222 TARGET_ID \
  --include-script-sources --json

请求指出了数据来源，REA 记录的请求发起方是 export.js。读取捕获的脚本源码，看看它如何使用数据：

const response = await fetch("./notes.json");
const { notes } = await response.json();
// Format each note as a CSV row.
const url = URL.createObjectURL(new Blob([csv], { type: "text/csv" }));
link.href = url;
link.download = "notes.csv";
link.click();

下载是使用JSON响应在页面中构建的。 CSV格式化步骤来自脚本;网络捕获建立此单击请求 notes.json.

打开示例 · 下载 export.js · 下载 notes.json

查找请求的脚本 notes.json. 它如何转义包含逗号或引号的标题？

对于已安装的JavaScript或Electron应用程序，请继续 应用程序工作流程 要遵循文件和进程边界。