HTTP Toolkit UI: пользовательский интерфейс для анализа HTTP-запросов
HTTP Toolkit UI — это пользовательский интерфейс для прокси-сервера и инструмента анализа HTTP(S) от HTTP Toolkit. Он позволяет разработчикам перехватывать, анализировать и отлаживать HTTP-запросы и ответы.
Основная задача проекта — предоставить удобный интерфейс для взаимодействия с функционалом прокси, находящимся на серверной стороне. В отличие от других аналогичных решений, таких как Fiddler или Charles, HTTP Toolkit предлагает современный веб-ориентированный интерфейс и открыт для настройки и расширения. Это может быть полезно разработчикам, тестировщикам и всем, кто работает с API и веб-приложениями.
Проект написан на TypeScript с использованием React и MobX для управления состоянием. Запустить его можно через созданное приложение для рабочего стола или прямо в браузере, подключившись к локальному серверу, который можно поднять самостоятельно. Имей в виду, для полноценной работы нужно использовать десктопное приложение или развернуть серверный компонент.
HTTP Toolkit UI — это интерфейс для проекта HTTP Toolkit, который представляет собой кроссплатформенный и открытый HTTP(S) отладочный прокси, анализатор и клиент. Основная задача этого проекта заключается в предоставлении удобного интерфейса для работы с инструментами отладки HTTP.
Интерфейс реализован как одностраничное веб-приложение на базе React с использованием TypeScript, MobX для управления состоянием и Styled Components для стилизации. В процессе отладки используется библиотека Mockttp для перехвата HTTP-запросов.
Как установить и запустить
Чтобы начать работу с проектом, следуй этим шагам:
- Склонируй репозиторий.
- Выполни команду
npm install. - Если ты используешь Mac с архитектурой arm64, возможно, появится ошибка Puppeteer с сообщением "The chromium binary is not available for arm64". В таком случае следуй инструкциям из данного материала и перед выполнением
npm installзапустиexport PUPPETEER_SKIP_CHROMIUM_DOWNLOAD=true. Однако, при этом интеграционные тесты могут не работать, но это не критично для локальной разработки.
Для чистой UI-разработки:
- Запусти
npm startдля старта интерфейса с работающим сервером HTTP Toolkit. - Затем перейди по адресу localhost:8080, чтобы увидеть интерфейс.
Для разработки интерфейса и сервера одновременно:
- Запусти сервер HTTP Toolkit локально.
- Запусти
npm run start:web, чтобы начать работу с интерфейсом без отдельного сервера. - Перейди по адресу localhost:8080 для просмотра интерфейса.
Ограничения
На Mac с архитектурой arm64 могут возникнуть проблемы со стартом интерфейса и работой тестов. Кроме того, если данные функции не работают из-за архитектурной несовместимости, это может затруднить локальную разработку некоторых возможностей приложения.
HTTP Toolkit UI может работать в связке с сервером HTTP Toolkit, который необходимо запускать отдельно или в рамках самого приложения, но имей это в виду, если планируешь использовать его функциональность в вебе.
Открыть на GitHub: httptoolkit/httptoolkit-ui →
RepoRadar