CLI-ONESHOT — シングルショット高速CLI生成

URLと1行の説明を与えると、4ステップでCLIコマンドを生成します。 完全なサイト探索開発については、opencli-explorer skill を参照してください。

---

入力

項目	例
URL	https://x.com/jakevin7/lists
Goal	自分のTwitter Listsを取得する

---

プロセス

Step 1: ページを開く + パケットキャプチャ

1. browser_navigate → 対象URLを開く
2. 3-5秒待機（ページロード完了、API要求トリガー）
3. browser_network_requests → JSON APIをフィルタリング

重要：application/json を返すリクエストのみに注目し、静的リソースは無視します。 APIが自動トリガーされない場合、対象ボタン/タブを手動クリックして再度キャプチャします。

Step 2: 1つのエンドポイントを特定

キャプチャ結果からその目標APIを見つけます。以下のフィールドを確認します：

フィールド	確認内容
URL	APIパターン（例：/i/api/graphql/xxx/ListsManagePinTimeline）
Method	GET / POST
Headers	Cookie? Bearer? CSRF? カスタム署名?
Response	データパス（例：data.list.lists）

Step 3: エンドポイントを検証し再現可能性を確認

browser_evaluate で fetch を使用してリクエストを再現します：

// Tier 2 (Cookie): ほとんどの場合
fetch('/api/endpoint', { credentials: 'include' }).then(r => r.json())

// Tier 3 (Header): Twitterなど追加ヘッダーが必要な場合
const ct0 = document.cookie.match(/ct0=([^;]+)/)?.[1];
fetch('/api/endpoint', {
  headers: { 'Authorization': 'Bearer ...', 'X-Csrf-Token': ct0 },
  credentials: 'include'
}).then(r => r.json())

fetchでデータが取得できた → TSアダプター（cli() パイプラインまたは func()）を使用します。 fetchでデータが取得できない（署名/リスク制御）→ interceptステラテジー（TS func() + installInterceptor）を使用します。

Step 4: テンプレートに当てはめ、アダプターを生成

Step 3で判定したストラテジーに基づいて、テンプレートを選択しファイルを生成します。

---

認証クイックリファレンス

fetch(url) で直接取得可能？              → Tier 1: public   (TS pipeline, browser: false)
fetch(url, {credentials:'include'})？     → Tier 2: cookie   (TS pipeline または func())
Bearer/CSRFヘッダー追加で取得可能？       → Tier 3: header   (TS func())
どれも不可だが、ページ自体が正常にリクエスト可能？ → Tier 4: intercept (TS func(), installInterceptor)

---

テンプレート

TS — Cookie/Public（最小限、func() モード）

// clis/<site>/<name>.ts
import { cli, Strategy } from '@jackwener/opencli/registry';

cli({
  site: 'mysite',
  name: 'mycommand',
  description: '1行説明',
  domain: 'www.example.com',
  strategy: Strategy.COOKIE,   // または Strategy.PUBLIC (browser: false を追加)
  browser: true,
  args: [
    { name: 'limit', type: 'int', default: 20 },
  ],
  columns: ['rank', 'title', 'value'],
  func: async (page, kwargs) => {
    await page.goto('https://www.example.com/target-page');
    const data = await page.evaluate(`(async () => {
      const res = await fetch('/api/target', { credentials: 'include' });
      const d = await res.json();
      return (d.data?.items || []).map(item => ({
        title: item.title,
        value: item.value,
      }));
    })()`);
    return (data as any[]).slice(0, kwargs.limit).map((item, i) => ({
      rank: i + 1,
      title: item.title || '',
      value: item.value || '',
    }));
  },
});

TS — Intercept（パケットキャプチャモード）

// clis/<site>/<name>.ts
import { cli, Strategy } from '@jackwener/opencli/registry';

cli({
  site: 'mysite',
  name: 'mycommand',
  description: '1行説明',
  domain: 'www.example.com',
  strategy: Strategy.INTERCEPT,
  browser: true,
  args: [
    { name: 'limit', type: 'int', default: 20 },
  ],
  columns: ['rank', 'title', 'value'],
  func: async (page, kwargs) => {
    // 1. ナビゲート
    await page.goto('https://www.example.com/target-page');
    await page.wait(3);

    // 2. インターセプター注入（URL部分文字列マッチ）
    await page.installInterceptor('target-api-keyword');

    // 3. APIトリガー（スクロール/クリック）
    await page.autoScroll({ times: 2, delayMs: 2000 });

    // 4. インターセプト済みレスポンスを読み取る
    const requests = await page.getInterceptedRequests();
    if (!requests?.length) return [];

    let results: any[] = [];
    for (const req of requests) {
      const items = req.data?.data?.items || [];
      results.push(...items);
    }

    return results.slice(0, kwargs.limit).map((item, i) => ({
      rank: i + 1,
      title: item.title || '',
      value: item.value || '',
    }));
  },
});

TS — Header（Twitter GraphQLなど）

import { cli, Strategy } from '@jackwener/opencli/registry';

cli({
  site: 'twitter',
  name: 'mycommand',
  description: '1行説明',
  domain: 'x.com',
  strategy: Strategy.HEADER,
  browser: true,
  args: [
    { name: 'limit', type: 'int', default: 20 },
  ],
  columns: ['rank', 'name', 'value'],
  func: async (page, kwargs) => {
    await page.goto('https://x.com');
    const data = await page.evaluate(`(async () => {
      const ct0 = document.cookie.match(/ct0=([^;]+)/)?.[1];
      if (!ct0) return { error: 'Not logged in' };
      const bearer = 'AAAAAAAAAAAAAAAAAAAAANRILgAAAAAAnNwIzUejRCOuH5E6I8xnZz4puTs%3D...';
      const res = await fetch('/i/api/graphql/QUERY_ID/Endpoint', {
        headers: {
          'Authorization': 'Bearer ' + decodeURIComponent(bearer),
          'X-Csrf-Token': ct0,
          'X-Twitter-Auth-Type': 'OAuth2Session',
        },
        credentials: 'include',
      });
      return res.json();
    })()`);
    // data を解析...
    return [];
  },
});

---

テスト（必須）

npm run build                              # 文法チェック
opencli list | grep mysite                 # 登録確認
opencli mysite mycommand --limit 3 -v      # 実行

---

以上です

ファイルを書く → build → run → 提出。問題がある場合は opencli-explorer skill を参照してください。