Создание URL-адресов youtube.com/embed для iOS

Для данного видео на YouTube вы можете посетить http://youtube.com/watch?v=[code] на любом устройстве iOS, чтобы просмотреть видео.

Однако, если вы используете URL http://youtube.com/embed/[code], например, в iframe на странице или в Colorbox modal - он не будет воспроизводиться на iOS.

Например, если вы используете такой код:

<iframe class="youtube-player" type="text/html" width="640" height="385" src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0">

Вы видите ошибку:

В настоящее время ваш браузер не распознает доступные видеоформаты. Нажмите здесь, чтобы просмотреть наши часто задаваемые вопросы о видео HTML5.

Чтобы добавить оскорбление к травме, ссылка не нажимается на iOS, поэтому я не знаю, на какой странице это происходит. Существует страница HTML5 на YouTube, но в ней нет ничего особенно полезного или неожиданного.

Есть ли синтаксис, который может быть для iframe-встраивания, который работает как ожидалось на iOS?

Ответ 1

Попробуйте это, он просто работает:

<object>
    <param name="movie" value="http://www.youtube.com/v/[VIDEO_ID]"></param>
    <embed src="http://www.youtube.com/v/[VIDEO_ID]" type="application/x-shockwave-flash"></embed>
</object>

Edit: Это работает, потому что Apple заменяет тэг html встроенным встроенным проигрывателем фильмов, который может воспроизводить видео с YouTube.

Ответ 2

Рассмотрим использование MediaElement.js. Он может обернуть видео youtube для отображения в виде html5 на ios, с резервными флэш-памятью для других типов устройств/браузеров.

Одна из демонстраций, предоставляемых источником, показывает это, и это довольно просто:

<video width="640" height="360" id="player1">
    <source type="video/youtube" src="http://www.youtube.com/watch?v=nOEw9iiopwI" />
</video>

<script>
    $('video').mediaelementplayer({
        success: function(media, node, player) {
            $('#' + node.id + '-mode').html('mode: ' + media.pluginType);
    }
    });
</script>