Основные изменения: - Добавлено AJAX обновление логов с чекбоксом 'Auto-update logs' - Добавлена опция 'All logs' в выпадающий список tail lines - Исправлено отображение длинных названий контейнеров в multi-view режиме - Восстановлена загрузка истории логов при включенном AJAX обновлении Новые функции: - Чекбокс 'Auto-update logs' в секции Options (включен по умолчанию) - Настройка интервала обновления через LOGBOARD_AJAX_UPDATE_INTERVAL - API эндпоинт /api/settings для получения настроек приложения - Поддержка параметра tail=all для загрузки всех логов - Автоматический запуск AJAX обновления при включении чекбокса Исправления UI: - Кнопки LogLevels не уезжают вправо при длинных названиях контейнеров - Добавлено обрезание длинных названий с многоточием - Фиксированная высота заголовков в multi-view режиме - Защита от сжатия кнопок LogLevels Тестирование: - Добавлены тесты для AJAX обновления (test_ajax_update.py) - Тест multi-view AJAX обновления (test_multi_view_ajax.py) - Тест опции 'all logs' (test_all_logs.py) - Тест отображения длинных названий (test_multi_view_layout.py) - Команды make test-ajax, make test-multi-view-ajax, make test-all-logs, make test-multi-view-layout Документация: - Создана подробная документация AJAX обновления (app/docs/ajax-update.md) - Обновлен CHANGELOG.md с версиями 1.3.0, 1.5.0, 1.6.0 - Обновлен README.md с описанием новых функций Автор: Сергей Антропов Сайт: https://devops.org.ru
8.1 KiB
8.1 KiB
AJAX Обновление Логов
Описание
Функциональность AJAX обновления логов позволяет периодически получать новые логи контейнеров без необходимости обновления всей страницы. Это особенно полезно для мониторинга логов в реальном времени с минимальной нагрузкой на сервер.
Принцип работы
- Загрузка истории: История логов загружается через WebSocket при открытии контейнера
- Периодические запросы: Система отправляет AJAX запросы к API эндпоинту
/api/logs/{container_id}
с заданным интервалом - Умное сравнение: Новые логи сравниваются с уже отображенными, добавляются только новые записи
- Автоматическое обновление: Счетчики логов и фильтры применяются автоматически к новым данным
- Управление состоянием: AJAX обновление автоматически останавливается при смене контейнера или переключении режимов
- Multi-view поддержка: В режиме multi-view обновляются логи всех выбранных контейнеров одновременно
Преимущества:
- Полнота данных: История логов загружается при открытии контейнера
- Реальное время: Новые логи обновляются через AJAX
- Гибкость: Работает как с WebSocket для истории, так и с AJAX для обновлений
API Эндпоинты
GET /api/logs/{container_id}
Получает логи контейнера через AJAX.
GET /api/settings
Получает настройки приложения.
Пример ответа:
{
"ajax_update_interval": 2000,
"default_tail": 500,
"skip_unhealthy": true
}
Параметры:
container_id
(path) - ID контейнераtail
(query) - Количество последних строк или 'all' для всех логов (по умолчанию 500)since
(query) - Время начала для фильтрации логов (опционально)
Пример запроса:
# Получить последние 100 строк
GET /api/logs/abc123?tail=100&since=2024-01-01T10:00:00Z
# Получить все логи
GET /api/logs/abc123?tail=all
# Получить все логи с фильтрацией по времени
GET /api/logs/abc123?tail=all&since=2024-01-01T10:00:00Z
Пример ответа:
{
"container": {
"id": "abc123def456",
"name": "/my-container",
"status": "running",
"image": "nginx:latest",
"created": "2024-01-01T09:00:00.000000000Z",
"state": {
"Status": "running",
"Running": true
}
},
"logs": [
{
"timestamp": "2024-01-01T10:30:00.123456789Z",
"message": "INFO: Application started",
"raw": "2024-01-01T10:30:00.123456789Z INFO: Application started"
}
],
"total_lines": 1,
"tail": 100,
"since": "2024-01-01T10:00:00Z",
"timestamp": "2024-01-01T10:30:00.123456789Z"
}
Интерфейс пользователя
Чекбокс управления
В секции Options добавлен чекбокс "Auto-update logs":
- Включен - автоматическое обновление логов через AJAX
- Выключен - отключение автоматического обновления
Примечание:
- Чекбокс включен по умолчанию
- В multi-view режиме AJAX обновляет логи всех выбранных контейнеров одновременно
- При включении чекбокса обновление запускается автоматически
Настройки интервала
Интервал обновления настраивается через переменную окружения:
LOGBOARD_AJAX_UPDATE_INTERVAL
- интервал обновления в миллисекундах (по умолчанию 2000ms)
Пример настройки в .env файле:
# Обновление каждые 5 секунд
LOGBOARD_AJAX_UPDATE_INTERVAL=5000
# Обновление каждую секунду
LOGBOARD_AJAX_UPDATE_INTERVAL=1000
JavaScript API
Функции управления
// Включить AJAX обновление
enableAjaxLogUpdate(intervalMs);
// Отключить AJAX обновление
disableAjaxLogUpdate();
// Переключить состояние
toggleAjaxLogUpdate();
// Выполнить одно обновление
performAjaxLogUpdate();
Глобальные переменные
// Интервал обновления
ajaxUpdateIntervalMs
// Состояние активности
ajaxUpdateEnabled
// Состояние для каждого контейнера (для multi-view)
containerStates // Map: containerId -> {lastTimestamp, lastSecondCount}
Особенности реализации
Обработка новых логов
- Парсинг временных меток: Система извлекает временные метки из логов Docker
- Добавление в DOM: Новые логи добавляются в конец существующего контента
- Применение фильтров: Автоматически применяются активные фильтры
- Обновление счетчиков: Пересчитываются счетчики уровней логов
- Очистка дубликатов: Удаляются дублированные строки
Управление состоянием
- AJAX обновление автоматически останавливается при смене контейнера
- При переключении в multi-view режим обновление также останавливается
- Состояние контейнеров сбрасывается при смене режимов просмотра
- В multi-view режиме состояние отслеживается отдельно для каждого контейнера
Обработка ошибок
- Ошибки сети не останавливают обновление
- Все ошибки логируются в консоль
- При отсутствии токена авторизации обновление пропускается
Преимущества
- Низкая нагрузка: Только новые логи передаются по сети
- Надежность: Простая HTTP архитектура без WebSocket сложностей
- Гибкость: Настраиваемый интервал обновления
- Совместимость: Работает с существующими фильтрами и счетчиками
- Производительность: Минимальное влияние на производительность браузера
Ограничения
- Задержка: Обновление происходит с заданным интервалом, не в реальном времени
- Ограничения браузера: Может быть ограничено политиками CORS
- Нагрузка на сервер: При большом количестве контейнеров может создавать нагрузку
Автор
Сергей Антропов
Сайт: https://devops.org.ru