AIコーダーのためのゼロ依存デバッグサーバー
- ブラウザエラーを自動収集
- エラー時のHTML状態を保存
- AIが
tail error.logで即把握
AIコーダーはブラウザが見えない:
- エラーが起きても「何が起きた？」と聞くしかない
- 人間がスクショを貼る往復が発生
- デバッグループが遅い
エラーとその瞬間の画面を自動保存:
ブラウザ → エラー発生 → 自動でログ + スナップショット
↓
AI: tail -1 error.log で確認
AI: head snapshots/snapshot_*.html で画面状態確認
AI: 修正
人間の介在なし。
# 依存なし、Node.jsのみ
node ai_dev_server.jsnode ai_dev_server.js
# → http://localhost:3000<!-- これだけでエラー収集、スナップショット、リモート操作が有効になります -->
<script src="http://localhost:3000/client.js"></script># 最新エラー（トークン効率）
tail -1 error.log
# スナップショット一覧
ls snapshots/
# スナップショット確認
head snapshots/snapshot_*.html| メソッド | パス | 説明 |
|---|---|---|
| POST | /error |
エラーログ記録 |
| POST | /snapshot |
HTMLスナップショット保存 |
| POST | /snapshot/request?label=xxx |
E2Eからスナップショット要求 |
| GET | /log |
全エラー取得 (JSON) |
| DELETE | /log |
ログクリア |
| GET | /snapshots |
スナップショット一覧 |
| GET | /snapshots/:file |
スナップショット表示 |
| GET | /status |
サーバー状態 |
node ai_dev_server.js --help # ヘルプ
node ai_dev_server.js --test # E2Eテスト (20テスト)
node ai_dev_server.js --kill # ポート競合時に強制起動| 変数 | デフォルト | 説明 |
|---|---|---|
| PORT | 3000 | サーバーポート |
| LOG_FILE | error.log | ログファイル |
| STATIC_DIR | . | 静的ファイルディレクトリ |
| SNAPSHOT_DIR | ./snapshots | スナップショット保存先 |
# AI向け（トークン効率）
tail -1 error.log
ls snapshots/
# 人間向け（フルJSON）
curl localhost:3000/log
curl localhost:3000/snapshots- 重複エラー抑制: 5秒以内の同一エラーは集約
- 自動ポート切り替え: 使用中なら次のポートを試行
- E2Eスナップショット:
curl -X POST '/snapshot/request?label=step1'
# テストコード内でスナップショット要求
curl -X POST 'localhost:3000/snapshot/request?label=after_login'
# → ブラウザが自動でスナップショット取得、完了まで待機node ai_dev_server.js --test
# → 20テスト実行MIT