🎬 FlashVSR UI

✨ Roadmap

Что необходимо сделать

Новых задач на текущий момент нет

📋 Содержание

О проекте
✨ Основные возможности
🚀 Ключевые функции
🛠 Требования
⚙️ Установка
📖 Использование
🏗 Архитектура
📂 Структура проекта
📝 API Endpoints
🔧 Конфигурация
📊 Логирование
🔍 Мониторинг и отладка
❓ Решение проблем
🤝 Вклад в проект

🎯 О проекте

MyFlashVSR — это полнофункциональный веб-интерфейс для автоматического апскейла видео с использованием нейросети FlashVSR. Приложение автоматизирует весь процесс обработки: от загрузки видео до сохранения улучшенного результата.

✨ Основные возможности

🔄 Обработка видео

📹 Автоматическая конвертация в MP4 (libx264 + AAC)
✂️ Нарезка входного видео на сегменты по 5 секунд
🚀 Прямая интеграция с нейросетью FlashVSR для апскейла сегментов
📊 Прогресс-бар в реальном времени с информацией о каждом этапе обработки
🔗 Автоматическая склейка улучшенных сегментов
🔊 Сохранение исходной аудиодорожки — после завершения процесса апскейла, аудио из оригинального видео микшируется обратно без перекодирования
🎬 Редактирование видео — вырезание (Cut) и обрезание (Trim) фрагментов
💾 Сохранение в форматах MP4 или MXF

👥 Многопользовательская система

🔐 Уникальные сессии для каждого пользователя
📁 Изоляция данных — каждый пользователь видит только свои файлы
🔁 Персистентность — сессии сохраняются между перезагрузками страницы
🧹 Автоматическая очистка неактивных сессий (через 24 часа)

⏳ Управление очередью GPU

🎯 Единая очередь — только одна задача использует GPU одновременно
📊 Отображение позиции в очереди в реальном времени
🌐 Глобальный статус очереди — на главной странице отображается статус GPU и длина очереди
❌ Отмена задач — можно отменить ожидание или активную обработку
⏱️ Таймаут обработки — автоматическая отмена после 999 часов (настраивается)
🔔 Уведомления — браузерные push-уведомления при завершении

🔧 Редактирование видео

📍 Метки входа/выхода для выделения фрагментов
✂️ Вырезать (Cut) — вырезает фрагмент и сшивает остальное
📐 Обрезать (Trim) — оставляет только выделенный фрагмент, остальное удаляет
↩️ Отмена действий — многоуровневая система отмены
📚 История изменений — во время редактирования все промежуточные версии сохраняются

📊 Логирование и мониторинг

📝 Максимальное логирование всех операций (DEBUG уровень)
📅 Ежедневные лог-файлы
👤 Отслеживание сессий — все действия привязаны к пользователю
🔍 Детальная информация — функции, параметры, результаты, время выполнения

🚀 Ключевые функции

🔐 Система сессий

Каждый пользователь автоматически получает уникальную сессию при первом посещении:

UUID сессии хранится в cookies
Изолированные директории: temp/, results/, deleted/, history/
Автоматическое создание при первом доступе
Обновление времени доступа при каждом обращении

⏳ GPU Очередь

Умная система управления ресурсами GPU:

✅ Одна задача на GPU — остальные ждут в очереди
📍 Позиция в очереди отображается пользователю
❌ Отмена ожидания — можно выйти из очереди
🔄 Автовосстановление состояния при отмене
⏱️ Таймаут неактивности — отмена если WebSocket неактивен 30+ сек

📊 Прогресс-бар в реальном времени

Отслеживание прогресса обработки с детальной информацией:

📈 Этапы обработки:
- Подготовка (0-15%)
- Улучшение через FlashVSR (15-85%)
- Сохранение результата (85-100%)
🔄 Обновления — каждую секунду или при изменении на 5%
📁 Детали — текущий файл, итерация, разрешение
🔌 Интеграция — FlashVSR может отправлять прогресс через HTTP POST
🛡️ Надежность — если прогресс недоступен, показывается обычное состояние загрузки

💡 Обратите внимание: FlashVSR скрипт модифицирован для отправки прогресса через HTTP POST запросы. Если библиотека requests не установлена, обработка продолжается нормально, просто без обновлений прогресса.

