Сергей Антропов d0a4b57233 feat: добавлены страницы ошибок и кнопка OTHER в LogLevels
- Добавлена кнопка OTHER в LogLevels для неклассифицированных логов
- Созданы красивые страницы ошибок с поддержкой темной/светлой темы
- Добавлены обработчики для ошибок 401, 403, 404, 500
- Реализована безопасность: убраны детали ошибок из пользовательского интерфейса
- Кнопка 'Войти в систему' показывается только на странице ошибки 403
- На странице 403 убран error-message, оставлен только auth-notice
- Обновлены счетчики логов для поддержки уровня OTHER
- Добавлены тестовые маршруты для проверки страниц ошибок
- Улучшен UX: адаптивный дизайн, интерактивность, навигация

Автор: Сергей Антропов
Сайт: https://devops.org.ru
2025-08-17 18:49:54 +03:00

LogBoard+

Веб-интерфейс для просмотра логов Docker контейнеров в реальном времени с современной системой авторизации.

🔐 Новая система авторизации

LogBoard+ теперь использует современную систему авторизации на основе JWT токенов вместо Basic Auth:

Основные изменения:

  • JWT токены вместо Basic Auth
  • Страница входа с красивым интерфейсом
  • Безопасные сессии с автоматическим истечением
  • Защищенные API эндпоинты
  • Автоматическое перенаправление на страницу входа при отсутствии авторизации

Как использовать:

  1. Откройте LogBoard+ в браузере
  2. Автоматически перенаправление на страницу входа
  3. Введите логин и пароль (по умолчанию: admin/admin123)
  4. Получите доступ к панели управления логами
  5. Используйте кнопку "Выйти" для завершения сессии

Настройка пользователей:

В файле .env или docker-compose.yml:

LOGBOARD_USER=admin          # Имя пользователя
LOGBOARD_PASS=admin123       # Пароль
SECRET_KEY=your-secret-key   # Секретный ключ для JWT
SESSION_TIMEOUT=3600         # Время жизни сессии в секундах

Исправления дублирования строк и правильных переносов строк в режимах Single View и MultiView

Проблема

В режимах Single View и MultiView происходило дублирование строк логов и проблемы с переносами строк между логами, что затрудняло чтение и анализ логов.

Внесенные исправления

Для режима Single View:

  1. Обработка дублированных строк в WebSocket данных

    • Добавлена проверка на дублирование в функции openWs
    • Используются только уникальные строки из входящих данных
  2. Проверка дублирования при добавлении строк

    • Добавлена проверка на дублирование в функции handleLine для Single View
    • Пропускаются дублированные строки перед добавлением в интерфейс
  3. Правильные переносы строк

    • Добавлены переносы строк \n после каждой строки лога для читаемости
    • Создана функция processSingleViewSpecialReplacements() для обработки строк
    • Улучшена функция cleanSingleViewEmptyLines() для сохранения переносов строк
  4. Универсальная функция очистки

    • Создана функция cleanDuplicateLines() для удаления последовательных дубликатов
    • Работает как для Single View, так и для MultiView
  5. Периодическая очистка

    • Добавлена очистка дублированных строк при обновлении счетчиков
    • Очистка выполняется при обновлении логов и фильтров

Для режима MultiView:

  1. Предотвращение одновременного отображения в обычном и multi-view режимах

    • Логи теперь отображаются только в одном режиме одновременно
    • Добавлена проверка !state.multiViewMode в функции handleLine
  2. Обработка дублированных строк в WebSocket данных

    • Добавлена проверка на дублирование в функции openMultiViewWs
    • Используются только уникальные строки из входящих данных
  3. Функция очистки дублированных строк

    • Создана функция cleanMultiViewDuplicateLines() для удаления последовательных дубликатов
    • Функция вызывается при добавлении новых строк и периодически
  4. Улучшенная обработка специальных случаев

    • Улучшена функция processMultiViewSpecialReplacements() для обработки строк с "FoundINFO:"
    • Добавлена проверка на дублирование в исходном тексте
  5. Периодическая очистка

    • Добавлена периодическая очистка дублированных строк каждую секунду
    • Очистка выполняется при обновлении логов и фильтров

Тестирование

Для тестирования исправлений используйте в консоли браузера:

