Neo

あらゆるWebアプリケーションをAPIに変える。 公式APIは不要。ブラウザ自動化も不要。

NeoはChrome拡張機能で、ブラウザが発行するすべてのAPI呼び出しを受動的にキャプチャし、パターンを学習し、AI（またはユーザー）が直接リプレイできるようにします。

問題点

現在、Webアプリケーションを操作するAIエージェントには、どちらも欠点のある2つの選択肢しかありません。

アプローチ	問題点
公式API	ほとんどのSaaSにはAPIがないか、機能の10%しか公開していない
ブラウザ自動化	スクリーンショット → OCR → クリック。遅く、脆弱で、UI変更のたびに壊れる

Neoは第三の方法です。 あらゆるWebアプリケーションにはすでに完全な内部APIが存在します。何かをクリックするたびにフロントエンドがそのAPIを呼び出しています。Neoはそれらの呼び出しをキャプチャし、リプレイ可能にします。

v2: UI自動化を追加。 Neo v2では、アクセシビリティツリーに基づくUIレイヤー（snapshot、click、fill、type、press、hover、scroll、select、screenshot、get、wait）を追加しました。APIが存在する場合は直接使用し、存在しない場合は同じCLIを通じてUIを操作できます。1つのツールで両方のレイヤーをカバーします。

仕組み

通常通りブラウジング → NeoがすべてのAPIトラフィックを記録 → スキーマを自動生成 → AIがAPIを直接リプレイ
                                                                      → またはa11yツリー経由でUIを操作

1. キャプチャ（常時オン）

Chrome拡張機能は、すべてのfetch()とXMLHttpRequest（URL、ヘッダー、リクエスト/レスポンスボディ、タイミング、さらにどのDOM要素が呼び出しをトリガーしたか）をインターセプトします。

2. 学習

ドメイン上でneo-schemaを実行すると、APIマップ（エンドポイント、必要な認証ヘッダー、クエリパラメータ、レスポンス構造、エラーコード）が自動生成されます。

3. 実行

Chrome DevTools Protocolを介して、ブラウザタブのコンテキスト内でAPI呼び出しを実行します。Cookie、CSRFトークン、セッション認証はすべて自動的に継承されます。トークン管理は不要です。

対応ブラウザ

ブラウザ	タイプ	最適な用途
Chrome / Chromium	フルブラウザ	APIキャプチャ + UI自動化（デフォルト）
Lightpanda	ヘッドレス（Zig）	AIエージェント、スクレイピング — 11倍高速、9倍メモリ節約

クイックスタート

git clone https://github.com/4ier/neo.git
cd neo && npm install && npm run build
npm link  # `neo`をグローバルで使用可能に

拡張機能を読み込む:

chrome://extensions を開く
「デベロッパーモード」を有効にする
「パッケージ化されていない拡張機能を読み込む」→ extension/dist/ を選択
任意のWebサイトをブラウジング — Neoがすぐにキャプチャを開始

Lightpanda（ヘッドレス、拡張機能不要）

# Lightpandaをインストール
curl -L -o lightpanda https://github.com/lightpanda-io/browser/releases/download/nightly/lightpanda-x86_64-linux
chmod +x lightpanda && sudo mv lightpanda /usr/local/bin/

# Lightpandaを使用するようNeoを設定
# ~/.neo/config.json 内:
# { "chromePath": "/usr/local/bin/lightpanda", "browserType": "lightpanda", "cdpPort": 9222 }

neo start    # Lightpanda CDPサーバーを起動
neo connect  # 接続
neo open https://example.com
neo snapshot # 完全なa11yツリー

CLIツール

すべてのコマンドは単一のCLI neo <command> を介して実行します。

CDP（Chrome DevTools Protocol）が有効なブラウザが必要です。