🔄 Автоматическое восстановление состояния

При отмене задачи или закрытии вкладки:

✅ Сохраняется загруженное видео
✅ Откатываются промежуточные результаты
✅ Восстанавливается UI до состояния до обработки
✅ Удаляются временные файлы

📝 Детальное логирование

Каждое действие логируется с максимальной детализацией:

2025-11-25 10:15:23 | [INFO] | [backend.main] | [upload_video:234] | 
[SESSION:abc12345...] File upload started: video.mp4 (1024 bytes)

Включает:

✅ Timestamp
✅ Уровень логирования (DEBUG/INFO/WARNING/ERROR)
✅ Модуль и функция
✅ Номер строки
✅ ID сессии (первые 8 символов)
✅ Подробное описание операции

🛠 Требования

💻 Сервер

Компонент	Версия/Требование
OS	Linux (Ubuntu 20.04+)
Python	3.10+
Conda	Последняя версия
FFmpeg	Системная установка (не из Conda)
Nginx	Для reverse proxy (опционально)

⚠️ Важно: FFmpeg должен быть установлен системно (sudo apt install ffmpeg), так как версия из Conda может не поддерживать нужные кодеки.

⚙️ Установка

Развертывание на сервере

1) Подготовка системы (Ubuntu)

sudo apt update
sudo apt install -y git git-lfs ffmpeg

Проверка:

ffmpeg -version
git lfs version

2) Установка Conda и создание окружения `flashvsr`

Если Conda еще нет — установите Miniconda (официальный способ):

cd ~
mkdir -p ~/miniconda3
curl -fsSL https://repo.anaconda.com/miniconda/Miniconda3-latest-Linux-x86_64.sh -o miniconda.sh
bash miniconda.sh -b -u -p ~/miniconda3
~/miniconda3/bin/conda init bash
exec bash

Создайте окружение (версию python можно подстроить под вашу текущую установку FlashVSR):

conda create -n flashvsr python=3.11 -y
conda activate flashvsr

3) Клонирование репозиториев рядом

Рекомендуемая структура:

/root/MyFlashVSR
/root/FlashVSR

Команды:

cd /root
git clone https://github.com/Requestin/MyFlashVSR_WebUI.git
git clone https://github.com/OpenImagingLab/FlashVSR.git

4) Установка Block‑Sparse‑Attention (обязательно для FlashVSR)

cd /root
git clone https://github.com/mit-han-lab/Block-Sparse-Attention.git
cd Block-Sparse-Attention
pip install packaging ninja
python setup.py install

5) Установка FlashVSR

cd /root/FlashVSR
pip install -e .
pip install -r requirements.txt

Ссылки:

FlashVSR: https://github.com/OpenImagingLab/FlashVSR (Github)

Block‑Sparse‑Attention: https://github.com/mit-han-lab/Block-Sparse-Attention (Github)

6) Скачивание весов FlashVSR v1.1 (Git LFS)

FlashVSR хранит веса через Git LFS (HuggingFace). Из директории examples/WanVSR:

cd /root/FlashVSR/examples/WanVSR
git lfs install
git lfs clone https://huggingface.co/JunhaoZhuang/FlashVSR-v1.1

В результате появится папка FlashVSR-v1.1/ с весами.

7) Копирование модифицированных скриптов FlashVSR

В данном репозитории (MyFlashVSR_WebUI) есть папка:

modified scripts for FlashVSR

Её содержимое нужно положить на сервер в папку:

/root/FlashVSR/examples/WanVSR

Пример:

cp -f "/root/MyFlashVSR/modified scripts for FlashVSR/"*.py /root/FlashVSR/examples/WanVSR/

8) Установка MyFlashVSR (веб‑сервер)

cd /root/MyFlashVSR
pip install -r requirements.txt

9) Настройка systemd (автозапуск)

sudo cp /root/MyFlashVSR/flashvsr.service /etc/systemd/system/
sudo systemctl daemon-reload
sudo systemctl enable flashvsr
sudo systemctl start flashvsr
sudo systemctl status flashvsr

9) Nginx (опционально, reverse proxy)

