3dstreet

3dstreet-mcp

Claude Desktop または Claude Code から、ブラウザーで実行中の 3DStreet シーンを操作できる Model Context Protocol リレーです。

このツールは適切ですか？ このリレーは、WebMCP を利用できない MCP クライアント向けの代替手段です。エージェントがブラウザー内で実行される場合（ChatGPT のデスクトップブラウザー、Gemini in Chrome、WebMCP オリジントライアルまたは chrome://flags/#enable-webmcp-testing を有効にした Chrome 149 以降）は、このパッケージは必要ありません。https://3dstreet.app を開くと、ページが document.modelContext を介して同じツールをブラウザーに登録します。インストールもペアリングも不要です。3DStreet WebMCP ドキュメントをご覧ください。このリレーは、独自のブラウザーを持たないクライアント、または WebMCP に対応していないクライアント（Claude Desktop、Claude Code、Cursor、ヘッドレススクリプト）でのみ使用してください。これらのクライアントが WebMCP をネイティブに読み取れるようになった時点で、このリレーは廃止されます。

MCP Registry には app.3dstreet/3dstreet として掲載されています。

ステータス：アルファ版 — プロトコルは変更される可能性があります。 3DStreet#1582（設計）と 3DStreet#1600（ブラウザー側）に対応しています。シーンの作成は任意の 3dstreet.app タブで動作します。保存と地理空間機能を利用するには、無料の 3DStreet アカウントが必要です。

仕組み

Claude Desktop  ── stdio MCP ──▶  3dstreet-mcp  ── ws://127.0.0.1:51735 ──▶  3DStreet tab
or Claude Code                    (this package)                              (your browser)

リレーは stdio 経由で MCP を通信し、すべての tools/list と tools/call を localhost WebSocket 経由で 3DStreet タブに中継します。実際の処理はタブが行います。すでにサインイン済みで、カタログが読み込まれており、クラウド保存のフローも担います。リレーは単純な中継役です。

認証トークンが WebSocket を通過することはありません。リレーのポートは 127.0.0.1 のみにバインドされ、3DStreet の許可リスト（https://3dstreet.app、https://dev-3dstreet.web.app、http://localhost:3333、http://127.0.0.1:3333）以外のオリジンからの WebSocket アップグレード要求を拒否します。

セットアップ

Claude Desktop

~/Library/Application Support/Claude/claude_desktop_config.json （macOS）または %APPDATA%/Claude/claude_desktop_config.json（Windows）を編集します。

{
  "mcpServers": {
    "3dstreet": {
      "command": "npx",
      "args": ["-y", "3dstreet-mcp"]
    }
  }
}

Claude Desktop を再起動します。

Claude Code

claude mcp add 3dstreet -- npx -y 3dstreet-mcp

ブラウザータブをペアリングする

起動時に、リレーは次のような自動ペアリング URL をログに出力します。

open this URL to pair a 3DStreet tab: https://3dstreet.app/#mcp

サインイン済みのブラウザーでその URL を開くと、エディターが #mcp フラグメントを検出してAI アシスタントペインを開き、 自動的にリレーとペアリングします。コンソールコマンドは不要です。（デフォルト以外のポートでリレーを実行した場合、URL は https://3dstreet.app/#mcp=PORT のようになります。）

手動でペアリングする場合は、https://3dstreet.app を開き、右側のパネルで AI アシスタントをクリックし、/mcp と入力して、 再接続をクリックします。

これで Claude に次のような質問や指示を出せます。

• 「現在のシーンには何がありますか？」
• 「道路の左側に自転車レーンを追加して。」
• 「環境プリセットを夜に変更して。」

ステータスバーの読み取り専用を切り替えると、シーンの変更をブロックできます （シーンの説明だけを Claude に求める場合に便利です）。

CLI

3dstreet-mcp [options]

Options:
  -p, --port <number>    WebSocket port (default 51735)
  -o, --origin <url>     Origin used in the printed auto-pair URL and
                         the MCP `instructions` hint (default
                         https://3dstreet.app — set to
                         http://localhost:3333 when running 3DStreet
                         from a local dev server)
  -h, --help             Show this help
  -v, --version          Print version and exit

別のポートが必要な場合（たとえば、2 つの Claude クライアントを 2 つの異なるタブに接続する場合）は、--port を指定して、リレーが出力する自動ペアリング URL（https://3dstreet.app/#mcp=PORT）を開きます。この URL により、ポートの選択と自動ペアリングが行われます。

ローカルで 3DStreet を開発する場合は、--origin に開発サーバーを指定すると、出力される URL と LLM の instructions に含まれるヒントの両方が、適切なタブを参照します。

node src/cli.js --origin http://localhost:3333
# → open this URL to pair a 3DStreet tab: http://localhost:3333/#mcp

LLM にペアリング方法を伝える

リレーは、initialize のたびに instructions 文字列を返します（これは任意の MCP フィールドであり、クライアントは LLM のシステムプロンプトに組み込むことができます）。この文字列では、シーンツールがペアリング済みのタブに転送されること、自動ペアリング URL、タブが接続されていない場合にその URL をユーザーに提示することをモデルに説明します。これにより、不明瞭なツール呼び出しのタイムアウトを待つのではなく、LLM がユーザーを積極的にペアリングへ案内できます。

このリレーのセッションでタブが一度もペアリングされていない場合、tools/call は 30 秒間キューに入れるのではなく、エラーメッセージに自動ペアリング URL を含めて即座に失敗します。タブが一度ペアリングされると、短時間の切断ではキューに入れて再試行する動作に戻り、再接続したピアが処理中の呼び出しを完了できるようになります。

公開されているツール

ツール一覧はペアリング時に接続されたブラウザータブから取得されるため、エディターのコマンドレジストリで公開されている内容と常に一致します。#1600 時点では、以下が含まれます。

• 読み取り： getScene、getEntity、getSelectedEntity、 getManagedStreet、listMixins、getSessionInfo
• 選択／カメラ： selectEntity、focusCamera
• 変更： entityCreate、entityUpdate、entityRemove、 entityClone、entityReparent、componentAdd、componentRemove、 segmentAdd、segmentUpdate、segmentRemove、replaceManagedStreet、 …その他レジストリにあるツール
• 履歴： undo、redo

現在の一覧を確認するには、MCP クライアントから tools/list を実行してください。

ワイヤープロトコル（コントリビューター向け）

標準入出力側：行区切りの JSON-RPC 2.0、MCP 2024-11-05。

WebSocket 側：同じ JSON-RPC エンベロープを使用し、リレーが initialize／ping／通知をローカルで処理して、tools/list と tools/call のみを ピアに転送します。ピアは受信フレームに対して独自の ID を割り当て、返信は ID で 照合されます。

単一ピアのポリシー：最初に接続したブラウザータブがスロットを確保します。 2 つ目の接続は、理由が paired-elsewhere の WebSocket クローズコード 4001 で切断されます。

開発

git clone https://github.com/3DStreet/3dstreet-mcp.git
cd 3dstreet-mcp
npm install
npm test

実際の 3DStreet ビルドに対するスモークテスト：

# Terminal 1 — the relay, REPL-free, just stdio
node src/cli.js

# Terminal 2 — exercise it with the MCP inspector
npx @modelcontextprotocol/inspector node src/cli.js

ライセンス

AGPL-3.0-or-later。3DStreet と同じライセンスです。