Об этом проекте
next-video позволяет приложениям Next.js импортировать видеофайлы и отображать их через React-компонент Video. Команда автоматической установки устанавливает пакет, создаёт каталог /videos, обновляет конфигурацию Next.js и .gitignore, добавляет типы импорта TypeScript, настраивает скрипт синхронизации с отслеживанием изменений, а также может подготовить учётные данные Mux и демонстрационную страницу. При ручной установке используются withNextVideo в next.config, ссылка на тип video.d.ts и команда next-video sync. Пользователи Turbopack могут настроить псевдоним пути @videos.
Исходные видеофайлы рекомендуется хранить вне Git, а созданные JSON-файлы метаданных ассетов — коммитить. Команда sync загружает и обрабатывает локальные видео, может отслеживать новые файлы во время разработки и создаёт сопоставления с удалёнными ассетами. Удалённые URL видео также можно импортировать; для строковых URL, передаваемых во время выполнения, пакет предоставляет необязательный обработчик запросов /api/video для маршрутизаторов App и Pages. По умолчанию этот маршрут не требует аутентификации, поэтому при публикации в продакшене его следует защитить. Существующие ассеты Mux можно подключить с помощью next-video adopt по playback ID в интерактивном или неинтерактивном режиме.
Mux является провайдером по умолчанию и предлагает хранение вне репозитория, доставку через CDN, адаптацию HLS, автоматические постеры, миниатюры при наведении на временную шкалу, поддержку потоковых форматов, созданные ИИ субтитры и видеоаналитику. Другие поддерживаемые провайдеры включают Vercel Blob, Backblaze, Amazon S3 и Cloudflare R2 с различными переменными окружения, параметрами конфигурации и наборами функций; провайдерам без обработки видео требуются совместимые с веб-средой MP4-файлы.
Слой плеера поддерживает компоненты тем из player.style, импорт только плеера, легковесный компонент фонового видео, пользовательские свойства poster и blurDataURL, элемент постера в слоте, такой как next/image, а также полностью пользовательские плееры через свойство as. Хранение метаданных ассетов также можно настроить, заменив стандартные хуки загрузки, сохранения и обновления JSON-файлов.
Comments
0 Rating appears after 10 ratings
Sign in to join the discussion.