law-chain-hot/websocket-devtools

これは何？

主な機能

• 01DevToolsパネルを開く前の接続も含め、WebSocket接続をバックグラウンドで取得します。
• 02クライアントとサーバーの間で双方向に任意のメッセージを送信します。
• 03特定のメッセージをブロックし、テスト用にネットワーク障害をシミュレートします。
• 04JSONビューアーでメッセージのペイロードを整形して確認できます。
• 05よく使うメッセージをお気に入りに保存できます。
• 06iframe内のWebSocket接続をプロキシします。

ユースケース

• ブラウザー上でリアルタイムチャットやマルチプレイヤーゲームのメッセージをデバッグする。
• WebSocketメッセージの欠落や形式不正に対するフロントエンドの挙動をテストする。
• 稼働中のバックエンドを使わずにサーバーメッセージを再送または注入し、バグを再現する。

クイックスタート

1. 1

   Chrome ウェブストアからインストール

2. 2

   または Microsoft Edge アドオンストアからインストール

3. 3

   DevTools（F12）を開き、「WebSocket DevTools」タブを選択

使う前に知っておきたいこと

• !GitHub から手動でインストールした場合、自動更新されません。
• !Chrome と Edge でのみ動作します。

トピック

よくある質問

websocket-devtools とは？

ブラウザー内のWebSocket通信を監視・シミュレート・ブロックできる、ChromeおよびEdge向けDevTools拡張機能。 WebSocket DevToolsは、ChromeおよびEdgeのDevToolsにWebSocketパネルを追加するブラウザー拡張機能です。WebSocket接続とメッセージ履歴を取得でき、パネルを開く前に確立された接続も含めて、デバッグ中のページのリアルタイム通信を確認できます。

websocket-devtools は無料で使えますか？ライセンスは？

websocket-devtools は MIT ライセンスのオープンソースです。商用製品で使う前にライセンス条件を確認してください。

websocket-devtools は今もメンテナンスされていますか？

活発にメンテナンス中。websocket-devtools の最終コミットは 2026年9月28日 です。

websocket-devtools は何に使えますか？

ブラウザー上でリアルタイムチャットやマルチプレイヤーゲームのメッセージをデバッグする。 WebSocketメッセージの欠落や形式不正に対するフロントエンドの挙動をテストする。 稼働中のバックエンドを使わずにサーバーメッセージを再送または注入し、バグを再現する。

websocket-devtools のインストール方法は？

Chrome ウェブストアからインストール または Microsoft Edge アドオンストアからインストール DevTools（F12）を開き、「WebSocket DevTools」タブを選択

websocket-devtools はどこで入手できますか？

ソースコードとインストール手順は GitHub にあります：https://github.com/law-chain-hot/websocket-devtools