スマートフォンのカメラを、ローカルネットワーク経由でClaude Codeに接続します。
CCPhotoは、スマートフォンで写真を撮り、それを直接Claude Codeに送信できるMCPサーバーです。回路基板、ホワイトボード、ラベルなど、スマートフォンを何に向けても、Claudeはそれを即座に認識します。アプリのインストールは不要で、スマートフォンのブラウザのカメラがすべてを担います。
+----------+ WiFi +-----------+ MCP +-------------+
| Phone | photos, voice, | CCPhoto | image/text | Claude |
| Camera | mode switches | Server | data | Code |
| + Mic | <--------------- | (local) | <--------------- | |
+----------+ TTS, guidance +-----------+ send_to_phone +-------------+npx ccphoto --setup # One-time: register CCPhoto as an MCP serverその後は、Claude Codeで**「写真を撮って」**と言うだけです。Claudeが残りを処理します。
Related MCP server: phone-mcp
Claudeがcapture_photo MCPツールを呼び出します。
ターミナルにQRコードが表示されます。
スマートフォンでそれをスキャンすると、ブラウザにカメラページが開きます。
写真を撮ると、Claudeが直接画像を受け取ります。
アプリのインストールは不要です。スマートフォンのネイティブカメラは、<input capture> HTML属性を通じてアクセスされます。
サーバーは最初のcapture_photo呼び出しで起動し、セッション中ずっと実行され続けます。スマートフォンは接続されたままだので、QRコードを再スキャンする必用はありません。好きなだけ写真を撮ることができ、Claudeに頼めばそのいずれも取得できます。
スマートフォンがすでに接続されている状態でClaudeが再びcapture_photoを呼び出すと、スマートフォンにSSEプッシュ通知が届きます。キャプチャボタンが点滅して、Claudeが新し写真を待っていることを知らせます。タップして撮影するだけです。
Claudeはsend_to_phoneツールを使ってスマートフォンにコンテンツを送信できます。テキスト、マークダウン、画像がスマートフォンの折りたたみ可能なパネルに表示されます。これにより、スマートフォンはリファレンス画面になります。Claudeは、両手を使いながら配線手順、ピン配図、コードスニペッとなどを表示できます。
写真を撮ると、送信前に画像に描画できる注釈画面が表示されます。色付きペン（赤、青、緑、白）を使っいて、部品を丸で囲んだり、矢印を描いたり、注目したい領域を強調したりできます。「送信」をタップすると注釈付き画像がアップロードされ、「スキップ」をタップすると注釈なしの元の写真が送信されます。
スマートフォンのカメラから半リアルタイムのビデオストリームを開始します。Claudeはライブフィード（3秒ごとに1フレーム）を監視し、リアルタイムでガイダンスを提供します。Claudeが指示した場所にカメラを向けると、スマートフォンの画面に指示が表示されます。
カメラアクセスにはHTTPSが必要です。Android Chromeでは、証明書の警告を一度受け入れてください。現在はAndroid/Chromeのみ対応で、iOSサポートは予定されています。
スマートフォンのマイクボタンをタップしてClaudeに話しかけます。音声はブラウザ組み込みの音声認識APIを使って文字起こしされ、テキストとして送信されます。Claudeは、speak: trueを指定したsend_to_phoneを使うことで、音声で応答できます。スマートフォンがText-to-Speechでその応答を読み上げます。
これにより、ハンズフリー・ワークフローが可能になります。はんだごてを持ったまま質問し、画面を見ずに答えを聞くことができます。マイクボタンは、音声認識をサポートするブラウザ（Android Chrome）でのみ表示されます。
Claudeは、見たものに基づいて、スマートフォン上にリッチでコンテキストに応じたUIを生成できます。カメラを商品、部品、レシピなど、何にでも向けてください。Claudeはそれを分析し、カスタムのインタラクティブなインターフェースをスマートフォンの画面に送信します。
12種類のコンポーネント：Card、Text、Image、Metric、MetricGrid、Checklist、StepByStep、Alert、Table、Timer、Badge、Divider。Claudeはこれらをコンテキストに応じたレイアウトに組み合わせます。水やリチェックリスト付きの植物ケアカード、ピン図付きの回路部品テーブル、タイマー付きのステップバイステップ修理ガイドなどです。
send_to_phoneをui_specパラメータ付きで使用して、カスタムUIを生成します。
npx ccphoto --setupnpm install -g ccphoto
ccphoto --setupgit clone https://github.com/stepankaiser/ccphoto.git
cd ccphoto
npm install
npm run build
node dist/index.js --setup--setupを使用せずにMCPサーバーを手動で登録する場合は：
claude mcp add ccphoto -- npx ccphoto --mcpTool | Description | Parameters |
| サーバーを起動し、QRコードを表示します。スマートフォンがすでに接続されている場合は、代わりにプッシュ通知が送信されます。 | -- |
| 写真がアップロードされるか、タイムアウトが経過するまでブロックします。 |
|
| 最新の写真、またはファイル名で指定した特定の写真を返します。 |
|
| キャプチャされたすべての写真を、ファイル名、タイムスタンプ、サイズとともに一覧表示します。 | -- |
| テキスト、画像、またはリッチなジェネレーテブUIをスマートフォンの画面に送信します。スマートフォンが、指示、図、ピン配線図などのリファレンス画面になります。 |
|
| スマートフォンのカメラからライブビデオストリームを開始します。HTTPS証明書を生成し、QRコードを返します。 | -- |
| ライブカメラストリームから、鮮度を示すタイムスタンプ付きの最新フレームを取得します。 | -- |
CCPhotoは、Claude Codeなしで単独でも実行できます：
npx ccphoto # Start with defaults
npx ccphoto --port 4000 --output-dir ./photos # Custom port and directoryQRコードがターミナルに印字されます。それをスキャンして写真を撮ると、デスクに保存されます。サーバーは複数回のキャプチャにわたり起動し続けます。
Option | Description | Default |
| CCPhotoをClaude CodeのMCPサーバーとして登録します | -- |
| MCPサーバーとして実行します（Claude Code内部で使用されます） | -- |
| HTTPサーバーのポート |
|
| 写真が保存されるディレクトリ |
|
| ヘルプを表示します | -- |
Environment Variable | Description | Default |
| デフォルトの写真保存ディレクトリを上書きします |
|
セッショントークン -- サーバーセッションごとに暗号学的にランダムな32文字の16進トークンが生成されます。すべてのリクエストにトークンを含める必要があります。
タイミングセーフな比較 -- トークンの検証にはcrypto.timingSafeEqualを使用して、タイミング攻撃を防ぎます。
ローカルネットワークのみ -- サーバーはローカルネットワークのIPにバインドされます。データがネットワークの外に出ることはありません。
外部サービスなし -- 写真はスマートフォンとサーバーの間でLAN上のHTTPを通じて直接転送されます。クラウドにアップロードされることはありません。
コンピュータがWi-Fiに接続されていることを確認してください（一部の構成では、Ethernetだけでは不十分な場合があります）。CCPhotoは、スマートフォンが到達できるLAN IPアドレスを必用とします。
QRコードがスキャン可能な解像度で表示されるように、ターミナルのフォントサイズを大くするか、ターミナルの幅を狭くしてみてください。QRコードの下に表示されるURLをコピーして、スマートフォンのブラウザに手動で入カすることもできます。
カメラキャプチャ機能は一部のブラウザでHTTPSが必要ですが、ほとんどのモバイルブラウザでは、ローカルネットワークアドレスに対して平文HTTPを許可しています。ブラウザがカメラアクセスをブロックする場合は、Safari（iOS）またはChrome（Android）をお試しください。
スマートフォンとコンピュータが同じWi-Fiネットワークに接続されていることを確認してください。クライアント分離が設定された企業ネットワークでは、デバイス間の通信がブロックされる場合があります。代わりに、個人用ホットスポットまたは自宅のネットワークをお試しください。
npm install # Install dependencies
npm run build # Compile TypeScript
npm run dev # Watch mode (recompile on change)
npm test # Run the test suite (94 tests)テストはNode.js組み込みのテストランナーを使用し、TypeScript実行にはtsx開発依存関係が必要です。
プロジェクト構成：
src/
index.ts CLI entry point and arg parsing
mcp.ts MCP server with tool definitions
server.ts HTTP server, SSE, upload handling
mobile-page.ts Self-contained HTML for the phone camera page
storage.ts Photo file management
network.ts Local IP detection
token.ts Session token generation and validation
types.ts Shared TypeScript interfaces実ドメイン + Let's Encrypt証明書 -- iOS Safarariを含むすべのデバイスでブラウザ警告をゼロにするため、有効な証明書を持つ登録ドメインを使用します。
iOSラブビデオ対応 -- ラブビデオストリーミングは現在Android/Chromeで動作します。iOS Safarari対応には信賴できる証明書が必要です。
カメラフードへのARオーバーレイ -- ラブのカメラビューに注釈をリアルタイムで直接描きます。
マルチカメラ対応 -- 複数のスマートフォンを同時に接続して、異なる視角を実現します。
WebRTCストリーミング -- Claudeのビジョン処理のレテンシが改蓋されたら、HTTPフレーポーリングをWebRTCに置き換えます。
貢献を歓迎します。
リポジトりをフォークします
フイチャーブランチを作成します（git checkout -b my-feature）
変更を加えます
npm testを実行して、何も壊れていないことを確認します
変更をコッミトします（git commit -m "Add my feature"）
ブランチにプッシュします（git push origin my-feature）
プルリクエストを開きます
バグを報告する際は、Node.jsバージョン、OS、再現手順を含めてください。
This server cannot be deployed
Turns a phone into a camera+Bluetooth remote so AI assistants can see and control any PC.
Drive real devices from your AI Coding tool. Embed a client SDK (Unity, Godot, Flutter, iOS/macOS, Android, React Native, Web) in your app, then capture screenshots, traverse the UI tree, inject taps and key events, and run automated test tasks on the physical device over a secure relay.
Remote streamable-HTTP MCP server running on a single Cloudflare Worker. Your assistant gets live Airbnb, Amazon, Booking.com, Google Flights, Maps and Reddit data, social search on X, Instagram and TikTok, the Meta Ad Library, and image/video generation without any keys. Connect your own accounts to let it send WhatsApp or Telegram messages, work an IMAP inbox, manage Meta Ads campaigns and publish to X and LinkedIn. OAuth 2.1 with PKCE; stored credentials are AES-256-GCM encrypted.
Run Instagram automation on your own real phones from Claude, Cursor or any AI agent.
