1. OpenClaw 浏览器数据提取到底在解决什么问题OpenClaw 是一个可以自主安装技能、编写并执行代码的 AI Agent 运行环境它最实用的能力之一就是通过 JavaScript 编程从浏览器里把动态渲染的数据抓出来。很多人第一次听到「浏览器数据提取」会以为是简单的curl加正则但真实页面里大量内容是 JavaScript 渲染的直接请求 HTML 拿到的往往是空壳。OpenClaw 的思路是让 Agent 自己安装浏览器自动化技能然后用 Puppeteer 驱动一个无头浏览器等页面渲染完成后再用 JS 脚本读取 DOM最后整理成结构化 JSON。这套链路适合谁适合需要批量采集列表页信息、做竞品监控、做数据看板前置抓取或者单纯想验证「AI Agent 能不能自主完成编程任务」的开发者。它的核心检索词就是 OpenClaw、js 编程、浏览器数据提取而整条链路里最容易被忽略、也最容易卡住的环节是模型调用通道的鉴权配置。因为 OpenClaw 在生成和修复 JS 脚本时需要反复调用大模型如果每个模型都单独配一套 Key调试成本会非常高。这也是本文要引入 TaoToken 统一 Key 通道的原因用一个 Base URL 和一把 Key把脚本生成、报错修复、结果校验这几步的模型调用统一起来。我试过在本地把 OpenClaw 的浏览器技能跑通整个流程可以拆成四段安装浏览器自动化技能、确认 Puppeteer 可用、编写提取脚本、核对返回数据。下面按这个顺序展开每一步都给可复制的配置和命令。2. TaoToken 统一 Key 通道的前置准备在写提取脚本之前先把模型调用通道理顺。OpenClaw 在执行任务时会多次请求模型第一次生成 Puppeteer 脚本脚本报错后请求修复提取结果不完整时请求补全。如果这些请求分散在多个厂商的 Key 上排查问题时你根本分不清是脚本逻辑错了还是鉴权失败了。TaoToken 的做法是提供一个统一的 API 入口你只需要记住一个 Base URL 和一把 Key。官网地址是 https://taotoken.net/?utm_sourcetaotoken_aicg_blog_endutm_mediumcsdnutm_campaignrewriteutm_content API 入口是 https://taotoken.net/api 注意 API 地址不带 UTM 参数配置时直接写这个。你需要先在控制台创建 Key控制台入口是 https://taotoken.net/console?utm_sourcetaotoken_aicg_blog_endutm_contentconsoleutm_campaignrewrite 创建完成后到 API Keys 页面复制页面地址是 https://taotoken.net/api-keys?utm_sourcetaotoken_aicg_blog_endutm_contentapi-keysutm_campaignrewrite 。这里有个关键点OpenClaw 的浏览器技能本身不关心你用哪家模型它只认 OpenAI 兼容的接口格式。所以你要做的是把 TaoToken 的 Base URL 和 Key 写进 OpenClaw 的模型配置里让 Agent 在生成 JS 脚本时走这条通道。模型 ID 建议选一个代码能力强的比如claude-sonnet-4-5这类具体可用列表可以在模型对话页确认https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_contentmodel-chatutm_campaignrewrite 。如果你打算长期跑编码和 Agent 任务可以看下 Coding Planhttps://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding-planutm_campaignrewrite 它更适合高频调用场景。接入文档在 https://taotoken.net/doc?utm_sourcetaotoken_aicg_blog_endutm_contentdocutm_campaignrewrite 配置细节以文档为准。前置准备做完后你手里应该有三样东西Base URL、API Key、Model ID。这三件套在后面的配置文件里会反复出现缺一个都会导致 401 或模型找不到。3. 可复制的 OpenClaw 与 Puppeteer 配置这一节给可直接粘贴的配置片段。OpenClaw 的技能安装目录在~/.openclaw/workspace/skills/浏览器自动化技能安装后是browser-automation-puppeteer。先确认技能文件结构ls ~/.openclaw/workspace/skills/browser-automation-puppeteer/ # _meta.json LICENSE.txt README.md references scripts skill-card.md SKILL.md接着配置模型通道。OpenClaw 的模型配置通常放在工作区的 settings 文件里路径以你本地实际为准下面是一个 JSON 片段示例把 Base URL、Key、Model ID 三件套写全{ model: { provider: openai-compatible, base_url: https://taotoken.net/api, api_key: sk-你的TaoToken密钥, model_id: claude-sonnet-4-5, timeout: 120 }, skills: { browser: { name: browser-automation-puppeteer, headless: true, executable_path: null } } }如果你用的是 TOML 风格的配置等价写法如下[model] provider openai-compatible base_url https://taotoken.net/api api_key sk-你的TaoToken密钥 model_id claude-sonnet-4-5 timeout 120 [skills.browser] name browser-automation-puppeteer headless true配置完成后安装 Puppeteer。技能本身只是模板和调试指南真正驱动浏览器的是 Puppeteer 这个 Node.js 库cd ~/.openclaw/workspace/skills/browser-automation-puppeteer/ npm init -y npm install puppeteer24.25.0安装完成后验证一下能否加载node -e const prequire(puppeteer); console.log(puppeteer ok, p.executablePath ? ready : check);如果这一步报Cannot find module puppeteer说明安装目录不对回到技能目录重新执行npm install。如果报浏览器下载失败可以设置PUPPETEER_SKIP_DOWNLOAD后手动指定本地 Chrome 路径把executable_path填成你本机 Chrome 的实际位置。配置阶段最容易踩的坑是把 Base URL 写成带 UTM 的官网地址。记住 API 是https://taotoken.net/api不带任何查询参数。另外 Key 不要硬编码进要提交到仓库的脚本里建议用环境变量注入export TAOTOKEN_API_KEYsk-你的TaoToken密钥然后在配置里引用${TAOTOKEN_API_KEY}。这样既安全也方便在 CI 里替换。4. 编写 JS 提取脚本并验证返回结果配置就绪后让 OpenClaw 打开目标页面并提取数据。指令可以这样下请用浏览器工具访问目标新闻列表页提取排名前 10 的新闻标题、发布日期和作者姓名以 JSON 数组格式返回。OpenClaw 会生成一段基于 Puppeteer 的 JS 脚本。核心逻辑是启动无头浏览器、打开页面、等待列表元素渲染、用page.evaluate在页面上下文里读取 DOM。下面是一个可独立运行的提取脚本模板你可以直接保存为extract.jsconst puppeteer require(puppeteer); (async () { const browser await puppeteer.launch({ headless: true, args: [--no-sandbox, --disable-setuid-sandbox] }); const page await browser.newPage(); await page.setUserAgent( Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36 ); await page.goto(https://finance.sina.com.cn/, { waitUntil: networkidle2, timeout: 60000 }); await page.waitForSelector(.newsList li, .list_009 li, { timeout: 30000 }); const items await page.evaluate(() { const nodes Array.from( document.querySelectorAll(.newsList li, .list_009 li) ).slice(0, 10); return nodes.map((li) { const a li.querySelector(a); const time li.querySelector(span, .time, .fgray_time); return { title: a ? a.innerText.trim() : , date: time ? time.innerText.trim() : , author: li.getAttribute(data-author) || 未知 }; }); }); console.log(JSON.stringify(items, null, 2)); await browser.close(); })();运行node extract.js成功时你会看到类似下面的 JSON 数组字段和顺序与指令一致[ { title: 某财经要闻标题示例, date: 2026年08月07日 07:00, author: 某财经媒体 }, { title: 某行业动态标题示例, date: 2026年08月07日 02:45, author: 某证券报 } ]验证返回数据时重点核对三件事条数是否为 10、日期格式是否统一、作者字段是否为空。如果作者字段大量为空说明选择器没命中需要回到页面用开发者工具确认作者信息挂在哪个属性或子节点上。OpenClaw 的调试指南里提到它通常会做多轮 tool 调用先粗提取再根据缺失字段补全 meta 标签最后清理格式。这个过程正是模型通道在起作用如果中途出现鉴权失败脚本修复就会中断。想单独验证模型通道是否通可以用模型对话页发一条测试请求https://taotoken.net/chat?utm_sourcetaotoken_aicg_blog_endutm_contentmodel-chatutm_campaignrewrite 。如果那边正常返回说明 Base URL 和 Key 没问题问题就落在脚本本身。5. 常见报错排查对照表调试阶段遇到的报错基本集中在鉴权和浏览器启动两类。下面按真实报错信息对照排查。报错信息可能原因处理方式401 UnauthorizedKey 错误或未注入环境变量检查api_key是否为 TaoToken 控制台复制的完整 Key确认环境变量已 exportlocal proxy failed本地网络或代理配置干扰关闭本地代理设置确认请求直连https://taotoken.net/apireading choices返回体不是预期 JSON多为鉴权失败或模型 ID 错误核对 Model ID 是否在可用列表内检查 Base URL 是否误写成官网地址OAuth相关报错误用了需要 OAuth 的接入方式改用 API Key 方式参考接入文档重新配置Cannot find module puppeteer安装目录不对进入技能目录重新npm install puppeteerTimeoutError: waiting for selector选择器未命中或页面未渲染完用开发者工具确认选择器或改用waitForFunction等待net::ERR_NAME_NOT_RESOLVED目标页面地址错误检查page.goto的 URL 是否完整可访问关于reading choices这个报错它通常出现在代码里直接读response.choices[0]但返回体是错误对象的时候。根因往往是请求根本没通过鉴权返回的是{error: ...}而不是标准补全结构。排查顺序是先确认 Key 有效再确认 Base URL 正确最后确认 Model ID 拼写无误。这三件套任何一项出错都会走到这个分支。如果出现local proxy failed先检查系统环境变量里有没有HTTP_PROXY、HTTPS_PROXY之类的设置有的话临时 unset 再跑。OpenClaw 的模型请求应该直连 API 地址不需要经过任何本地转发。还有一个隐蔽的坑脚本里page.evaluate内部不能直接引用外部变量所有数据必须在页面上下文里重新获取。如果你在 evaluate 里用了 Node 侧的变量会报ReferenceError。解决办法是把参数通过page.evaluate(fn, arg)的第二个参数传进去。6. 把通道固定下来让提取任务可复用跑通一次提取不难难的是让这套流程稳定复用。我的做法是把三件套写进一个.env文件脚本启动时加载这样换机器、换项目都不用改代码TAOTOKEN_BASE_URLhttps://taotoken.net/api TAOTOKEN_API_KEYsk-你的TaoToken密钥 TAOTOKEN_MODEL_IDclaude-sonnet-4-5然后在 OpenClaw 的配置里引用这些变量。这样做的另一个好处是当你要从单次提取升级成定时任务时只需要把extract.js挂到调度器上模型通道不用动。长期跑编码和 Agent 任务的话Coding Plan 会比按次调用更省心https://taotoken.net/coding-plan?utm_sourcetaotoken_aicg_blog_endutm_contentcoding-planutm_campaignrewrite 。最后给一个实用技巧在提取脚本里加一段自检逻辑把返回条数和字段完整度打印出来低于阈值就退出非零状态码。这样挂到定时任务里数据异常时你能第一时间收到告警而不是等下游看板空了才发现。提取脚本的稳定性一半靠选择器一半靠模型通道的稳定鉴权两者都固定下来OpenClaw 的浏览器数据提取才算真正可跟做、可复用。