sudo cp /root/MyFlashVSR/nginx_flashvsr.conf /etc/nginx/sites-available/flashvsr
sudo ln -s /etc/nginx/sites-available/flashvsr /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl reload nginx

10) Полезные команды

# Управление сервисом
sudo systemctl start flashvsr      # Запустить
sudo systemctl stop flashvsr       # Остановить
sudo systemctl restart flashvsr    # Перезапустить
sudo systemctl status flashvsr     # Статус

# Просмотр логов
sudo journalctl -u flashvsr -f              # Логи в реальном времени
sudo journalctl -u flashvsr -n 100          # Последние 100 строк
sudo tail -f ~/MyFlashVSR/logs/log_*.txt    # Логи приложения

📖 Использование

🎬 Основной рабочий процесс

1. 📤 Загрузка видео

Нажмите кнопку "Загрузить видео"
Выберите файл в любом формате
Видео автоматически конвертируется в MP4 (libx264 + AAC), если необходимо

💡 Подсказка: Поддерживаются все форматы, которые понимает FFmpeg.

2. 🚀 Улучшение видео

Нажмите кнопку "Улучшить"
Процесс обработки:
- Нарезка на сегменты по 5 секунд
- Постановка в очередь GPU
- Ожидание своей очереди (если GPU занят)
- Апскейл каждого сегмента через FlashVSR
- Склейка всех сегментов в одно видео
- Возврат аудио микширование оригинальной аудиодорожки без перекодирования
Во время обработки:
- 📊 Прогресс-бар показывает детальную информацию:
  - Текущий этап (Подготовка, Улучшение, Сохранение)
  - Процент выполнения (0-100%)
  - Информацию о текущем файле и итерациях
- 📍 Видите позицию в очереди (если ждёте)
- ❌ Можете отменить обработку в любой момент

🔔 Уведомление: При завершении придет браузерное push-уведомление.

3. ✂️ Редактирование видео

После обработки улучшенное видео появляется во втором плеере.

Вырезание фрагментов:

Выберите начало фрагмента на таймлайне плеера
Нажмите "[" — установится метка начала
Выберите конец фрагмента на таймлайне плеера
Нажмите "]" — установится метка конца
Нажмите "✂️ Вырезать" — фрагмент будет удален, оставшиеся части видео сшиваются воедино
Нажмите "📐 Обрезать" — останется только выделенный фрагмент, остальное будет удалено
Повторите для других фрагментов, если необходимо

Отмена действий:

Нажмите "↩️ Отмена" для отмены последнего действия
Можно отменить несколько действий подряд
История всех изменений сохраняется

4. 💾 Сохранение видео

Выберите формат: MP4 или MXF (переключатель рядом с кнопкой)
Нажмите "Сохранить видео"
Видео будет автоматически скачано в выбранном формате

📝 Примечание:

MP4 — сохраняется как есть (быстро)

MXF — конвертируется в mpeg2video + pcm_s16le (дольше, профессиональный формат)

🏗 Архитектура

🔄 Поток обработки видео

┌─────────────┐
│   Клиент    │  WebSocket ────┐
│  (Браузер)  │                │
└──────┬──────┘                │
       │ HTTP/WebSocket        │
       ↓                       │
┌──────────────────────────────┴────────┐
│         FastAPI Backend               │
│  ┌─────────────────────────────┐      │
│  │  Session Manager            │      │
│  │  - Изоляция пользователей   │      │
│  │  - Управление сессиями      │      │
│  └─────────────────────────────┘      │
│                                       │
│  ┌─────────────────────────────┐      │
│  │  GPU Queue Manager          │      │
│  │  - Очередь задач            │      │
│  │  - Управление ресурсами     │      │
│  └─────────────────────────────┘      │
│                                       │
│  ┌─────────────────────────────┐      │
│  │  Video Processor            │      │
│  │  - Конвертация              │      │
│  │  - Нарезка                  │      │
│  │  - Склейка                  │      │
│  └─────────────────────────────┘      │ 
│                                       │
│  ┌─────────────────────────────┐      │
│  │  Progress Tracker           │      │
│  │  - Прием обновлений         │      │
│  │  - WebSocket broadcast      │      │
│  └─────────────────────────────┘      │
└───────────────┬───────────────────────┘
                │
                ↓
        ┌───────────────┐
        │  FlashVSR     │
        │  (GPU)        │
        │  ┌─────────┐  │
        │  │ Progress│  │ HTTP POST
        │  │ Updates │──┼───────────┐
        │  └─────────┘  │           │
        └───────────────┘           │
                                    ↓
                            ┌───────────────┐
                            │ /progress     │
                            │ Endpoint      │
                            └───────────────┘

