FFMPEG Преобразование HTML 5 видео не работает
Я использую FFMPEG для преобразования видео в .mp4, ogg,.webm, чтобы его можно было просматривать в всех браузерах, поддерживающих HTML5, используя тег видео. Проблема заключается в том, что мне удается преобразовать видео в 3 требуемых формата, но он не отображает видео в теге видео, все, что я получаю, это IE9: красный крест, Firefox: серый крест, может это быть проблемой с преобразованием или это связано с тем, как я добавляю их к источнику видеотега. Вот что я сделал:
-
Командная строка FFmpeg:
ffmpeg -i test.mp4 test.mp4
ffmpeg -i test.mp4 test.ogg
ffmpeg -i test.mp4 test.webm
-
Вот тег видео:
<video id="video" height="340" width="470" onplaying="PlayVideoFromVid('PAUSE')" onpause="PlayVideoFromVid('PLAY')" onended="ResetVideo()" preload="true" autobuffer="true" controls="true">
<source src="test.ogg" type="video/ogg"></source>
<source src="test.mp4" type="video/mp4"></source>
</video>
-
Строки Webconfig для поддержки видео:
<staticContent>
<mimeMap fileExtension=".mp4" mimeType="video/mp4" />
<mimeMap fileExtension=".ogg" mimeType="audio/ogg" />
<mimeMap fileExtension=".oga" mimeType="audio/ogg" />
<mimeMap fileExtension=".ogv" mimeType="video/ogg" />
<mimeMap fileExtension=".webm" mimeType="video/webm" />
</staticContent>
Было бы здорово, если бы кто-то мог отправить мне необходимые параметры для ffmpeg, чтобы преобразовать видео в 3 требуемых формата и пример того, как они устанавливают источник в теге видео, чтобы отображать их снова. И любое другое пособие было бы здорово, как установить качество и т.д. При выполнении преобразования.
Спасибо заранее.
Ответы
Ответ 1
Отсортировано, спасибо за всю помощь:) Я нашел следующее:
1. Вам нужно загрузить последние ffmpeg + пресеты:
ffmpeg.arrozcru.org/autobuilds/ffmpeg/mingw32/static/
2. Вам необходимо создать переменную окружения HOME:
(a) www.moosechips.com/2009/08/installing-ffmpeg-binary-in-windows/
(b) www.itechtalk.com/thread3595.html
3. Скопируйте пресеты в папку переменных окружения
4. Для преобразования с помощью ffmpeg необходимо использовать следующие команды:
Для mp4 (H.264/ACC):
ffmpeg -i INPUTFILE -b 1500k -vcodec libx264 -vpre slow -vpre baseline -g 30 "OUTPUTFILE.mp4"
Для webm (VP8/Vorbis):
ffmpeg -i "INPUTFILE" -b 1500k -vcodec libvpx -acodec libvorbis -ab 160000 -f webm -g 30 "OUTPUTFILE.webm"
Для ogv (Theora/Vorbis):
ffmpeg -i "INPUTFILE" -b 1500k -vcodec libtheora -acodec libvorbis -ab 160000 -g 30 "OUTPUTFILE.ogv"
Ответ 2
Сначала я попробую этот код. Это как можно проще.
<video controls="true">
<source src="test.mp4" type="video/mp4"></source>
<source src="test.webm" type="video/webm"></source>
<source src="test.ogv" type="video/ogg"></source>
</video>
Создание файлов mp4, минимальное количество аргументов. К сожалению, я не очень много тестировал.
ffmpeg -i input_file -vcodec libx264 -vpre medium output_file.mp4
Для создания файлов ogv вы должны использовать ffmpeg2theora. С ffmpeg слишком много проблем.
Ответ 3
Я думаю, потому что я все еще новичок, мне не разрешают оставлять комментарии? Поэтому оставляем это как ответ, хотя я думаю, что это больше похоже на предположения.
Начало игры с видео HTML5 неделю назад. Я столкнулся с множеством проблем, которые в конечном итоге оказались из-за преобразованных файлов фильмов, с которыми я работал. Вот код, который я использовал для своих примеров:
<video id="movie" width="600" height="338" poster="http://yourDomain.com/yourDirectory/posterFrame.jpg" controls="true" autoplay="true">
<source src="http://yourDomain.com/yourDirectory/yourMovie.mp4" type='video/mp4' />
<source src="http://yourDomain.com/yourDirectory/yourMovie.webm" type='video/webm' />
<source src="http://yourDomain.com/yourDirectory/yourMovie.ogg" type='video/ogg; codecs="theora, vorbis"' />
<object width="600" height="338" type="application/x-shockwave-flash" data="http://whywouldyouclickthat.com/flowplayer/flowplayer-3.2.7.swf"><param name="movie" value="http://yourDomain.com/flowplayer/flowplayer-3.2.7.swf" /><param name="allowfullscreen" value="true" /><param name="flashvars" value='config={"clip": {"url": "http://yourDomain.com/yourDirectory/yourMovie.mp4", "autoPlay":true, "autoBuffering":true},"plugins": {"controls": null}}' /></object>
</video>
Я смоделировал свой код после Mark Pilgrim описать запись в HTML (видео).
Несколько вещей, которые я могу придумать, чтобы попробовать:
1) Удалите дополнительные атрибуты из вашего тега. Я менее знаком с тем, что вы реализуете (onplaying, onpause), но, возможно, сначала попробуйте сначала использовать основы: ширину, высоту и элементы управления. Смотрите, помогает ли это.
2) В моих тестах я преобразовал версии .ogg и .webm, используя Miro. По какой-то причине фильмы, казалось бы, воспроизводят файл локально... но когда я просматривал их более одного раза в своих браузерах, я получал пустые экраны. Я в конечном итоге использовал Firefogg, чтобы в конечном итоге преобразовать мои версии .ogg и .webm. Это было странное поведение.
Не уверен, что FFmpeg является обработчиком транзакций и что-то, что вам нужно использовать как часть вашего рабочего процесса. Но если вы просто хотите, чтобы ваш код и примеры фильмов были функциональными и запущенными, Firefogg помогло.
В конечном итоге я понял, в чем причина, когда я заменил рабочие версии других фильмов, а не мои конвертированные. Я бы порекомендовал вам попробовать подключить версии .mp4,.webm и .ogg Big Buck Bunny... и посмотреть, сможете ли вы даже отобразить их. По крайней мере, вы можете выделить, является ли это проблемой синтаксиса или преобразования.
3) Наконец, я бы рекомендовал тестировать один видеофайл и один браузер за раз. Это, вероятно, данное, но все равно стоит выбросить его.
Sidenote: как только вам будет удобно идти с каждым типом файла, обязательно сначала укажите версию .mp4. Это из видеозаписи Pilgrim HTML5:
iPads, работающие с iOS 3.x, имели ошибку, которая мешала им замечать что-либо, кроме первого видеоисточника. iOS 4 (бесплатное обновление для всех iPad) исправляет эту ошибку. Если вы хотите доставить видео владельцам iPad, которые еще не обновились до iOS 4, вам сначала нужно будет указать ваш MP4 файл, а затем бесплатные видеоформаты.
Ответ 4
Я попробовал много видеофайлов, опций кодирования, конфигураций серверов, версий FFMPEG, других видеокодеров и т.д., прежде чем выяснять, что одна вещь, которую следует учитывать при обслуживании файлов MP4 для IE9, - это метаданные файла, называемые атомом moov, встроенными в Сам файл MP4. Если он находится в конце файла, где некоторые кодеры, в том числе ffmpeg, помещают его, IE9 не начнет воспроизводить видео, если не будет загружен весь видеофайл. Перемещение метаданных атома moov в начало файла обеспечивает прогрессивную загрузку файла MP4, а IE9 прекрасно обрабатывает видео.
Для выполнения этой операции существует инструмент qt-faststart. Разработал чудеса для меня, компилируя и используя версию командной строки Linux, распространяемую с помощью ffmpeg.
make tools/qt-faststart
sudo cp tools/qt-faststart /usr/local/bin/
qt-faststart original_file.mp4 modified_file.mp4
Ответ 5
У меня была та же проблема с IE9, показывающая красный крест при попытке показать видео .mp4.
Сохраняя его простое использование ffmpeg (как предложил Майклс), я решил проблему для меня.
<video id="movie" width="600" height="360" controls preload="auto">
<source src="http://yourDomain.com/faceplant.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"'></source>
<source src="http://yourDomain.com/faceplant.webm" type='video/webm; codecs="vp8.0,vorbis"'></source>
<source src="http://yourDomain.com/faceplant.ogv" type='video/ogg; codecs="theora, vorbis"'></source>
</video>
Параметры ffmpeg: (я использовал .ogv из ffmpeg2theora в качестве моего входного файла):
ffmpeg -i input_file.ogv -vcodec libx264 -vpre hq output_file.mp4
Моя версия ffmpeg:
ffmpeg 0.8.3
libavutil 51. 9. 1 / 51. 9. 1
libavcodec 53. 7. 0 / 53. 7. 0
libavformat 53. 4. 0 / 53. 4. 0
libavdevice 53. 1. 1 / 53. 1. 1
libavfilter 2. 23. 0 / 2. 23. 0
libswscale 2. 0. 0 / 2. 0. 0
libpostproc 51. 2. 0 / 51. 2. 0
Ответ 6
Попробовав большинство предложенных выше предложений, вот что на самом деле сработало для меня, чтобы конвертировать wmv файлы в маленькие mp4, webm, ogg на машине Windows7-64:
64bit\ffmpeg -i test.wmv test.mpg
old\ffmpeg -i test.mpg -vcodec h264 -s 320x240 test.mp4
32bit\ffmpeg -i test.mpg -vcodec libvpx -acodec libvorbis -f webm -s 320x240 test.webm
32bit\ffmpeg -i test.mpg -vcodec libtheora -acodec libvorbis -s 320x240 test.ogg
old\ffmpeg - версия SVN-r5570
64bit\ffmpeg - версия N-38292-ga4c22e3 построена 2/27/12 14:55:47
32bit\ffmpeg - версия N-39267-g4082198 построена 25.03.12 20:25:08
(Только 64-битная версия будет читать wmv, поэтому я использовал ее для преобразования в mpg как общий формат.
Только старый ffmpeg создаст mp4.)
Ответ 7
Убедитесь, что ваше видео доступно с помощью правильного Content-type
-header
Он должен быть Content-Type:video/mp4
для mp4/m4v.