Проект: Консоль для удалённого мониторинга логов  Публичный пост
29 января 2024  354
Консоль для удалённого мониторинга логов
https://console.wiredgeese.com/

Я, Алекс Гусев, веб-разработчик со стажем 25+ лет. Последние лет 5 программирую на JavaScript. Считаю, что с появлением ES6 и NodeJS разработка веб-приложений упростилась значительно. Теперь для фронта и бэка достаточно использовать один ЯП - JavaScript.

Довольно долгое время (~ 10 лет) я занимался интеграцией различных плагинов на e-commerce платформе Magento. Интеграция - это про то, как взять "что-то" и воткнуть "куда-то". Вот если "что-то" или "куда-то" обфусцировано или хотя бы минифицировано, то тогда вешайся. Отчасти поэтому я не приемлю TypeScript и прочие транспилируемые инструменты - "поступай с другими так, как хочешь, чтобы поступали с тобой". А я при интеграции хочу видеть тот код, который видит разработчик, чтобы понимать, для чего он его писал.

По сути проект Remote Console - это довольно простой ретранслятор текстовых сообщений. Просто чтобы читать логи своих собственных приложений. Веб-приложение - это клиент-серверная архитектура, где клиент (фронт) существует в каком-то браузере на каком-то компьютере. Когда я начал плотно заниматься PWA и устанавливать их на смартфоны, я столкнулся с тем, что логи в локальную консоль браузера я могу лить, а вот читать их - могу только в декстопных браузерах. Только там есть доступ к DevTools (по F12 для Chrome). В мобильных браузерах нужно прыгать с бубном, чтобы увидеть логи, а если смартфон пользователя и ты с ним общаешься удалённо, то это уже шаманство высшего уровня. Особенно для пользователя.

В общем, когда я натолкнулся на Beacon API, мне пришла в голову идея создать простой сайт-ретранслятор, который бы принимал текстовые сообщения через Beacon API и дублировал бы их всем, кто подключен к этому ретранслятору. Без сохранения данных, аутентификации и прочего.

Технические детали можно увидеть в репо проекта на GitHub'е. Если коротко, то у меня в веб-приложениях работает логгер, который пишет логи в консоль браузера. Через конфигурацию приложения можно сказать логгеру, чтобы он дублировал свои сообщения по Beacon API на сайт-ретранслятор с добавлением в адресе сайта какого-то случайного названия (канала). Например: https://console.wiredgeese.com/log/vas3k_club_123 Тогда любой, кто подключится к ретранслятору по адресу https://console.wiredgeese.com/vas3k_club_123 начнёт видеть у себя в браузере эти логи. Логи нигде не сохраняются, просто ретранслируются всем, кто подключен на соответствующий адрес.

В общем, таким образом можно выводить логи со смартфона пользователя в браузер разработчика только лишь через конфигурацию приложения. С этим пользователи обычно справляются.

Приятным дополнением оказалась возможность выводить в один канал сообщения из разных приложений (частей приложения). Например, можно лить на ретрансляторо логи с фронта и бэка и видеть последовательность событий (иногда, неожиданную). Можно подключить на один канал отправителя и получателя сообщений (оба - фронты) и серверную часть (бэк) - и опять таки наблюдать в одном месте последовательность событий у всех их участников.

Анализ несколько омрачает то, что время событий в логе - это время получения сообщения о событии самим ретранслятором. Но эту версию приложения я делал общедоступной и максимально простой. В первичной версии, которую я делал для себя, было сохранение в RDB на сервере не просто текстовых данных, а структуры с различной мета-информацией для поиска и фильтрации. Но последующий анализ использования показал, что чаще всего нужна именно простая ретрансляция, а поиск можно и средствами браузера организовать (Ctrl + F). Поэтому я и сделал для публикации простое веб-приложение с минимальными возможностями (заодно и попробовал Web Sockets вместо SSE для ретрансляции).

Небольшой пост про Remote Console я запилил на Хабр. Что вызвало некоторый интерес к сайту, который, впрочем, быстро угас. В пике у меня было под 70 посещений в месяц по данным Matomo (июнь и декабрь). А так кроме меня им особо никто и не пользуется - 244 посещения за полгода:

статистика посещений
статистика посещений

Особых планов на будущее по развитию сервиса нет - меня он пока что устраивает в таком виде, девелоперская общественность интереса не проявила (что меня, если честно, удивило - как народ логи на смартфонах читает, особенно у клиентов? неужели льёт все логи в агрегаторы типа Sentry?). Если кто-то из Клуба покажет лучший инструмент для мониторинга логов буду пользовать его. А пока так.

Спасибо всем, кто дочитал. Просьба сильно ногами не пинать, я тут недавно :)

Аватар Alex Gusev
Alex Gusev @wiredgeese
Разработчик веб-приложенийF. Lancer, SIA
📍Riga, Латвия

Веб-программист с 1998 года. Большой опыт разработки, развёртывания и поддержки не очень больших веб-приложений (которые точно не FAANG). Года так с 2018-го на меня снизошло озарение, что для веба хватает одного языка программирования - JavaScript (до этого плотно программировал на PHP, Java, LotusScript). Ищу возможность развиваться в направлении современного веб-строительства - PWA/SPA, ServiceWorkers, IndexedDB, Web APIs (Push, Notification, Authn, Media, RTC, ...). Особенно интересует применение всех этих технологий в смартфонах и в рамках концепции Web 3.0 (децентрализация и конфиденциальность данных пользователя). Своё видение прекрасного отображаю в коде платформы Tequila Framework (https://github.com/teqfw). Живу в Латвии, хотя хочу жить в Испании. Потому что люблю горы и море. Тёплое.

1 комментарий 👇

По-идее это отличный инструмент для тех же L2, которые проще смогут собирать пользовательские логи именно без плясок с бубном, подключения смартфона к компу по USB и всего вот этого в DevTools

  Развернуть 1 комментарий

😎

Автор поста открыл его для большого интернета, но комментирование и движухи доступны только участникам Клуба

Что вообще здесь происходит?


Войти  или  Вступить в Клуб