🔐 Система сессий

sessions/
├── {session_id_1}/
│   ├── temp/          # Временные файлы
│   ├── results/       # Результаты обработки
│   ├── deleted/       # Вырезанные фрагменты
│   └── history/       # История редактирования
├── {session_id_2}/
│   └── ...
└── ...

⏳ Очередь GPU

GPU Queue:
├── [Обрабатывается] ← session_id_A (файл: video1.mp4)
├── [В очереди: 1]   ← session_id_B (файл: video2.mp4)
├── [В очереди: 2]   ← session_id_C (файл: video3.mp4)
└── ...

📂 Структура проекта

MyFlashVSR/
│
├── backend/                      # Backend приложение
│   ├── main.py                  # Главный файл FastAPI
│   ├── templates/               # HTML шаблоны
│   │   └── index.html
│   ├── static/                  # Статические файлы
│   │   ├── style.css           # Стили
│   │   └── script.js           # Клиентский JavaScript
│   └── utils/                   # Утилиты
│       ├── video_processor.py  # Обработка видео (FFmpeg)
│       ├── session_manager.py  # Управление сессиями
│       ├── gpu_queue.py        # Очередь GPU
│       ├── logger_config.py    # Настройка логирования
│       └── helpers.py          # Вспомогательные функции
│
├── sessions/                     # Данные сессий пользователей (игнорируется в git)
│   └── {session_id}/
│       ├── temp/
│       ├── results/
│       ├── deleted/
│       └── history/
│
├── logs/                         # Логи приложения (игнорируется в git)
│   ├── log_251125.txt          # Ежедневные логи
│   └── log_261125.txt
│
├── requirements.txt              # Python зависимости
├── .gitignore                   # Игнорируемые файлы
├── README.md                    # Этот файл
├── flashvsr.service            # Systemd service файл
└── nginx_flashvsr.conf         # Nginx конфигурация

📝 API Endpoints

🔌 Основные endpoints

