README_ja.md

🚀 インストール

Chrome ウェブストア

1. Chrome ウェブストアにアクセス
2. **「Chromeに追加」**をクリックしてインストールを確認
3. DevTools (F12) を開く → **「WebSocket DevTools」**タブ

Microsoft Edge

1. Microsoft Edge アドオンにアクセス
2. **「入手」**をクリックしてインストールを確認
3. DevTools (F12) を開く → **「WebSocket DevTools」**タブ

ホームページ

• 🌐 WebSocket DevTools - 公式ウェブサイト（ドキュメントとデモ付き）
• 📺 YouTube動画 - デモ動画

✨ 主要機能

• 🔍 リアルタイム監視 - WebSocket接続とメッセージをライブ更新で追跡
• 🔄 バックグラウンド監視 - DevToolsパネルが閉じていても接続を継続監視
• 🎮 メッセージシミュレーション - 双方向でカスタムメッセージを送信（クライアント ↔ サーバー）
• 🚧 トラフィック制御 - メッセージをブロックしてネットワーク問題をシミュレート
• 💾 お気に入りシステム - よく使うメッセージを保存・整理
• 🌍 多言語対応 - 英語と中国語の完全サポート
• 🎨 DevTools統合 - ネイティブなChrome DevToolsパネル体験
• 🖼️ Iframe対応 - iframe埋め込み接続の完全なWebSocketプロキシサポート

🎬 クイックデモ

ブロック機能

シミュレーション機能

デモで紹介する主要機能:

• メッセージブロック: WebSocketメッセージをリアルタイムで傍受・ブロック
• メッセージシミュレーション: カスタムメッセージを送信して様々なシナリオをテスト
• トラフィック制御: デバッグ用のWebSocketトラフィックフロー管理
• JSONサポート: 完全なJSON解析とフォーマット機能

📷 スクリーンショット

📖 クイックスタート

1. 拡張機能をインストール - Chromeに追加してバックグラウンド監視を有効化
2. DevToolsを開く (F12) → **「WebSocket DevTools」**タブを見つける
3. キャプチャデータを表示 - すべてのWebSocket接続がバックグラウンドで自動キャプチャ
4. メッセージを検査 - 接続をクリックしてメッセージ履歴を表示
5. メッセージをシミュレート - JSONエディター付きシミュレートタブを使用
6. お気に入りを保存 - よく使うメッセージにスターを付けて素早くアクセス

💡 プロのヒント: 拡張機能はバックグラウンドでWebSocket接続を監視するため、WebSocketが確立された後にDevToolsを開いても接続を見逃すことはありません！

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

• ✅ データ収集なし - すべてがブラウザ内に保存
• ✅ ローカルストレージのみ - 外部サーバーや追跡なし
• ✅ オープンソース - 完全に透明で監査可能なコード
• ✅ 最小限の権限 - 機能に必要なもののみ

🛠 動作環境

• Chrome 88+ またはChromiumベースのブラウザ（Edge、Braveなど）
• WebSocket API - すべてのWebSocket実装と互換
• Socket.IO、wsライブラリ、カスタムWebSocketソリューションに対応

---

---