testDuplicateRemoval()                    // Тест функции очистки дубликатов MultiView
testSingleViewDuplicateRemoval()          // Тест функции очистки дубликатов Single View
testSingleViewEmptyLinesRemoval()         // Тест функции очистки пустых строк Single View
testSingleViewLineBreaks()                // Тест правильного отображения переносов строк
checkMultiViewHTML()                      // Проверка HTML на наличие дубликатов
cleanDuplicateLines()                     // Универсальная функция очистки дубликатов
cleanSingleViewEmptyLines()               // Функция очистки пустых строк

Автор

Сергей Антропов Сайт: https://devops.org.ru

LogBoard+ — это веб-панель для просмотра логов микросервисов из docker-compose в реальном времени с поддержкой:

  • Вкладок по сервисам и репликам
  • Темная/светлая темы
  • Подсветка ANSI-цветов из логов
  • Фильтрация по уровням (debug, info, warn, error)
  • Снимки логов в файл (snapshot)
  • Объединение всех реплик сервиса в одну вкладку (aggregate)
  • Fan-in группировка нескольких сервисов в одну панель (group)
  • Цветовые теги по короткому ID контейнера
  • Sticky-фильтры по репликам
  • Пауза/возобновление стрима
  • Basic Auth для доступа
  • Автопереподключение вебсокетов
  • Поддержка нескольких клиентов одновременно

Установка и запуск

Быстрый старт с Makefile (рекомендуется)

# Распаковать проект
unzip logboard_plus_fanin_groups.zip
cd logboard_plus

# Показать доступные команды
make help

# Настроить переменные окружения
make setup

# Отредактировать .env файл под свои нужды (опционально)
# nano .env

# Собрать и запустить проект
make build
make up

# Открыть в браузере
http://localhost:9001

Команды Makefile

Команда Описание
make help Показать справку по всем командам
make setup Настроить переменные окружения (копировать env.example в .env)
make generate Сгенерировать docker-compose.yml из .env файла
make build Собрать Docker образ
make up Запустить сервисы в фоновом режиме (с правами root)
make down Остановить и удалить сервисы (с правами root)
make restart Перезапустить сервисы (с правами root)
make logs Показать логи сервисов в реальном времени
make logs-tail Показать последние 100 строк логов
make status Показать статус сервисов
make clean Остановить сервисы и удалить образы
make shell Подключиться к контейнеру
make dev Запуск в режиме разработки (с выводом логов)
make rebuild Пересобрать и запустить сервисы

Настройка переменных окружения

Проект использует файл .env для хранения всех настроек. Для настройки:

  1. Автоматическая настройка:

    make setup
    
  2. Ручная настройка:

    cp env.example .env
    nano .env  # или любой другой редактор
    

Основные переменные окружения:

Переменная Описание Значение по умолчанию
LOGBOARD_PORT Порт веб-интерфейса 9001
LOGBOARD_USER Имя пользователя для авторизации admin
LOGBOARD_PASS Пароль для авторизации admin123
LOGBOARD_TAIL Количество строк истории 500
LOGBOARD_SNAPSHOT_DIR Директория для снимков /app/snapshots
LOGBOARD_INDEX_HTML Путь к HTML шаблону ./templates/index.html
TZ_TS Временная зона для меток времени (пусто)
COMPOSE_PROJECT_NAME Фильтр по проекту Docker Compose (пусто)
LOGBOARD_PROJECTS Множественные проекты (через запятую) (пусто)
DOCKER_NETWORKS Внешние Docker сети (через запятую) iaas,infrastructure_iaas
LOGBOARD_SKIP_UNHEALTHY Пропускать нездоровые контейнеры true
LOGBOARD_CONTAINER_LIST_TIMEOUT Таймаут получения списка контейнеров (сек) 10
LOGBOARD_CONTAINER_INFO_TIMEOUT Таймаут получения информации о контейнере (сек) 3
LOGBOARD_HEALTH_CHECK_TIMEOUT Таймаут проверки health status (сек) 2
SECRET_KEY Секретный ключ для шифрования your-secret-key-here
ENCRYPTION_KEY Ключ шифрования your-encryption-key-here

⚠️ Важно: Измените значения LOGBOARD_PASS, SECRET_KEY и ENCRYPTION_KEY в продакшене! Для безопасности используйте сложные пароли и уникальные секретные ключи.

Работа с множественными проектами

LogBoard+ поддерживает работу с несколькими проектами Docker Compose одновременно:

Через веб-интерфейс:

  1. Откройте LogBoard+ в браузере
  2. Используйте селектор "Projects" в верхней панели
  3. Выберите проект из списка или "All Projects" для всех
  4. Просматривайте логи контейнеров выбранного проекта

