HTML5 видео плеер не работает на IPad/iPhone

Question

Примечание Это оказалось проблемой имитатор, не проблема кодирования видео, видеть мое редактирование пониже ...

Я создаю веб сайт для местного колледжа, и они хотят иметь возможность добавлять короткие видеоролики, которые люди могут просматривать в Интернете. Я потратил немало времени, пытаясь разобраться, как заставить видео играть на iDevices, но потерпел неудачу.

Я использую Video.js (http://www.videojs.com), и есть HTML, который выглядит следующим образом ...

<video id="videoplayer" class="video-js vjs-default-skin" controls preload="auto" width="640" height="352" poster="/Content/Images/logobg.png" data-setup='{}'> 
    <source src="/Content/Videos/video.m4v" type="video/mp4"> 
    <source src="/Content/Videos/video.webm" type="video/webm"> 
    <p class="vjs-no-js"> 
    To view this video please enable JavaScript, and consider upgrading to a web browser that <a href="http://videojs.com/html5-video-support/" target="_blank">supports HTML5 video</a> 
    </p> 
</video> 

Это прекрасно работает на настольных браузерах, где он использует файл m4v. Однако, если я загружаю страницу на iDevice, видеопроигрыватель говорит: «для этого видео не найдено никакого совместимого источника», что звучит так, будто ему не нравится ни m4v, ни файл webm.

Я создал файл в Интернете с помощью инструкций, найденных на http://daniemon.com/blog/how-to-convert-videos-to-webm-with-ffmpeg/. Я попытался создать файл .mov, используя принятый ответ на iPad Doesn't Render H.264 Video with HTML5, но это дало ту же ошибку.

Любые идеи, как я могу поддерживать iDevices? Пожалуйста, не слепите меня с наукой, я настоящий новичок со всем этим видеоматериалом и вам нужны простые инструкции!

Редактировать Проблема, с которой я столкнулась, заключалась в том, чтобы попытаться просмотреть сайт на мобильном симуляторе. Когда я загрузил сайт на настоящий сервер и попробовал его на iPad, он работал нормально. Итак, если у кого-то есть аналогичная проблема, сначала используйте что-то вроде Handbrake для кодирования видео, так как это, кажется, все в порядке, а затем убедитесь, что вы тестируете на реальном мобильном устройстве, а не на симуляторе!

Answer 1

Как правило, использование видеофайла mp4 обеспечит воспроизведение по самому широкому выбору браузеров/устройств, включая последние iOS и большинство Android-устройств.

В частности: видео H.264, аудио AAC в контейнере mp4 (то есть файл).

Это широко поддерживается, поэтому у вас не должно быть слишком много проблем при создании видео или при необходимости конвертации видео в этот формат.