2016-10-03 6 views
17

Я просто не могу найти, что случилось с этим фрагментом видео.Видео не воспроизводится на iOS10 Chrome

<video poster="sample.jpg" loop autoplay controls muted playsinline> 
    <source type="video/webm" src="sample.webm"></source> 
    <source type="video/mp4" src="sample.mp4"></source> 
</video> 

Видео воспроизводится без каких-либо проблем в Safari (не тестировали на более ранние версии IOS, но моя единственная забота есть проблема автозапуска?), Но в Chrome единственным, что я вижу, это изображение обложки и кнопка воспроизведения, которая ничего не запускает. Я что-то упускаю? Мне действительно нужно использовать JS, чтобы заставить его работать?

Обновление: Кажется, что есть проблема с воспроизведением файлов Webm с iOS Chrome - я пробовал несколько файлов из разных мест, и они, кажется, нужны для загрузки сначала, прежде чем играть.

ответ

9

Google Chrome в настоящее время имеет ошибки, в которой он не будет автовоспроизведением .webm видео , если он приходит после всего остального. Попробуйте использовать код опубликован по адресу: http://thenewcode.com/777/Create-Fullscreen-HTML5-Page-Background-Video

enter image description here

Если предыдущий совет не помогает, попробуйте использовать скриптовые примеры воспроизведения (video.js и simpl) на Github:

https://github.com/videojs/video.js

https://github.com/samdutton/simpl/blob/gh-pages/video/scripted/index.html

Кроме того, прочитайте вопрос de ге- к приглушенным автозапуск в мобильных браузерах:

https://github.com/whatwg/html/issues/976

Это должно быть полезно читать С.О. размещать, а также:

Efficiently detect if a device will play silent videos that have the autoplay attribute

+1

Если вы используете Chrome на iOS, есть проблема с воспроизведением видео по указанному URL, но это похоже на мой макет. –

3

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

<video poster="sample.jpg" loop autoplay controls muted playsinline> 
    <source type="video/webm" src="sample.webm"></source> 
    <source type="video/mp4" src="sample.mp4"></source> 
</video> 

... Обновление: Кажется, есть проблема с игрой WebM файлов с прошивкой Chrome.

Самый простой и лучший исправить, чтобы убедиться, вы объявляете mp4 файл первым, а затем объявить WebM на втором месте (реверсе вашего показанного порядка). Я считаю, что iOS ожидает, что mp4 станет первым файлом в HTML-тегах HTML5. Все iOS видит src="sample.webm", который не является допустимым ожидаемым кодеком MPEG, поэтому приводит к вашей «... кнопке воспроизведения, которая ничего не запускает». Вы где-то молчали.

Try:

<video poster="sample.jpg" loop autoplay controls muted playsinline> 
    <source type="video/mp4" src="sample.mp4"></source> 
    <source type="video/webm" src="sample.webm"></source> 
</video> 

Примечание стороны: Просто мое мнение, но я думаю, имея WebM здесь является излишним, поскольку основной опорной системы (Google на основе технологий) уже может обрабатывать mp4 в любом случае.

Лучше предложить эти видео декодеров в браузерах [конечных пользователей] выбор mp4 или О (только в случае Firefox).

PS: Автоматическая игра отключена на большинстве мобильных систем из-за допусков данных SIM-карты. Конечный пользователь должен выбрать воспроизведение этого видео. Вероятно, в сети есть умные обходные пути, просто помните, что это ожидаемое поведение, так что это не проблема с вашим текущим кодом.

+0

Свободно распределяемые системы не могут воспроизводить mp4, это одна из причин поддержки WebM (= VP9). Ogv (= Theora) во всех аспектах хуже, чем VP9, ​​и Firefox уже может играть в WebM = VP9. –

 Смежные вопросы

  • Нет связанных вопросов^_^