# --- 接続とセッション ---
neo connect [port]                          # CDPに接続し、セッションを保存
neo connect --electron <app-name>           # ElectronアプリのCDPポートを自動検出
neo launch <app> [--port N]                 # CDPを有効にしてElectronアプリを起動
neo discover                                # localhostで到達可能なCDPエンドポイントを検出
neo sessions                                # 保存されたセッションを一覧表示
neo tab                                     # アクティブセッションのCDPターゲットを一覧表示
neo tab <index> | neo tab --url <pattern>   # アクティブタブのターゲットを切り替え
neo inject [--persist] [--tab pattern]      # Neoキャプチャスクリプトをターゲットに注入

# --- キャプチャとトラフィック ---
neo status                                  # キャプチャデータの概要
neo capture summary                         # クイック概要
neo capture list github.com --limit 10      # リプレイ/詳細用のIDを表示
neo capture list --since 1h                 # 時間フィルター
neo capture domains
neo capture search "CreateTweet" --method POST
neo capture watch x.com                     # ライブテール（tail -f と同様）
neo capture stats x.com                     # メソッド/ステータス/タイミングの内訳
neo capture export x.com --since 2h > x.json
neo capture export x.com --format har > x.har  # Postman/devtools向けHAR 1.2
neo capture import x-captures.json
neo capture prune --older-than 7d
neo capture gc x.com [--dry-run]            # スマート重複排除

# --- APIリプレイと実行 ---
neo replay <capture-id> --tab x.com         # キャプチャした呼び出しをリプレイ
neo exec <url> --method POST --body '{...}' --tab example.com --auto-headers
neo api x.com HomeTimeline                  # スマート呼び出し（スキーマ検索 + 自動認証）

# --- スキーマと分析 ---
neo schema generate x.com                   # キャプチャから生成
neo schema generate --all                   # 全ドメインを一括
neo schema show x.com [--json]
neo schema openapi x.com                    # OpenAPI 3.0仕様をエクスポート
neo schema diff x.com                       # 以前のバージョンからの変更点
neo schema coverage                         # スキーマがある/ないドメイン
neo label x.com [--dry-run]                 # セマンティックエンドポイントラベル
neo flows x.com [--window 5000]             # API呼び出しシーケンスパターン
neo deps x.com [--min-confidence 1]         # レスポンス→リクエストのデータ依存関係
neo workflow discover|show|run <name>       # マルチステップワークフローの発見とリプレイ
neo suggest x.com                           # AI機能分析
neo export-skill x.com                      # エージェント対応のSKILL.mdを生成

# --- UI自動化（v2） ---
neo snapshot [-i] [-C] [--json]             # @refマッピング付きa11yツリー
neo click @ref [--new-tab]                  # @refで要素をクリック
neo fill @ref "text"                        # 入力欄をクリアしてテキストを入力
neo type @ref "text"                        # 入力欄にテキストを追加
neo press <key>                             # キーボードキー（Ctrl+a、Enterなど対応）
neo hover @ref                              # 要素にホバー
neo scroll <dir> [px] [--selector css]      # 方向指定でスクロール
neo select @ref "value"                     # ドロップダウンの値を設定
neo screenshot [path] [--full] [--annotate] # スクリーンショットを撮る
neo get text @ref | neo get url | neo get title  # 情報を取得
neo wait @ref | neo wait --load networkidle | neo wait <ms>  # 要素/ロード/時間を待機

# --- ページ操作 ---
neo read github.com                         # 読みやすいテキストを抽出
neo eval "document.title" --tab github.com  # ページ内でJSを実行
neo open https://example.com                # URLを開く

# --- モックとブリッジ ---
neo mock x.com [--port 8080 --latency 200]  # スキーマからモックサーバーを生成
neo bridge [--json] [--interactive]          # リアルタイムWebSocketキャプチャストリーム

# --- 診断 ---
neo doctor                                  # Chrome、拡張機能、スキーマをチェック
neo reload                                  # CLIから拡張機能をリロード
neo tabs [filter]                           # 開いているChromeタブを一覧表示

セッションとマルチアプリ対応

NeoはChromeだけではありません。CDPをサポートする任意のアプリ（Electronアプリを含む）で動作します：

# VS CodeをCDPで起動して接続
neo launch code --port 9230
neo snapshot                # VS Codeのアクセシビリティツリーを表示
neo click @14               # メニュー項目をクリック

