joeseesun/qiaomu-opencli-skills

},   "page": {     "url": "https://example.com/search",

"page": {     "url": "https://example.com/search",     "snapshot": "// DOM snapshot with [N] indices",

"url": "https://example.com/search",

# Open the page and inspect current DOM opencli browser open https://example.com/target-page && opencli browser state

opencli browser open https://example.com/target-page && opencli browser state

# Open page with network interceptor, then trigger the action manually opencli browser open https://example.com/target-page && opencli browser state

opencli browser open https://example.com/target-page && opencli browser state

// Before: const resp = await page.evaluate(`fetch('/api/v1/old-endpoint')...`)

// After:  const resp = await page.evaluate(`fetch('/api/v2/new-endpoint')...`)

4. AI explores: opencli browser open https://www.zhihu.com/hot && opencli browser state

2. **ALWAYS use `click`/`type`/`select` for interaction, NEVER use `eval` to click or type** — `eval "el.click()"` bypasses scrollIntoView and CDP click pipeline, causing failures on off-screen elements. Use `state` to find the `[N]` index,

6. **`eval` is read-only** — use `eval` ONLY for data extraction (`JSON.stringify(...)`), never for clicking, typing, or navigating. Always wrap in IIFE to avoid variable conflicts: `eval "(function(){ const x = ...; return JSON.stringify(x

# GOOD: open + inspect in one call (saves 1 round trip) opencli browser open https://example.com && opencli browser state

opencli browser open https://example.com && opencli browser state

opencli browser eval "document.title"

opencli browser eval "JSON.stringify([...document.querySelectorAll('h2')].map(e => e.textContent))"

opencli browser eval "(function(){ const items = [...document.querySelectorAll('.item')]; return JSON.stringify(items.map(e => e.textContent)); })()"

opencli browser eval "document.querySelector('.title').textContent"

opencli browser eval "(document.querySelector('.title') || document.querySelector('h1') || {textContent:''}).textContent"

opencli browser eval "document.querySelector('.title')?.textContent ?? 'not found'"

opencli browser open https://news.ycombinator.com

opencli browser eval "JSON.stringify([...document.querySelectorAll('.titleline a')].slice(0,5).map(a => ({title: a.textContent, url: a.href})))"

opencli browser open https://httpbin.org/forms/post

# 1. Explore the website opencli browser open https://news.ycombinator.com

opencli browser open https://news.ycombinator.com

# 2. Discover APIs (crucial for high-quality adapters) opencli browser eval "fetch('/api/...').then(r=>r.json())"   # Trigger API calls

opencli browser eval "fetch('/api/...').then(r=>r.json())"   # Trigger API calls

opencli browser eval "fetch('/api/...').then(r=>r.json())"   # Trigger API calls

# 4. Edit the adapter (fill in func logic) # - If API found: use fetch() directly (Strategy.PUBLIC or COOKIE)

# - If API found: use fetch() directly (Strategy.PUBLIC or COOKIE)

func: async (_page, kwargs) => {     const limit = Math.min(Math.max(1, kwargs.limit ?? 5), 50);     const resp = await fetch('https://hacker-news.firebaseio.com/v0/topstories.json');

const limit = Math.min(Math.max(1, kwargs.limit ?? 5), 50);     const resp = await fetch('https://hacker-news.firebaseio.com/v0/topstories.json');     const ids = await resp.json();

const resp = await fetch('https://hacker-news.firebaseio.com/v0/topstories.json');

return Promise.all(       ids.slice(0, limit).map(async (id: number, i: number) => {         const item = await (await fetch(`https://hacker-news.firebaseio.com/v0/item/${id}.json`)).json();

ids.slice(0, limit).map(async (id: number, i: number) => {         const item = await (await fetch(`https://hacker-news.firebaseio.com/v0/item/${id}.json`)).json();         return { rank: i + 1, title: item.title, score: item.score, url: it

const item = await (await fetch(`https://hacker-news.firebaseio.com/v0/item/${id}.json`)).json();

**Always prefer API over UI** — if you discovered an API during browsing, use `fetch()` directly.

3. **Use `eval` for data extraction** — `eval "JSON.stringify(...)"` is faster than multiple `get` calls

opencli browser eval "document.querySelector('form').submit()"

opencli browser eval "document.querySelector('form').submit()"    # GOOD: construct the URL and navigate    opencli browser open "https://github.com/search?q=opencli&type=repositories"

opencli browser open "https://github.com/search?q=opencli&type=repositories"

5. **`evaluate` runs in browser context** — `page.evaluate()` in adapters executes inside the browser. Node.js APIs (`fs`, `path`, `process`) are NOT available. Use `fetch()` for network calls, DOM APIs for page data.

| 3. 模拟交互 | `browser_click` + `browser_wait_for` | 点击"字幕""评论""关注"等按钮 | | 4. 二次抓包 | `browser_network_requests` | 对比步骤 2，找出新触发的 API | | 5. 验证 API | `browser_evaluate` | `fetch(url, {credentials:'include'})` 测试返回结构 |

| 4. 二次抓包 | `browser_network_requests` | 对比步骤 2，找出新触发的 API | | 5. 验证 API | `browser_evaluate` | `fetch(url, {credentials:'include'})` 测试返回结构 | | 6. 写代码 | — | 基于确认的 API 写适配器 |

| 5. 验证 API | `browser_evaluate` | `fetch(url, {credentials:'include'})` 测试返回结构 |

|------------|------------| | 只用 `opencli explore` 命令，等结果自动出来 | 用浏览器工具打开页面，主动浏览 | | 直接在代码里 `fetch(url)`，不看浏览器实际请求 | 先在浏览器中确认 API 可用，再写代码 |

| 只用 `opencli explore` 命令，等结果自动出来 | 用浏览器工具打开页面，主动浏览 | | 直接在代码里 `fetch(url)`，不看浏览器实际请求 | 先在浏览器中确认 API 可用，再写代码 | | 页面打开后直接抓包，期望所有 API 都出现 | 模拟点击交互（展开评论/切换标签/加载更多） |

| 直接在代码里 `fetch(url)`，不看浏览器实际请求 | 先在浏览器中确认 API 可用，再写代码 |

1. browser_navigate → https://space.bilibili.com/{uid}/fans/follow

GET /x/relation/stat?vmid={uid}                    →  [200] 3. browser_evaluate → 验证 API:    fetch('/x/relation/followings?vmid=137702077&pn=1&ps=5', {credentials:'include'})

3. browser_evaluate → 验证 API:    fetch('/x/relation/followings?vmid=137702077&pn=1&ps=5', {credentials:'include'})    → { code: 0, data: { total: 1342, list: [{mid, uname, sign, ...}] } }

fetch('/x/relation/followings?vmid=137702077&pn=1&ps=5', {credentials:'include'})

opencli explore https://www.example.com --site mysite

# 在浏览器中打开目标页面，观察网络请求 opencli explore https://www.example.com --site mysite -v

opencli explore https://www.example.com --site mysite -v

opencli cascade https://api.example.com/hot

直接 fetch(url) 能拿到数据？

→ ✅ Tier 1: public（公开 API，不需要浏览器）   → ❌ fetch(url, {credentials:'include'}) 带 Cookie 能拿到？        → ✅ Tier 2: cookie（最常见，evaluate 步骤内 fetch）

→ ❌ fetch(url, {credentials:'include'}) 带 Cookie 能拿到？

const ps = Math.min(kwargs.limit ?? 50, 50); // 尊重 API 的 ps 上限   const payload = await fetchJson(page,     `https://api.example.com/list?pn=${pn}&ps=${ps}`

const payload = await fetchJson(page,     `https://api.example.com/list?pn=${pn}&ps=${ps}`   );

`https://api.example.com/list?pn=${pn}&ps=${ps}`

columns: ['rank', 'title', 'replies'],   func: async (_page, kwargs) => {     const res = await fetch('https://www.v2ex.com/api/topics/hot.json');

func: async (_page, kwargs) => {     const res = await fetch('https://www.v2ex.com/api/topics/hot.json');     const data = await res.json();

const res = await fetch('https://www.v2ex.com/api/topics/hot.json');

columns: ['rank', 'title', 'heat', 'answers'],   func: async (page, kwargs) => {     await page.goto('https://www.zhihu.com');  // 先加载页面建立 session

func: async (page, kwargs) => {     await page.goto('https://www.zhihu.com');  // 先加载页面建立 session     const data = await page.evaluate(`(async () => {

await page.goto('https://www.zhihu.com');  // 先加载页面建立 session     const data = await page.evaluate(`(async () => {       const res = await fetch('/api/v3/feed/topstory/hot-lists/total?limit=50', {

const data = await page.evaluate(`(async () => {       const res = await fetch('/api/v3/feed/topstory/hot-lists/total?limit=50', {         credentials: 'include'

const res = await fetch('/api/v3/feed/topstory/hot-lists/total?limit=50', {

columns: ['rank', 'title', 'type', 'author', 'votes'],   func: async (page, kwargs) => {     await page.goto('https://www.zhihu.com');

func: async (page, kwargs) => {     await page.goto('https://www.zhihu.com');     const data = await page.evaluate(`(async () => {

await page.goto('https://www.zhihu.com');

const data = await page.evaluate(`(async () => {       const q = encodeURIComponent('${kwargs.query}');       const res = await fetch('/api/v4/search_v3?q=' + q + '&t=general&limit=${kwargs.limit}', {

const q = encodeURIComponent('${kwargs.query}');       const res = await fetch('/api/v4/search_v3?q=' + q + '&t=general&limit=${kwargs.limit}', {         credentials: 'include'

const res = await fetch('/api/v4/search_v3?q=' + q + '&t=general&limit=${kwargs.limit}', {

columns: ['rank', 'user', 'action', 'content', 'note', 'time'],   func: async (page, kwargs) => {     await page.goto('https://www.xiaohongshu.com/notification');

func: async (page, kwargs) => {     await page.goto('https://www.xiaohongshu.com/notification');     await page.wait(3);

await page.goto('https://www.xiaohongshu.com/notification');

columns: ['rank', 'author', 'text', 'likes'],   func: async (page, kwargs) => {     await page.goto('https://x.com');

func: async (page, kwargs) => {     await page.goto('https://x.com');     const data = await page.evaluate(`

await page.goto('https://x.com');

const variables = JSON.stringify({ rawQuery: '${kwargs.query}', count: 20 });         const url = '/i/api/graphql/xxx/SearchTimeline?variables=' + encodeURIComponent(variables);         const res = await fetch(url, { headers, credentials: '

const url = '/i/api/graphql/xxx/SearchTimeline?variables=' + encodeURIComponent(variables);         const res = await fetch(url, { headers, credentials: 'include' });         return await res.json();

const res = await fetch(url, { headers, credentials: 'include' });

columns: ['rank', 'title', 'likes', 'url'],   func: async (page, kwargs) => {     await page.goto(`https://www.xiaohongshu.com/user/profile/${kwargs.id}`);

func: async (page, kwargs) => {     await page.goto(`https://www.xiaohongshu.com/user/profile/${kwargs.id}`);     await page.wait(5);

await page.goto(`https://www.xiaohongshu.com/user/profile/${kwargs.id}`);

title: note.display_title || '',              likes: note.interact_info?.liked_count || '0',              url: `https://explore/${note.note_id || note.id}`

likes: note.interact_info?.liked_count || '0',              url: `https://explore/${note.note_id || note.id}`            });

url: `https://explore/${note.note_id || note.id}`

// Step 1: 建立 Session     await page.goto(`https://www.bilibili.com/video/${kwargs.bvid}/`);

await page.goto(`https://www.bilibili.com/video/${kwargs.bvid}/`);

// Step 5: 拉取最终数据 (CDN JSON)     const items = await page.evaluate(`(async () => {       const res = await fetch(${JSON.stringify('https:' + url)});

const items = await page.evaluate(`(async () => {       const res = await fetch(${JSON.stringify('https:' + url)});       const json = await res.json();

const res = await fetch(${JSON.stringify('https:' + url)});

# 一键：探索 → 分析 → 合成 → 注册 opencli generate https://www.example.com --goal "hot"

opencli generate https://www.example.com --goal "hot"

# 或分步执行： opencli explore https://www.example.com --site mysite           # 发现 API

opencli explore https://www.example.com --site mysite           # 发现 API

opencli explore https://www.example.com --auto --click "字幕,CC"  # 模拟点击触发懒加载 API

# 1. 启动录制（建议 --timeout 给足操作时间） opencli record "https://example.com/page" --timeout 120000

opencli record "https://example.com/page" --timeout 120000

browser: true pipeline:   - navigate: https://...

pipeline:   - navigate: https://...   - evaluate: |

- navigate: https://...

- evaluate: |       (async () => {         const res = await fetch('/approval/getList.json?procInsId=...', { credentials: 'include' });

(async () => {         const res = await fetch('/approval/getList.json?procInsId=...', { credentials: 'include' });         const data = await res.json();

const res = await fetch('/approval/getList.json?procInsId=...', { credentials: 'include' });

columns: ['step', 'operator', 'action', 'time'],   func: async (page, kwargs) => {     await page.goto('https://tae.alibaba-inc.com/expense/pc.html?_authType=SAML');

func: async (page, kwargs) => {     await page.goto('https://tae.alibaba-inc.com/expense/pc.html?_authType=SAML');     await page.wait(2);

await page.goto('https://tae.alibaba-inc.com/expense/pc.html?_authType=SAML');

await page.wait(2);     const result = await page.evaluate(`(async () => {       const res = await fetch('/approval/getList.json?taskId=&procInsId=${kwargs.proc_ins_id}', {

const result = await page.evaluate(`(async () => {       const res = await fetch('/approval/getList.json?taskId=&procInsId=${kwargs.proc_ins_id}', {         credentials: 'include'

const res = await fetch('/approval/getList.json?taskId=&procInsId=${kwargs.proc_ins_id}', {

| 现象 | 原因 | 解法 | |------|------|------| | 捕获 0 条请求 | 拦截器注入失败，或页面无 JSON API | 检查 daemon 是否运行：`curl localhost:19825/status` |

|------|------|------| | 捕获 0 条请求 | 拦截器注入失败，或页面无 JSON API | 检查 daemon 是否运行：`curl localhost:19825/status` | | 捕获量少（1~3 条） | 页面是只读详情页，首屏数据已在注入前发出 | 手动操作触发更多请求（搜索/翻页），或换用列表页 |

| 捕获 0 条请求 | 拦截器注入失败，或页面无 JSON API | 检查 daemon 是否运行：`curl localhost:19825/status` |

| 项目 | 示例 | |------|------| | **URL** | `https://x.com/jakevin7/lists` |

|------|------| | **URL** | `https://x.com/jakevin7/lists` | | **Goal** | 获取我的 Twitter Lists |

| **URL** | `https://x.com/jakevin7/lists` |

// Tier 2 (Cookie): 大多数情况 fetch('/api/endpoint', { credentials: 'include' }).then(r => r.json())

fetch('/api/endpoint', { credentials: 'include' }).then(r => r.json())

// Tier 3 (Header): 如 Twitter 需要额外 header const ct0 = document.cookie.match(/ct0=([^;]+)/)?.[1]; fetch('/api/endpoint', {

[Credential-related source omitted]

fetch('/api/endpoint', {

fetch(url) 直接能拿到？              → Tier 1: public   (TS pipeline, browser: false)

fetch(url, {credentials:'include'})？ → Tier 2: cookie   (TS pipeline 或 func())

[Credential-related source omitted]

columns: ['rank', 'title', 'value'],   func: async (page, kwargs) => {     await page.goto('https://www.example.com/target-page');

func: async (page, kwargs) => {     await page.goto('https://www.example.com/target-page');     const data = await page.evaluate(`(async () => {

await page.goto('https://www.example.com/target-page');     const data = await page.evaluate(`(async () => {       const res = await fetch('/api/target', { credentials: 'include' });

const data = await page.evaluate(`(async () => {       const res = await fetch('/api/target', { credentials: 'include' });       const d = await res.json();

const res = await fetch('/api/target', { credentials: 'include' });

func: async (page, kwargs) => {     // 1. 导航     await page.goto('https://www.example.com/target-page');

// 1. 导航     await page.goto('https://www.example.com/target-page');     await page.wait(3);

await page.goto('https://www.example.com/target-page');

columns: ['rank', 'name', 'value'],   func: async (page, kwargs) => {     await page.goto('https://x.com');

func: async (page, kwargs) => {     await page.goto('https://x.com');     const data = await page.evaluate(`(async () => {

await page.goto('https://x.com');

if (!ct0) return { error: 'Not logged in' };       const bearer = 'AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D...';       const res = await fetch('/i/api/graphql/QUERY_ID/Endpoint', {

const bearer = 'AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D...';       const res = await fetch('/i/api/graphql/QUERY_ID/Endpoint', {         headers: {

const res = await fetch('/i/api/graphql/QUERY_ID/Endpoint', {

# Browser (login required) opencli bloomberg news "https://..."      # 阅读 Bloomberg 文章全文 (link positional)

opencli bloomberg news "https://..."      # 阅读 Bloomberg 文章全文 (link positional)

opencli quark rm <id>                     # 删除文件

opencli twitter follow elonmusk          # 关注用户 opencli twitter unfollow elonmusk        # 取消关注 opencli twitter bookmark https://x.com/... # 收藏推文

opencli twitter unfollow elonmusk        # 取消关注 opencli twitter bookmark https://x.com/... # 收藏推文 opencli twitter unbookmark https://x.com/... # 取消收藏

opencli twitter bookmark https://x.com/... # 收藏推文

opencli twitter unbookmark https://x.com/... # 取消收藏

opencli twitter post "Hello world"       # 发布推文 (text positional) opencli twitter like https://x.com/...   # 点赞推文 (url positional) opencli twitter likes elonmusk           # 用户点赞列表

opencli twitter like https://x.com/...   # 点赞推文 (url positional)

opencli twitter likes elonmusk           # 用户点赞列表 opencli twitter reply https://x.com/... "Nice!" # 回复推文 (url + text positional) opencli twitter delete https://x.com/... # 删除推文 (url positional)

opencli twitter reply https://x.com/... "Nice!" # 回复推文 (url + text positional)

opencli twitter delete https://x.com/... # 删除推文 (url positional)

opencli twitter following elonmusk       # 用户的关注列表 (user positional) opencli twitter notifications --limit 20 # 通知列表 opencli twitter hide-reply https://x.com/... # 隐藏回复 (url positional)

opencli twitter notifications --limit 20 # 通知列表 opencli twitter hide-reply https://x.com/... # 隐藏回复 (url positional) opencli twitter download elonmusk        # 下载用户媒体 (username positional, 支持 --tweet-url)

opencli twitter hide-reply https://x.com/... # 隐藏回复 (url positional) opencli twitter download elonmusk        # 下载用户媒体 (username positional, 支持 --tweet-url) opencli twitter accept "群,微信"          # 自动接受含关键词的 DM 请求 (query positional)

opencli web read --url "https://..."     # 抓取任意网页并导出为 Markdown

opencli weixin download --url "https://mp.weixin.qq.com/s/xxx"  # 下载公众号文章为 Markdown

opencli youtube search "rust"            # 搜索视频 (query positional) opencli youtube video "https://www.youtube.com/watch?v=xxx"  # 视频元数据

opencli youtube video "https://www.youtube.com/watch?v=xxx"  # 视频元数据

opencli youtube transcript "https://www.youtube.com/watch?v=xxx"  # 获取视频字幕/转录