Видео идет черным после второго или двух

Question

Я в настоящее время использую JavaScript-интерфейс Youtube для встраивания видео на свою веб-страницу для управления списком воспроизведения, который у меня есть. Ошибка, с которой я, похоже, снова и снова получаю то, что сам видео становится черным сразу после загрузки названия, значка воспроизведения и значка загрузки. Кажется, что на секунду или два будет воспроизводиться видео. Но после того, как заголовок загорится, чтобы разрешить видео играть, я получаю черный фон. Заголовок отображается очень хорошо вместе с текстом youtube в правом углу. Но само видео не воспроизводится.

Эта проблема происходит только на iPhone из того, что я вижу. Прекрасно работает на Android и ПК.

var playlistDescription = []; 
    var playlist = []; 
    var tag = document.createElement("script"); 

    tag.src = "https://www.youtube.com/iframe_api"; 
    var firstScriptTag = document.getElementsByTagName("script")[0]; 
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 

    var youtubePlayer; 
    function onYouTubeIframeAPIReady() { 
     playlist.push("youtubevideoid"); 

     $(".video-list-item").each(function() { 
      if ($(this).data("id") != "youtubevideoid") { 
       playlist.push($(this).data("id")); 
      } 
     }) 

     youtubePlayer = new YT.Player("youtube-player", { 
      videoId: "youtubevideoid", 
      height: "378", 
      width: "672", 
      playerVars: { 
       "color1": "#046a3b", 
       "color2": "#faa820" 
      }, 
      events: { 
       "onReady": onPlayerReady, 
       "onStateChange": onPlayerStateChange 
      } 
     }); 


    } 

    function onPlayerReady(event) { 
     youtubePlayer.loadPlaylist(playlist); 
    } 

    function onPlayerStateChange(event) { 
     if (event.data == -1 || event.data == 0) { 
      var playlistDescriptionItem = playlistDescription[youtubePlayer.getPlaylistIndex()]; 
      $(".divSubHeadline").text(playlistDescriptionItem.title); 
      $(".pageContent span").text(playlistDescriptionItem.description); 
     } 
    } 

Это сценарий, который я использую для загрузки плейлиста youtube. Переменная списка воспроизведения содержит элементы списка воспроизведения, к которым подключено видео.

Не могу заставить его работать на jsfiddle - Мог бы просто быть мне .. Поэтому я вставлял скрипт здесь.

Answer 1

У меня была точно такая же проблема. Я нашел ответ здесь:

https://groups.google.com/forum/#!searchin/youtube-api-gdata/ios $ 20autoplay/YouTube-апи-GData/Fr39edfAKgs/FxfdHIu3H8MJ

«Внимание: Для того, чтобы предотвратить нежелательные загрузки через сотовые сети на счет пользователя, встроенные средства массовой информации не могут быть воспроизведены автоматически в Safari на iOS - пользователь всегда запускает воспроизведение. Контроллер автоматически предоставляется на iPhone или iPod touch после начала воспроизведения, но для iPad вы должны либо установить атрибут управления, либо предоставить контроллер с использованием JavaScript ».

Попробуйте код ниже:

youtubePlayer = new YT.Player("youtube-player", { 
     videoId: "youtubevideoid", 
     height: "378", 
     width: "672", 
     playerVars: { 
      "autoplay": 1, 
      "controls": 1, 
      "showinfo": 0 
     }, 
     events: { 
      "onReady": onPlayerReady, 
      "onStateChange": onPlayerStateChange 
     } 
    }); 


} 

function onPlayerReady(event) { 
    // do whatever you need to do here 
    // but don't call: 
    // event.target.playVideo(); 
} 

Answer 2

меня были те же проблемы.

Моя проблема казалась моя onPlayerReady функция:

function onPlayerReady(event) { 
    event.target.playVideo(); 
} 

Он работал отлично после того, как я удалил:

event.target.playVideo(); 

Если interessted, вот весь мой код:

player = new YT.Player(playerId, { 
    height: '410', 
    width: '820', 
    videoId: videoId, 
    playerVars: { 
     "autoplay": 1, 
     "controls": 1, 
     "showinfo": 0 
    }, 
    events: { 
     'onReady': onPlayerReady, 
     'onStateChange': onIntroPlayerStateChange 
    } 
}); 

function onPlayerReady(event) { 

} 

function onPlayerStateChange(event) { 
    if (event.data === 0) { 
     console.log("Movie ended - go get some fresh air"); 
    } 
} 

автозапуск, похоже, не работает на IOS7 :-(