Как тег аудио / видео HTML5 определяет продолжительность
Теги HTML5 <audio> и <video> поддерживают свойство duration. Мне любопытно, как без загрузки всего исходного файла аудио / видео браузер может определить продолжительность мультимедиа?
Я спрашиваю, потому что хотел бы реализовать ту же функциональность в бэкэнд-сервисе, который я пишу, который:
- Принять URL-адрес для mp3
- Определите длину (в секундах) файла без загрузки всего файла
Ответы 1
Большинство видеоконтейнеров содержат как визуальные, так и звуковые элементы, а также блок метаданных, который описывает такие вещи, как продолжительность, цветовое пространство, используемые кодеки и смещение для каждого кадра (полезно при поиске). В типичном видео, закодированном для Интернета как MP4, этот блок (он же атом MOOV) по умолчанию находится в конце файла (поскольку местоположение кадра не будет известно до конца), если не был выполнен второй проход для его перемещения в передняя например:
ffmpeg -i source.mp4 -c:a copy -c:v copy -movflags faststart destination.mp4
(копирует аудио и видео без изменений, просто перемещает метаданные в начало, чтобы обеспечить более быстрый доступ)
Возможно, вы видели какое-то веб-видео, где вы можете искать почти сразу с помощью MP4, а некоторые, где вы не можете точно искать, пока файл не будет полностью загружен ... это потому, что браузер должен делать `` догадки '', пока он не получит это метаданные
В частности, для mp3-файлов вы можете использовать что-то вроде это - чтобы запросить сервер, вы получите только данные ID3 Tag и eTag (последние 127 и 227 байтов) без необходимости загружать весь файл
Если сервер, на котором размещен файл, поддерживает запросы диапазона байтов, вы можете запросить конкретный блок, который вам нужен. Поскольку местоположение тега mp3 известно, возможно, браузер уже делает это (сначала захватывает метаданные, а затем продолжает)
благодаря. Теперь мне интересно, должен ли мой интерфейс просто загружать тег <audio> в скрытый элемент только для того, чтобы извлечь продолжительность, чтобы затем я мог отправить его в запросе на бэкэнд ...
Я мог видеть, что это работает для файла на диске, но как насчет того, что где-то на веб-сервере? Тег
<audio>, похоже, может это сделать, если только он действительно не кэширует файл так быстро, что я этого не замечаю ...