القائمة
note.com APIの調査を支援します。mitmproxyとPlaywrightを使用してHTTPトラフィックをキャプチャ・分析し、API動作を解明します。
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
| name | api-investigator |
| description | note.com APIの調査を支援します。mitmproxyとPlaywrightを使用してHTTPトラフィックをキャプチャ・分析し、API動作を解明します。 |
| allowed-tools | Read Edit Write Glob Grep Bash |
このスキルは、note.com APIの動作を調査するためのinvestigatorモジュールの利用方法を提供します。
以下の状況で起動します：
# 開発依存関係のインストール（mitmproxy含む）
uv sync --group dev
# Playwrightブラウザのインストール
uv run playwright install chromium
# 基本的なキャプチャ（セッション自動復元）
uv run python -m note_mcp.investigator capture
# ドメインフィルタ付きキャプチャ
uv run python -m note_mcp.investigator capture --domain api.note.com
# 出力ファイル指定
uv run python -m note_mcp.investigator capture -o my_capture.flow
# セッション復元なし（新規ログイン必要）
uv run python -m note_mcp.investigator capture --no-session
# カスタムポート
uv run python -m note_mcp.investigator capture --port 8888
# 基本的な分析
uv run python -m note_mcp.investigator analyze traffic.flow
# パターンで検索
uv run python -m note_mcp.investigator analyze traffic.flow --pattern citation
# ドメインとメソッドでフィルタ
uv run python -m note_mcp.investigator analyze traffic.flow --domain api.note.com --method POST
# JSON形式でエクスポート
uv run python -m note_mcp.investigator export traffic.flow -o api_calls.json
# ドメインフィルタ付きエクスポート
uv run python -m note_mcp.investigator export traffic.flow --domain api.note.com
note_login MCPツールでログイン済みの場合、保存されたセッションCookieが自動的にブラウザに注入されます。
captureコマンド実行
↓
SessionManagerからCookie読み込み
↓
PlaywrightブラウザにCookie注入
↓
ログイン状態でキャプチャ開始
# Step 1: note.comへのトラフィックをキャプチャ
uv run python -m note_mcp.investigator capture -d note.com -o citation.flow
# ブラウザで:
# 1. 新規記事作成画面（/notes/new）を開く
# 2. 引用ブロックを追加
# 3. 出典を入力
# 4. 下書き保存
# 5. ブラウザを閉じる
# Step 2: draft_save APIを分析
uv run python -m note_mcp.investigator analyze citation.flow --pattern draft_save
# Step 3: 詳細をJSONでエクスポート
uv run python -m note_mcp.investigator export citation.flow -o citation_api.json
# Step 4: Pythonで詳細確認
uv run python -c "
import json
with open('citation_api.json') as f:
data = json.load(f)
for item in data:
req = item.get('request', {})
if 'draft_save' in req.get('url', ''):
body = json.loads(req.get('body', '{}'))
print(json.dumps(body, indent=2, ensure_ascii=False))
"
引用の出典はAPIで以下のHTML構造として送信されることが判明：
<figure name="UUID" id="UUID">
<blockquote>
<p name="UUID" id="UUID">引用テキスト<br>改行も可能</p>
</blockquote>
<figcaption>出典URL（例: example.com）</figcaption>
</figure>
<figure> で全体をラップ<blockquote><p> 内に引用テキスト<figcaption> に出典情報<br> タグ# アップロード関連のトラフィックをキャプチャ
uv run python -m note_mcp.investigator capture -d note.com -o upload.flow
# ブラウザで画像をアップロード後、閉じる
# POSTリクエストのみ分析
uv run python -m note_mcp.investigator analyze upload.flow --method POST --pattern upload
# セッション復元なしでキャプチャ（認証フロー調査）
uv run python -m note_mcp.investigator capture --no-session -o auth.flow
# ブラウザでログイン操作を実行
# 認証関連のリクエストを分析
uv run python -m note_mcp.investigator analyze auth.flow --pattern "login\|session\|auth"
| オプション | 短縮形 | デフォルト | 説明 |
|---|---|---|---|
--output | -o | traffic.flow | 出力ファイルパス |
--url | -u | https://note.com | 初期表示URL |
--port | -p | 8080 | プロキシポート |
--domain | -d | なし | ドメインフィルタ |
--no-session | - | False | セッション復元を無効化 |
| オプション | 短縮形 | 説明 |
|---|---|---|
--pattern | -p | 正規表現パターンで検索 |
--domain | -d | ドメインでフィルタ |
--method | -m | HTTPメソッドでフィルタ |
--body | -b | リクエスト/レスポンスボディを表示 |
| オプション | 短縮形 | デフォルト | 説明 |
|---|---|---|---|
--output | -o | traffic.json | 出力JSONファイル |
--domain | -d | なし | ドメインでフィルタ |
AI（Claude Code/Claude Desktop）がMCPツールを直接呼び出してAPI調査を自律実行できます。 Docker内でブラウザ操作とトラフィック分析が完結します。
# Docker環境でinvestigatorサービスを起動
docker compose up -d investigator
# VNC経由でブラウザ動作を確認（オプション）
vncviewer localhost:5900
キャプチャセッションを開始します。
investigator_start_capture(domain: str, port: int = 8080) -> str
| パラメータ | 型 | デフォルト | 説明 |
|---|---|---|---|
| domain | str | - | キャプチャ対象ドメイン（例: "api.note.com"） |
| port | int | 8080 | プロキシポート |
戻り値: セッション開始の成功/失敗メッセージ
キャプチャセッションを停止します。
investigator_stop_capture() -> str
戻り値: セッション終了の成功/失敗メッセージ
現在のキャプチャセッション状態を取得します。
investigator_get_status() -> str
戻り値: セッション状態（アクティブ/非アクティブ、キャプチャ済みリクエスト数など）
指定URLに移動します。
investigator_navigate(url: str) -> str
| パラメータ | 型 | 説明 |
|---|---|---|
| url | str | 移動先URL |
戻り値: ナビゲーション結果（成功/失敗、ページタイトル）
セレクタで指定した要素をクリックします。
investigator_click(selector: str) -> str
| パラメータ | 型 | 説明 |
|---|---|---|
| selector | str | CSSセレクタ |
戻り値: クリック結果（成功/失敗）
指定要素にテキストを入力します。
investigator_type(selector: str, text: str) -> str
| パラメータ | 型 | 説明 |
|---|---|---|
| selector | str | CSSセレクタ |
| text | str | 入力テキスト |
戻り値: 入力結果（成功/失敗）
現在のページのスクリーンショットを取得します。
investigator_screenshot() -> str
戻り値: Base64エンコードされた画像データ
現在のページのHTMLを取得します。
investigator_get_page_content() -> str
戻り値: ページのHTMLコンテンツ
キャプチャしたトラフィック一覧を取得します。
investigator_get_traffic(pattern: str | None = None) -> str
| パラメータ | 型 | デフォルト | 説明 |
|---|---|---|---|
| pattern | str | None | URLパターンでフィルタ（正規表現） |
戻り値: トラフィック一覧（JSON形式）
特定パターンのトラフィックを詳細分析します。
investigator_analyze(pattern: str, method: str | None = None) -> str
| パラメータ | 型 | デフォルト | 説明 |
|---|---|---|---|
| pattern | str | - | URLパターン（正規表現） |
| method | str | None | HTTPメソッドでフィルタ |
戻り値: 分析結果（リクエスト/レスポンス詳細）
キャプチャデータをJSONファイルにエクスポートします。
investigator_export(output_path: str) -> str
| パラメータ | 型 | 説明 |
|---|---|---|
| output_path | str | 出力ファイルパス |
戻り値: エクスポート結果（ファイルパス、レコード数）
# 1. キャプチャ開始
→ investigator_start_capture(domain="note.com")
# 2. note.comにアクセス
→ investigator_navigate("https://note.com/")
# 3. ログインボタンをクリック
→ investigator_click("button.login")
# 4. 認証情報を入力（セッション復元される場合は不要）
→ investigator_type("input[name=email]", "...")
→ investigator_type("input[name=password]", "...")
→ investigator_click("button[type=submit]")
# 5. 記事作成画面に移動
→ investigator_navigate("https://note.com/notes/new")
# 6. 記事内容を入力
→ investigator_click(".editor-content")
→ investigator_type(".editor-content", "テスト記事")
# 7. 下書き保存（APIリクエスト発生）
→ investigator_click("button.save-draft")
# 8. draft_save APIを分析
→ investigator_analyze(pattern="draft_save", method="POST")
# 9. 結果をエクスポート
→ investigator_export(output_path="api_investigation.json")
# 10. キャプチャ終了
→ investigator_stop_capture()
# 1. キャプチャ開始
→ investigator_start_capture(domain="note.com")
# 2. 記事編集画面に移動
→ investigator_navigate("https://note.com/notes/new")
# 3. 画像アップロードボタンをクリック
→ investigator_click("button.upload-image")
# 4. POSTリクエストを分析
→ investigator_analyze(pattern="upload", method="POST")
# 5. レスポンス形式を確認
→ investigator_get_traffic(pattern="upload")
# 6. キャプチャ終了
→ investigator_stop_capture()
┌─────────────────────────────────────────────┐
│ Host │
│ ┌─────────────────┐ ┌────────────────┐ │
│ │ Claude Code CLI │───►│ MCP Client │ │
│ └─────────────────┘ └───────┬────────┘ │
└─────────────────────────────────┼───────────┘
│ HTTP :9000
┌─────────────────────────────────┼───────────┐
│ Docker Container ▼ │
│ ┌───────────────────────────────────────┐ │
│ │ Investigator MCP Server (FastMCP) │ │
│ │ - investigator_start_capture │ │
│ │ - investigator_navigate │ │
│ │ - investigator_click │ │
│ │ - investigator_screenshot │ │
│ │ - investigator_get_traffic │ │
│ │ - investigator_analyze │ │
│ └───────────────────────────────────────┘ │
│ │ │
│ ┌───────┴───────┐ │
│ ▼ ▼ │
│ ┌─────────┐ ┌───────────┐ │
│ │mitmproxy│ │Playwright │ │
│ │ :8080 │ │ Browser │ │
│ └─────────┘ └───────────┘ │
│ ▲ │
│ │ VNC :5900 / noVNC :6080 │
└──────────────────┼──────────────────────────┘
│
[Visual Monitoring]
cd /home/driller/amplifier/note-mcp
# investigatorサービスを起動
docker compose up -d investigator
# ログを確認
docker compose logs -f investigator
# MCP HTTPサーバーの動作確認
curl http://localhost:9000/mcp
# VNCでブラウザ確認（オプション）
vncviewer localhost:5900
# または noVNC: http://localhost:6080/vnc.html
.mcp.json にHTTPトランスポート設定が追加済み：
{
"mcpServers": {
"note-investigator": {
"url": "http://localhost:9000/mcp",
"transport": "http"
}
}
}
| ポート | サービス | 説明 |
|---|---|---|
| 9000 | MCP HTTP | Claude Codeからの接続 |
| 5900 | VNC | ブラウザ視覚確認 |
| 6080 | noVNC | Webブラウザ経由VNC |
| 8080 | mitmproxy | HTTPトラフィックキャプチャ |
/app/data にマウントされたボリュームに永続化--ignore-certificate-errors フラグでHTTPS通信をキャプチャsubprocess.PIPE → subprocess.DEVNULL（バッファブロッキング回避）localhost → 127.0.0.1（WSL2互換性）# 開発依存関係をインストール
uv sync --group dev
# Playwrightブラウザをインストール
uv run playwright install chromium
note_login MCPツールで先にログインnote_check_auth で認証状態を確認--no-session で手動ログイン# 別のポートを使用
uv run python -m note_mcp.investigator capture --port 8888
WSL2では localhost の名前解決が不安定な場合があります。
investigatorは内部で 127.0.0.1 を使用するよう修正済みですが、
他のツールと連携する際は 127.0.0.1 を明示的に使用してください。
過去に subprocess.PIPE によるバッファブロッキング問題がありました（Issue #15）。
現在は修正済みですが、同様の問題が発生した場合：
uv run mitmdump --mode regular@8080 -w test.flow &
curl -x http://127.0.0.1:8080 -k https://example.com
作業進捗をGitHub issueに自動報告します。計画立案時、知見獲得時、問題発覚時にブランチ名からissue番号を抽出し、構造化されたコメントを投稿します。
コード品質基準の完全遵守を保証します。コミット前の品質チェックを自動実行し、エラーがある状態でのコミットを防止します。
プロジェクト憲法への準拠を検証します。実装完了時やPR作成時に全Articleをチェックし、違反がないことを確認します。
コード変更、API変更、新機能追加時にドキュメントを自動更新します。公開APIやインターフェースの変更、新クラス・関数・モジュールの追加、アーキテクチャの重要な変更、ユーザーからの明示的なドキュメント更新依頼時に起動します。プロジェクトのドキュメント標準に準拠した更新を提案します。
MCPサーバー開発を支援します。プロトコル準拠、Pydanticスキーマ設計、Playwright統合のベストプラクティスを提供します。
TDDワークフローを強制し、テストファースト開発を支援します。新機能実装時に自動起動し、Red-Green-Refactorサイクルを確実に実行します。