browser-cdp
Use this skill when you need to control a Chrome browser via CDP (Chrome DevTools Protocol) to reuse existing login sessions. Covers: launching Chrome in debug mode, opening URLs, waiting for page load, evaluating JavaScript, taking snapshots, and extracting auth tokens. Trigger phrases: browser automation, CDP, agent-browser, 浏览器操作, 操作浏览器, Chrome CDP, 复用登录态, extract token from browser.
DeepseekModel
官方收录技能
质量 优秀 · 90
v1.0.0
获取
https://deepseekmodel.com/api/download.php?id=worldwonderer-oh-story-claudecode-skills-browser-cdp-skill-md&format=skill
下载 .skill
标准格式,含 system_prompt 与 model_config,导入任意 Agent 框架即可使用
.skill 文件中 system_prompt 字段的实际内容。
name browser-cdp description Use this skill when you need to control a Chrome browser via CDP (Chrome DevTools Protocol) to reuse existing login sessions. Covers: launching Chrome in debug mode, opening URLs, waiting for page load, evaluating JavaScript, taking snapshots, and extracting auth tokens. Trigger phrases: browser automation, CDP, agent-browser, 浏览器操作, 操作浏览器, Chrome CDP, 复用登录态, extract token from browser. metadata {"openclaw":{"requires":{"bins":"[Truncated]"},"source":"https://github.com/worldwonderer/oh-story-claudecode"}} Browser CDP 操作工具 通过 CDP 协议控制 Chrome,复用已有登录态,执行浏览器自动化操作。 前置条件 macOS / Linux / Windows(实验性),已安装 Google Chrome Node.js 20+ agent-browser 已安装: npm install -g agent-browser ⚠️ 首次启动会 kill 用户的常规 Chrome。 在启动前必须征求用户同意(见下方"启动流程"),否则用户可能丢失未保存的标签页/草稿。 启动流程(skill-mode 强制步骤) 第一步:探测当前状态(无副作用) node {SKILL_DIR}/scripts/setup-cdp-chrome.js 9222 --detect-only 输出形如: CDP_STATUS=ready # 已就绪,可直接复用 CDP_URL=http://127.0.0.1:9222/json/version BROWSER=Chrome/148.0.7778.168 或: CDP_STATUS=needs-setup CHROME_RUNNING=yes # 用户有 Chrome 在跑,启动会杀掉 CHROME_PID_COUNT=3 第二步:根据探测结果分支 CDP_STATUS=ready → 直接使用 agent-browser --cdp 9222 ... , 不要运行 setup 。 CDP_STATUS=needs-setup 且 CHROME_RUNNING=no → 安全启动: node {SKILL_DIR}/scripts/setup-cdp-chrome.js 9222 -- yes CDP_STATUS=needs-setup 且 CHROME_RUNNING=yes → 先用 AskUserQuestion 工具向用户确认 :告知会杀掉 N 个 Chrome 进程、可能丢失未保存工作;用户同意后再带 --yes 启动;用户拒绝则放弃这次自动化。 为什么不能直接 --yes : 脚本在非 TTY(即 skill 模式 / Bash 工具)下,如果检测到 Chrome 在跑而没有 --yes ,会以退出码 3 报 NEEDS_CONSENT: ... 并中止, 不会 静默杀进程。这是有意的兜底——但 skill 流程仍应先问用户,而不是看到 3 就盲传 --yes 。 启动脚本选项 选项 说明 --detect-only 只探测,不修改任何状态(skill 用) --yes 已征得同意,跳过交互提示 --reset 启动前清空 ~/chrome-debug-profile (登录失效时用) --profile <name> 使用非 Default 的 Chrome profile(如 "Profile 1" ) --dry-run 打印将执行的步骤,不执行 退出码: 0 成功 / 1 通用错误 / 2 用户拒绝(TTY)/ 3 需同意但缺 --yes 。 常用操作 打开页面并等待加载 agent-browser --cdp 9222 open "<URL>" agent-browser --cdp 9222 wait 3000 提取页面文本 agent-browser --cdp 9222 eval 'document.body.innerText.substring(0, 8000)' 提取 Auth Token agent-browser --cdp 9222 eval 'localStorage.getItem("token") || document.cookie' 复杂 JS(含引号 / $ / 反引号) shell 转义容易出错,用以下两种方式之一: # 1) base64 包裹 agent-browser --cdp 9222 eval -b " $(echo -n "document.querySelectorAll('a').length" | base64) " # 2) heredoc + --stdin cat << 'EOF' | agent-browser --cdp 9222 eval --stdin const links = document.querySelectorAll( 'a' ); links.length; EOF 页面交互(snapshot 拿元素引用) agent-browser --cdp 9222 snapshot -i # 仅交互元素 agent-browser --cdp 9222 click "<CSS or @e1>" agent-browser --cdp 9222 type "<sel>" "<text>" 停止 / 清理 关掉 debug Chrome 窗口即可。若窗口无响应,先按 --user-data-dir 核验出 debug 实例的 PID 再只结束它: macOS / Linux: pgrep -af chrome-debug-profile Windows: wmic process where "name='chrome.exe'" get ProcessId,CommandLine | findstr chrome-debug-profile 拿到 PID 后 kill -9 {PID} / taskkill /F /PID {PID} 。核验不出归属时停止, 手工清理不得按 Chrome 可执行文件名批量结束进程 ——那会连带杀掉用户的日常 Chrome。 例外: setup-cdp-chrome.js --reset 内部确实会做一次按可执行名的清理,它属于本 skill 自带的、需 --yes 显式同意的启动流程;手工排障不要复制该做法。 登录态失效: node {SKILL_DIR}/scripts/setup-cdp-chrome.js 9222 --reset --yes (注意 --yes 同样需要先问用户)。 OpenCode 环境注意事项 opencode 没有后台执行命令行的工具,长时间的 CDP 操作(如等待页面加载、大批量数据抓取)会阻塞整个会话,导致 CLI 无响应。 超时包装 Windows 上对 CDP 命令使用 PowerShell Job 包装超时: $job = Start-Job { agent-browser --cdp 9222 eval "window.location.replace('https://www.qidian.com/rank/')" } Wait-Job $job -Timeout 30 | Out-Null if ($job.State -eq 'Running') { Stop-Job $job; Write-Output "⏱ CDP 操作超时(30s),请重试或手动打断" } else { Receive-Job $job } Remove-Job $job -Force macOS / Linux 上使用 timeout 命令: timeout 30 agent-browser --cdp 9222 eval "window.location.replace('https://www.qidian.com/rank/')" || echo "⏱ CDP 操作超时(30s),请重试或手动打断" 已知限制 即使加了超时包装,以下场景仍可能出现问题: 场景 风险 缓解 页面加载超时 eval 命令等待永不返回 设置 30s 超时,超时后重试 大批量数据抓取 多页翻页时累计等待过长 每页独立超时,失败后从断点继续 Chrome 进程僵死 CDP 连接断开但进程未退出 先核验 debug profile 对应 PID,只结束该 debug 实例后重连;不得连带普通 Chrome 网络波动 请求挂起无超时 超时后自动重试一次 如遇到持续卡死的操作,在 opencode 中按 ESC 手动打断。 常见问题 问题 解决方案 NEEDS_CONSENT + 退出码 3 用 AskUserQuestion 询问用户是否允许杀掉 Chrome,同意后加 --yes 重跑 CDP 端口未监听 --detect-only 再确认;端口被占用则换端口 页面跳转到登录页 snapshot -i 找登录按钮并操作 eval 返回 null 检查 localStorage key 名;含引号的 JS 用 eval -b 或 --stdin 登录态过期 setup-cdp-chrome.js 9222 --reset --yes 重新拷贝 有多个 Chrome profile --profile "Profile 1" 指定 Chrome 不会启动(30s 超时) 试 --reset ;检查端口冲突;查看 ~/chrome-debug-profile/ 是否损坏
Agent 识别该技能的关键词,点击任意一个即可复制。
该技能未提供触发词。
下载的 .skill 包内含以下字段。
| 字段 | 说明 |
|---|---|
| format | 格式标识(skill/v1) |
| skill_id | 技能唯一 ID |
| name | 技能名称 |
| version | 版本号 |
| description | 技能描述 |
| category | 所属分类(数组) |
| trigger_words | 触发词列表 |
| tags | 标签列表 |
| source | 来源标识 |
| source_url | 来源链接(本页地址) |
| exported_at | 导出时间(每次下载生成) |
| system_prompt | 系统提示词正文 |
| model_config | 模型参数:provider / model / temperature / max_tokens / top_p |
| examples | 示例 |
| install_guide | 各平台导入说明(Coze / Dify / Claude / 自定义框架) |