HTML5 видео и Chrome/Webkit

У меня есть некоторые проблемы с элементом <video>, я думаю. У меня есть небольшая демонстрационная страница, где я запускаю видео. Этот файл доступен в .webm, .mp4 и .ogv. Видео воспроизводится правильно в Firefox (10) mac + win, Safari mac, Chrome mac.HTML5 видео и Chrome/Webkit

Ни одна из окон версии Safari и Chrome не воспроизводит/не показывает этот видеофайл (может быть, проблема Webkit?). Это как HTML код выглядит:

<video controls> 
    <source src="video/chicane.webm" type='video/webm; codecs="vp8, vorbis"'/> 
    <source src="video/chicane.mp4" type="video/mp4"/> 
    <source src="video/chicane.ogv" type="video/ogv"/> 
</video>

Я также с помощью .htaccess файла нормализовать типы MIME, выглядит как

# Video 
AddType video/ogg      ogv 
AddType video/mp4      mp4 m4v 
AddType video/webm      webm

Посмотрев в Chromes или сафари инструментов разработчика (закладка сети) , похоже, что он хочет воспроизвести файл .webm, но он не может изобразить mime type (показывается неопределенный), плюс кажется, что он пытается дважды получить доступ к файлам.

взглянуть себе:

http://www.typeofnan.com(«удивительная вкладку»)

Я понятия не имею, почему он прекрасно работает на OSX с обоих браузерами, если кто-то может обнаружить ошибку на сайте, пожалуйста, дай мне знать. В настоящее время я обнаружил некоторое обнаружение функции и видеоролик use Javascript to .play(). Однако, если я использую атрибут autoplay на теге <video>, Chrome по крайней мере воспроизводит аудио, но все равно видео вообще.

Ссылка: Site source on github

источник

2012-02-06 jAndy

Видео должно отображаться нажатием на вкладку «awsomeness»? – Zakaria

@Zakaria: точно. Спасибо за головы, я обновил вопрос. – jAndy

(FWIW, Chrome 17) Не выдавая запрос дважды, я не уверен, что первая запись в инструментах chromes dev не показана с любыми параметрами запроса, но, глядя на запрос в Fiddler (отладочный прокси), выдается только один раз и правильно отвечает с размером + видео/webm, он воспроизводится после загрузки. –

Вы пытались добавить codecs дополнительную информацию в каждом <source>?
Возможно, WebKit не может автоматически распознавать кодек, используемый для кодирования источника видео.

// from html5rocks.com, see link on the bottom of answer 
<video> 
    <source src="movie.mp4" type='video/mp4; codecs="avc1.42E01E, mp4a.40.2"' /> 
    <source src="movie.webm" type='video/webm; codecs="vp8, vorbis"' /> 
</video>

http://www.html5rocks.com/en/tutorials/video/basics/#toc-markup

источник

2012-02-06 14:12:17

yes - Я указал кодеки. Но это не помогает, и это даже не кажется необходимым. Я просто добавил кодек для файла 'webm'. – jAndy

@jAndy выглядит, мой второй совет - попытаться предоставить только один источник видео и решить, какой формат поддерживается. Когда вы переходите к предоставленной ссылке и пытаетесь воспроизвести образцы видеороликов, это сработает для вас? –

да, это путаница для меня. Также демонстрации на 'html5rocks' корректно работают для меня в chrome/win. – jAndy

Он работает на моей машине: Windows 7 Family + Chrome 16. Что я сделал, что я открыл Инструменты разработчика. Затем я добавил autoplay="autoplay" в тег video. Далее, я редактировал HTML source тег, связанный с форматом webm, так что я мог бы:

<source src="video/chicane.webm" type="video/webm; codecs=\" vp8, vorbis\"">

Может быть, это была просто проблема побег (с двойными кавычками).

источник

2012-02-06 14:20:39 Zakaria

Я написал эту разметку с нуля, используя ваши ссылки на видео, и это, кажется, работает нормально:

<video controls width="360" height="360"> 
    <source src="http://www.typeofnan.com/video/chicane.mp4" type="video/mp4"> 
    <source src="http://www.typeofnan.com/video/chicane.webm" type="video/webm"> 
    <source src="http://www.typeofnan.com/video/chicane.ogv" type="video/ogg"> 
    <span title="No video playback capabilities, please download the video below">Your video</span> 
</video> 
<p> 
    <strong>Download video:</strong> <a href="http://www.typeofnan.com/video/chicane.mp4">MP4 format</a> | <a href="http://www.typeofnan.com/video/chicane.ogv">Ogg format</a> | <a href="http://www.typeofnan.com/video/chicane.webm">WebM format</a> 
</p>

См Video for Everybody.

источник

2012-02-06 16:46:19

Вот что я сделал, чтобы заставить его работать. Поскольку браузер принимает первое видео, которое может воспроизводить, я сначала помещаю версию WEBM, и у Chrome нет проблем с ней.

источник

2012-09-27 02:43:48

HTML5 видео и Chrome/Webkit

ответ

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