Repolode
Предложить
law-chain-hot

law-chain-hot/websocket-devtools

Расширение для DevTools в Chrome и Edge, позволяющее отслеживать, имитировать и блокировать WebSocket-трафик в браузере.

Открыть на GitHubСайт
Звёзды
1,198
Форки
59
Открытые issues
19
Последний коммит
23 дня назад

Что это?

WebSocket DevTools — это расширение для браузера, которое добавляет панель WebSocket в DevTools Chrome и Edge. Оно перехватывает WebSocket-соединения и сохраняет историю сообщений, в том числе для соединений, открытых до запуска панели. Благодаря этому разработчики могут изучать трафик в реальном времени на отлаживаемой странице.

Помимо просмотра трафика, расширение позволяет отправлять произвольные сообщения в обе стороны — от клиента к серверу и обратно. Для этого предусмотрен JSON-редактор с поддержкой форматирования. Также можно блокировать отдельные сообщения и имитировать сетевые сбои, чтобы проверить поведение приложения в нештатных ситуациях. Часто используемые сообщения можно сохранять в избранное.

Расширение поддерживает проксирование WebSocket-соединений внутри iframe. Данные хранятся локально в браузере, а проект распространяется с открытым исходным кодом по лицензии MIT.

Ключевые возможности

  • 01Перехватывает WebSocket-соединения в фоновом режиме, даже если панель DevTools ещё не открыта.
  • 02Отправляет произвольные сообщения между клиентом и сервером в обоих направлениях.
  • 03Блокирует отдельные сообщения и имитирует сетевые сбои для тестирования.
  • 04Позволяет форматировать и изучать содержимое сообщений с помощью JSON-просмотрщика.
  • 05Сохраняет часто используемые сообщения в избранное.
  • 06Проксирует WebSocket-соединения внутри iframe.

Сценарии использования

  • Отладка сообщений чатов в реальном времени или многопользовательских игр в браузере.
  • Проверка того, как фронтенд обрабатывает потерянные или некорректные WebSocket-сообщения.
  • Повторная отправка или внедрение сообщений сервера, чтобы воспроизвести ошибку без работающего бэкенда.

Быстрый старт

  1. 1

    Установите из Chrome Web Store

  2. 2

    Или установите из магазина дополнений Microsoft Edge

  3. 3

    Откройте DevTools (F12) и выберите вкладку WebSocket DevTools

Что важно знать

  • Установленные вручную с GitHub версии не обновляются автоматически.
  • Работает только в Chrome и Edge.

Темы

#websocket#devtools#chrome-extension#debugging#real-time#network#chrome-extensions#real-time-chat#real-time-monitoring#socket-io

Частые вопросы

Что такое websocket-devtools?
Расширение для DevTools в Chrome и Edge, позволяющее отслеживать, имитировать и блокировать WebSocket-трафик в браузере. WebSocket DevTools — это расширение для браузера, которое добавляет панель WebSocket в DevTools Chrome и Edge. Оно перехватывает WebSocket-соединения и сохраняет историю сообщений, в том числе для соединений, открытых до запуска панели. Благодаря этому разработчики могут изучать трафик в реальном времени на отлаживаемой странице.
websocket-devtools можно использовать бесплатно? Какая у него лицензия?
websocket-devtools распространяется с открытым исходным кодом под лицензией MIT. Перед использованием в коммерческих продуктах проверьте условия лицензии.
websocket-devtools всё ещё поддерживается?
Активно поддерживается. Последний коммит в websocket-devtools — 28 сент. 2026 г..
Для чего можно использовать websocket-devtools?
Отладка сообщений чатов в реальном времени или многопользовательских игр в браузере. Проверка того, как фронтенд обрабатывает потерянные или некорректные WebSocket-сообщения. Повторная отправка или внедрение сообщений сервера, чтобы воспроизвести ошибку без работающего бэкенда.
Как установить websocket-devtools?
Установите из Chrome Web Store Или установите из магазина дополнений Microsoft Edge Откройте DevTools (F12) и выберите вкладку WebSocket DevTools
Где скачать websocket-devtools?
Исходный код и инструкции по установке — на GitHub: https://github.com/law-chain-hot/websocket-devtools

Описание создано ИИ на основе README проекта. Статистика GitHub обновляется ежедневно.

Похожие проекты