Через переменные окружения:

  1. Укажите проекты в .env файле:

    LOGBOARD_PROJECTS=project1,project2,project3
    
  2. Перезапустите LogBoard+:

    make restart
    

API эндпоинты:

  • GET /api/projects - получить список всех проектов
  • GET /api/services?projects=project1,project2 - получить контейнеры конкретных проектов

Настройка Docker сетей

Для подключения к внешним Docker сетям (например, для работы с другими проектами):

  1. Укажите сети в .env файле:

    DOCKER_NETWORKS=iaas,infrastructure_iaas,myproject_network
    
  2. Сгенерируйте docker-compose.yml:

    make generate
    
  3. Убедитесь, что сети существуют:

    docker network ls
    
  4. Создайте сети, если их нет:

    docker network create iaas
    docker network create infrastructure_iaas
    

Настройка прав доступа к Docker

Приложение запускается с правами root для корректного доступа к Docker socket. Если вы хотите запускать без прав root, добавьте вашего пользователя в группу docker:

sudo usermod -a -G docker $USER
# Перезагрузите систему или перелогиньтесь

Фильтрация контейнеров

LogBoard+ автоматически пропускает контейнеры с проблемными health check для предотвращения зависания приложения. Это особенно полезно в средах с множеством контейнеров, где некоторые могут быть нездоровыми.

Настройки фильтрации:

  • LOGBOARD_SKIP_UNHEALTHY=true - пропускать нездоровые контейнеры
  • LOGBOARD_CONTAINER_LIST_TIMEOUT=10 - таймаут получения списка контейнеров
  • LOGBOARD_CONTAINER_INFO_TIMEOUT=3 - таймаут получения информации о контейнере
  • LOGBOARD_HEALTH_CHECK_TIMEOUT=2 - таймаут проверки health status

Логирование: Приложение выводит в логи информацию о пропущенных контейнерах:

⚠️  Пропускаем нездоровый контейнер frontend-iaas (ID: 17c539b2e4dd)
⚠️  Таймаут при получении health status для контейнера problem-container (ID: abc123def456)

Классический способ

# Распаковать проект
unzip logboard_plus_fanin_groups.zip
cd logboard_plus

# Настроить переменные окружения
cp env.example .env
# Отредактировать .env файл

# Запуск через docker-compose
docker compose up --build -d

# Открыть в браузере
http://localhost:9001

По умолчанию логин/пароль для авторизации задаются в docker-compose.yml:

environment:
  - LOGBOARD_USER=admin
  - LOGBOARD_PASS=admin123

Интерфейс

Верхняя панель

  • Тема — переключатель тёмной/светлой темы
  • aggregate — собирает все реплики сервиса в одну вкладку
  • group — собирает несколько сервисов в один поток логов
  • snapshot — сохраняет текущие логи этой панели в файл
  • tail — количество строк истории при подключении

Панель вкладок

  • Вкладки по сервисам и репликам
  • Клик по вкладке — открыть поток логов
  • Цветной чип [id] — уникальная реплика, цвет закреплён
  • Чекбоксы под вкладками — фильтр по репликам

Логи

  • Цвета в логах из ANSI-кодов
  • Фильтрация по уровню (debug, info, warn, error)
  • Пауза/возобновление стрима
  • При выделении текста появляется кнопка "Копировать"

Fan-in группировка

Позволяет объединить несколько разных сервисов в один поток:

  1. Нажмите кнопку group вверху
  2. Введите имена сервисов через запятую (например: api, worker, scheduler)
  3. Откроется панель с логами всех указанных сервисов, с префиксом [id service]
  4. Можно фильтровать по конкретным репликам внизу

Советы

  • Если контейнер перезапустился — поток автоматически переподключается
  • Можно открыть несколько вкладок браузера с разными сервисами — всё работает параллельно
  • Для больших проектов удобно держать одну панель с aggregate, вторую — с group по критическим сервисам

Лицензия

MIT

Скриншоты

Тёмная тема:

Dark

Светлая тема:

Light

Description
LogBoard+ - это современная веб-панель для мониторинга и просмотра логов Docker контейнеров в реальном времени. Приложение идеально подходит для локальной разработки, позволяя разработчикам всегда держать логи микросервисов перед глазами на втором мониторе.
https://devops.org.ru
Readme MIT 6.7 MiB
Languages
JavaScript 60.4%
Python 15.8%
CSS 15.6%
HTML 5.5%
Makefile 2.2%
Other 0.5%