# または、すでに実行中のElectronアプリに接続
neo connect --electron slack

# Neoのキャプチャスクリプトを任意のCDPターゲットに注入
neo inject --persist        # ページナビゲーション後も持続
neo inject --tab slack      # 特定のタブをターゲット

セッションは自動的に保存されます。`--session`で切り替え：

```bash
neo --session vscode snapshot
neo --session chrome api x.com HomeTimeline

UI自動化（v2）

Neo v2では、アクセシビリティツリーに基づく完全なUI操作レイヤーを追加しました。スクリーンショット、座標、ピクセルマッチングは不要です：

# 1. スナップショットを撮る — 各インタラクティブ要素に@refが付与される
neo snapshot
#  @1  button "Sign in"
#  @2  textbox "Search"
#  @3  link "Pricing"

# 2. @refで操作
neo click @1
neo fill @2 "AI agents"
neo press Enter
neo screenshot results.png --full

これにより、AIエージェントは高速かつセマンティックな方法で任意のUIと対話できます。APIキャプチャと組み合わせてデュアルチャネルアプローチを実現：APIが存在する場合はAPIを使用し、存在しない場合はUIにフォールバックします。

ブリッジは、拡張機能とCLIの間に永続的なWebSocketチャネルを作成します。拡張機能は自動的にws://127.0.0.1:9234に接続し、すべてのキャプチャをリアルタイムでストリームします。インタラクティブモードでは、拡張機能に直接クエリを実行できます：ping、status、capture.count、capture.list、capture.domains、capture.search、capture.clear。

アーキテクチャ

┌──────────────────────────────────────┐
│  Chrome / Electron App (CDP)          │
│                                       │
│  inject/interceptor.ts                │
│    ├─ fetchとXHRをモンキーパッチ      │
│    ├─ WebSocket/SSEをインターセプト   │
│    ├─ DOMトリガーを追跡（クリック →   │
│    │   API相関）                      │
│    └─ 完全なリクエスト/レスポンスを記録│
│                                       │
│  content/index.ts                     │
│    └─ ページ ↔ 拡張機能のブリッジ     │
│                                       │
│  background/index.ts                  │
│    ├─ IndexedDB (Dexie) に永続化      │
│    ├─ ドメインあたり上限（500エントリ）│
│    └─ WebSocketブリッジクライアント    │
│                                       │
└────────────────┬──────────────────────┘
                 │ Chrome DevTools Protocol
┌────────────────┴──────────────────────┐
│  CLI: neo (Node.js)                    │
│                                        │
│  レイヤー1: APIキャプチャとリプレイ     │
│  ├─ neo capture → トラフィック管理     │
│  ├─ neo schema  → API発見             │
│  ├─ neo exec    → ブラウザ内で実行     │
│  ├─ neo api     → スマートスキーマ呼出 │
│  ├─ neo replay  → キャプチャ再実行    │
│  └─ neo flows/deps → パターン分析     │
│                                        │
│  レイヤー2: UI自動化（v2）              │
│  ├─ neo snapshot → a11yツリー + @refs  │
│  ├─ neo click/fill/type/press/hover    │
│  ├─ neo scroll/select/screenshot       │
│  └─ neo get/wait                       │
│                                        │
│  セッション管理                         │
│  ├─ neo connect/launch/discover        │
│  ├─ neo tab → ターゲット切り替え       │
│  └─ neo inject → スクリプト注入        │
│                                        │
└────────────────┬──────────────────────┘
                 │
┌────────────────┴──────────────────────┐
│  AIエージェント（OpenClaw / 任意のLLM） │
│  ├─ API優先: schema → exec/api        │
│  ├─ UIフォールバック: snapshot → click │
│  └─ デュアルチャネル自動化             │
└───────────────────────────────────────┘

実世界デモ

キャプチャしたAPI経由でツイートを投稿

# 1. Xを通常通りブラウジング — NeoがGraphQLミューテーションをキャプチャ
neo schema show api.x.com

# 2. CreateTweetエンドポイントを検索
neo capture search "CreateTweet" --method POST

# 3. 元の認証でリプレイ（Cookieは自動継承）
neo replay abc123 --tab x.com

# 4. または、自動検出された認証ヘッダーで新しい呼び出しを作成
neo exec "https://x.com/i/api/graphql/.../CreateTweet" \
  --method POST --auto-headers \
  --body '{"variables":{"tweet_text":"Hello from Neo!"},...}'

ボタンの動作を理解する

Neoのトリガー追跡は、UI操作をAPI呼び出しにマッピングします：

neo schema show github.com
# 出力例:
#   POST /repos/:owner/:repo/star  (3x, 280ms)
#     ← click button.js-social-form "Star" (3x)

APIトラフィックをライブ監視

neo capture watch api.openai.com
# 14:23:01  POST 200 /v1/chat/completions (1230ms)
# 14:23:05  SSE_MSG 200 /v1/chat/completions (0ms) [sse]

ストレージ

ドメインあたり上限: ドメインあたり最大500キャプチャ、古いものから自動削除
ボディ切り詰め: レスポンスボディは100KBで打ち切り
保存場所: ChromeのIndexedDB（neo-capture-v01データベース）
スキーマ: JSONファイルとしてエクスポート可能で、デバイス間で永続化

スマートフィルタリング

インターセプターはノイズを自動的に除外します：

静的アセット（画像、フォント、CSS、JSバンドル）
分析/トラッキング（Google Analytics、Meta Pixel、Sentryなど）
ブラウザ内部（chrome-extension://、data:、blob:）
レート制限: URLパターンあたり毎分最大3キャプチャ（ポーリングエンドポイントの肥大化防止）

セキュリティとプライバシー

Neoは完全にローカルで動作します。外部サーバー、テレメトリはなく、データがマシンから流出することはありません。

Neoがキャプチャするもの: ブラウザがすべてのWebサイトで発行するすべてのfetch/XHR/WebSocket呼び出し。これは強力ですが、設計上侵入的です。

認証ヘッダーの秘匿化（v1.1.0以降）: 認証ヘッダーの値（Bearerトークン、CSRFトークン、Cookie、セッションID）は、キャプチャ時に保存前に秘匿化されます。IndexedDBにはヘッダー名のみが保存され、値は保存されません。--auto-headersでAPI呼び出しを実行する際は、CDPを介してブラウザからリアルタイムでライブ認証ヘッダーを取得します。保存された資格情報をリプレイすることは決してありません。

知っておくべきこと:

推奨事項:

キャプチャしたドメインを定期的に確認: neo capture domains
機密性の高いキャプチャを削除: neo capture clear banksite.com
他のユーザーがローカルアクセスできる共有マシンにはNeoをインストールしない
CDPポート（9222）をlocalhostの外部に公開しない

Neoは、プライバシー上のトレードオフを機能性で相殺する開発者ツールです。十分に理解した上で使用してください。

技術スタック

TypeScript、Vite（マルチエントリビルド）
Chrome Manifest V3
Dexie.js（IndexedDBラッパー）
CLI ↔ ブラウザ通信にChrome DevTools Protocol
バックエンドサーバーなし、実行時に外部依存関係なし

ロードマップ

ライセンス

MIT

キャプチャ範囲	`<all_urls>` — NeoはすべてのWebサイト（銀行、メール、医療ポータルを含む）のトラフィックを監視します
コンテンツスクリプト	`MAIN`ワールドで実行（ページとJSコンテキストを共有）し、fetch/XHRをインターセプト
CDPポート	CLIはChromeのポート9222を必要とします。ローカルプロセスであれば誰でもこのポートに接続可能
レスポンスボディ	IndexedDBに保存（100KBに切り詰め）。APIレスポンスから個人データを含む可能性あり
スキーマファイル	エンドポイント構造のみを保存（パス、ヘッダー名、レスポンス形状）。資格情報やユーザーデータは含まない
エクスポート	`neo capture export`はデフォルトで認証情報を秘匿化。`--include-auth`は明示的なオプトインが必要

人気

neo

Neo

問題点

仕組み