Этот код работает на мгновение, но я думаю, что ссылки меняются, потому что на следующий день он не найден?
видео, воспроизводимое в Firefox/Chrome/Opera... как сделать видео тег для воспроизведения этого видео навсегда?!
<video width="480" height="270" controls="controls" style="color:green;">
<source src="youtubelink" type="video/mp4">
<source src="youtubelink" type="video/ogg">
<source src="youtubelink" type="video/webm">
Your browser does not support the video tag.
</video>
На самом деле нет надежного способа воспроизведения видео на YouTube в реальном теге видео. YouTube не хочет, чтобы вы делали это, и это, вероятно, против их TOS. В любом случае, этот URL-адрес, вероятно, будет регулярно изменяться, независимо от того, настраивает ли YT свою инфраструктуру или они уходят с пути, чтобы люди не могли напрямую обращаться к видеофайлам.
Однако есть несколько шагов, которые вы можете предпринять, чтобы иметь возможность делать все, что вы могли бы сделать, если бы вы использовали тег видео. Чтобы начать, вы можете добавить подсказку "html5 = 1" к встраиванию, в которой youtube будет использовать html5-видео вместо Flash (обычно это выполняется, но не всегда). Видео будет в iframe, но вы можете применить все обычные трюки CSS к этому iframe - непрозрачность, преобразования и т.д.
Если вы используете API YouTube, добавьте html5: 1 в playerVars. Если вы просто делаете прямое встраивание iframe, добавьте его в строку запроса следующим образом:
http://www.youtube.com/embed/okqEVeNqBhc?html5=1
Теперь, если вы хотите сделать еще один шаг, у Popcorn.js теперь есть отличный объект-обертка для API YouTube, который сделает YouTube (у них тоже один для Vimeo) видео ведут себя как HTMLVideoElement, с большинством тех же свойств, методов и событий. Это не идеально, но это довольно хорошо.
Примечание. Официальный источник этого файла находится на mozilla/popcorn-js repo, но этот в настоящее время впереди с исправлениями ошибок и функциями. Вам нужно включить последнюю версию Popcorn.js и wrappers/common/popcorn._MediaElementProto.js из этого репо. Убедитесь, что вы добавили &html5=1 в URL YT, когда вы установили src.
Различия, которые вы заметите, следующие:
Даже с оберткой API видео HTML5 просто немного лучше, чем YT API. например, более гибкое и лучшее сообщение о буферизации.
Вы не можете избавиться от значка YouTube в правом нижнем углу, который отображается при паузе или наведении мыши.
Вы не можете показывать рекламу YouTube.
Вы не можете получить доступ к фактическому видео/аудиоконтенту для таких вещей, как аудио API и рисование холста /webgl. Но вы все равно не могли этого сделать из-за ограничений, связанных с перекрестным происхождением.