Метод	Путь	Описание
`GET`	`/`	Главная страница (HTML)
`GET`	`/state`	Снимок server-side состояния страницы (operational state + controller lease)
`POST`	`/control/claim`	Попытка занять роль контроллера вкладки
`POST`	`/control/heartbeat`	Heartbeat контроллера (lease TTL)
`POST`	`/upload`	Загрузка видео файла
`POST`	`/process`	Запуск обработки (улучшение)
`POST`	`/progress`	Получение обновлений прогресса от FlashVSR
`POST`	`/cancel-processing`	Отмена обработки
`GET`	`/queue/status`	Глобальный статус GPU очереди (busy/free + длина)
`POST`	`/cut`	Вырезание фрагмента из видео
`POST`	`/trim`	Обрезание результата: оставить только [in,out]
`POST`	`/undo`	Отмена последнего вырезания
`POST`	`/cut-original`	Вырезание фрагмента из оригинала
`POST`	`/trim-original`	Обрезание оригинала: оставить только [in,out]
`POST`	`/undo-original`	Отмена последнего действия для оригинала
`POST`	`/cancel-cut-op`	Отмена FFmpeg операции Cut во время выполнения
`POST`	`/cancel-trim-op`	Отмена FFmpeg операции Trim во время выполнения
`POST`	`/cancel-mxf-op`	Отмена FFmpeg конвертации в MXF во время выполнения
`POST`	`/clear-history`	Очистка истории undo (result/original)
`GET`	`/save`	Скачивание готового видео (`format=mp4
`WebSocket`	`/ws`	WebSocket для статусов в реальном времени

📤 Примеры запросов

Загрузка видео:

curl -X POST "http://localhost:8000/upload" \
  -H "Cookie: session_id=your-session-id" \
  -F "file=@video.mp4"

Запуск обработки:

curl -X POST "http://localhost:8000/process?filename=video.mp4" \
  -H "Cookie: session_id=your-session-id"

Отмена обработки:

curl -X POST "http://localhost:8000/cancel-processing" \
  -H "Cookie: session_id=your-session-id"

🔧 Конфигурация

🔑 Основные настройки

Все настройки находятся в backend/main.py:

# Директории
BASE_DIR = Path(__file__).resolve().parent.parent
SESSIONS_BASE_DIR = BASE_DIR / "sessions"

# FlashVSR
FLASHVSR_DIR = BASE_DIR.parent / "FlashVSR"
FLASHVSR_EXAMPLES_DIR = FLASHVSR_DIR / "examples" / "WanVSR"
FLASHVSR_SCRIPT = "infer_flashvsr_v1.1_tiny_modified.py"

# Очередь GPU
MAX_PROCESSING_TIME = 999 * 3600  # 999 часов (настраивается)
INACTIVITY_TIMEOUT = 30  # секунд

📝 Настройка логирования

В backend/utils/logger_config.py:

# Уровень логирования
log_level = logging.DEBUG  # DEBUG/INFO/WARNING/ERROR

# Формат логов
fmt='%(asctime)s | [%(levelname)-8s] | [%(name)s] | [%(funcName)s:%(lineno)d] | %(message)s'

# Ротация логов
# Ежедневные файлы: log_DDMMYY.txt

📊 Логирование

📁 Расположение логов

Ежедневные файлы: logs/log_DDMMYY.txt
Systemd логи: sudo journalctl -u flashvsr

📝 Формат логов

2025-11-25 10:15:23 | [INFO    ] | [backend.main] | [upload_video:234] | 
[SESSION:abc12345...] File upload started: video.mp4 (1024 bytes)

🔍 Уровни логирования

DEBUG — детальная информация (все функции, параметры, результаты)
INFO — важные события (загрузка, обработка, завершение)
WARNING — предупреждения (неактивные сессии, таймауты)
ERROR — ошибки (с полным стеком)

📊 Что логируется

Все действия пользователей (с привязкой к сессии)
Загрузка и обработка файлов
Операции с очередью GPU
Прогресс обработки FlashVSR (отправка обновлений)
Ошибки и исключения
Время выполнения операций
Размеры файлов
WebSocket соединения

🔍 Мониторинг и отладка

📊 Просмотр логов

# Логи приложения (ежедневные)
tail -f logs/log_251125.txt

# Systemd логи
sudo journalctl -u flashvsr -f

# Последние 100 строк
sudo journalctl -u flashvsr -n 100

# Nginx логи
sudo tail -f /var/log/nginx/flashvsr_access.log
sudo tail -f /var/log/nginx/flashvsr_error.log

🔍 Проверка состояния

# Статус сервиса
sudo systemctl status flashvsr

# Проверка портов
sudo netstat -tlnp | grep 8000  # FastAPI
sudo netstat -tlnp | grep 80    # Nginx

# Активные сессии
ls -la ~/MyFlashVSR/sessions/

# Размер логов
du -sh ~/MyFlashVSR/logs/

📈 Мониторинг ресурсов

# Использование GPU
nvidia-smi

# Использование CPU/RAM
htop

# Дисковое пространство
df -h
du -sh ~/MyFlashVSR/sessions/*/

❓ Решение проблем

⚠️ FastAPI не запускается

Проблема: Сервер не стартует или падает сразу после запуска.

Решения:

Проверьте логи: sudo journalctl -u flashvsr -n 50
Убедитесь, что Conda окружение активировано в service файле
Проверьте пути в flashvsr.service:
- WorkingDirectory
- ExecStart
- Environment PATH
Проверьте установку зависимостей: pip list

🌐 Nginx возвращает 502 Bad Gateway

Проблема: Nginx не может подключиться к FastAPI.

Решения:

Убедитесь, что FastAPI запущен: sudo systemctl status flashvsr
Проверьте, что FastAPI слушает на 127.0.0.1:8000
Проверьте логи Nginx: sudo tail -f /var/log/nginx/flashvsr_error.log
Проверьте конфигурацию Nginx: sudo nginx -t

🔌 WebSocket не работает

Проблема: Статусы не обновляются в реальном времени.

Решения:

Убедитесь, что в nginx конфиге есть заголовки:

proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";

Проверьте, что proxy_buffering off; в конфиге
Проверьте логи браузера (F12 → Console)

📦 Большие файлы не загружаются

Проблема: Ошибка при загрузке больших видео.

Решения:

Увеличьте client_max_body_size в nginx конфиге:
```
client_max_body_size 10G;
```

Увеличьте таймауты:

proxy_read_timeout 3600s;
proxy_connect_timeout 3600s;

🎬 FFmpeg ошибки

Проблема: Ошибки при обработке видео.

Решения:

Убедитесь, что используется системный FFmpeg:
```
which ffmpeg  # Должен быть /usr/bin/ffmpeg
```
Проверьте поддержку кодеков:
```
ffmpeg -encoders | grep libx264
```
Если не найден, установите:
```
sudo apt install ffmpeg
```

💾 Недостаточно места на диске

Проблема: Ошибки при записи файлов.

Решения:

Проверьте свободное место: df -h

Очистите старые сессии:

# Удаление сессий старше 7 дней
find ~/MyFlashVSR/sessions/ -type d -mtime +7 -exec rm -rf {} +

Очистите старые логи:

# Удаление логов старше 30 дней
find ~/MyFlashVSR/logs/ -name "log_*.txt" -mtime +30 -delete

🔗 Полезные ссылки

Сделано с ❤️ для удобной обработки видео

Name		Name	Last commit message	Last commit date
Latest commit History 54 Commits
backend		backend
modified scripts for FlashVSR		modified scripts for FlashVSR
.gitignore		.gitignore
README.md		README.md
flashvsr.service		flashvsr.service
nginx_flashvsr.conf		nginx_flashvsr.conf
requirements.txt		requirements.txt

Folders and files

Latest commit

History

Repository files navigation

🎬 FlashVSR UI

✨ Roadmap

Что необходимо сделать

📋 Содержание

🎯 О проекте

✨ Основные возможности

🔄 Обработка видео

👥 Многопользовательская система

⏳ Управление очередью GPU

🔧 Редактирование видео

📊 Логирование и мониторинг

🚀 Ключевые функции

🔐 Система сессий

⏳ GPU Очередь

📊 Прогресс-бар в реальном времени

🔄 Автоматическое восстановление состояния

📝 Детальное логирование

🛠 Требования

💻 Сервер

⚙️ Установка

Развертывание на сервере

1) Подготовка системы (Ubuntu)

2) Установка Conda и создание окружения flashvsr

3) Клонирование репозиториев рядом

4) Установка Block‑Sparse‑Attention (обязательно для FlashVSR)

5) Установка FlashVSR

6) Скачивание весов FlashVSR v1.1 (Git LFS)

7) Копирование модифицированных скриптов FlashVSR

8) Установка MyFlashVSR (веб‑сервер)

9) Настройка systemd (автозапуск)

9) Nginx (опционально, reverse proxy)

10) Полезные команды

📖 Использование

🎬 Основной рабочий процесс

1. 📤 Загрузка видео

2. 🚀 Улучшение видео

3. ✂️ Редактирование видео

4. 💾 Сохранение видео

🏗 Архитектура

🔄 Поток обработки видео

🔐 Система сессий

⏳ Очередь GPU

📂 Структура проекта

📝 API Endpoints

🔌 Основные endpoints

📤 Примеры запросов

🔧 Конфигурация

🔑 Основные настройки

📝 Настройка логирования

📊 Логирование

📁 Расположение логов

📝 Формат логов

🔍 Уровни логирования

📊 Что логируется

🔍 Мониторинг и отладка

📊 Просмотр логов

🔍 Проверка состояния

📈 Мониторинг ресурсов

❓ Решение проблем

⚠️ FastAPI не запускается

🌐 Nginx возвращает 502 Bad Gateway

🔌 WebSocket не работает

📦 Большие файлы не загружаются

🎬 FFmpeg ошибки

💾 Недостаточно места на диске

🔗 Полезные ссылки

About

Resources

Uh oh!

Stars

Watchers

Forks

Releases 1

Uh oh!

Contributors

Uh oh!

2) Установка Conda и создание окружения `flashvsr`