Подтвердить что ты не робот

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 требуемых формата и пример того, как они устанавливают источник в теге видео, чтобы отображать их снова. И любое другое пособие было бы здорово, как установить качество и т.д. При выполнении преобразования.

Спасибо заранее.

4b9b3361

Ответ 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.