web-dev-qa-db-fra.com

La lecture automatique de Youtube ne fonctionne pas sur les appareils mobiles avec lecteur HTML5 intégré

À mon problème, j'ai un lien <a href="http://www.youtube.com/embed/YT-ID" class="overlay_video"></a>. Je souhaite lire la vidéo en cliquant sur le lien dans une fenêtre de superposition Fancybox. Ce n'est pas un problème. Le problème réside dans les paramètres, par exemple "autoplay" ou "autohide".

Le lien suivant ne fonctionne pas:

<a href="http://www.youtube.com/embed/YT-ID?autoplay=1" class="overlay_video"></a>

La fenêtre de superposition s’est ouverte, mais la lecture de la vidéo n’est pas automatique.

EDIT: je veux utiliser le lecteur HTML5 sur des appareils mobiles. Sur un navigateur de bureau, cela fonctionne avec les paramètres, mais pas sur les appareils mobiles.

html5mobileyoutubefancyboxoverlay
54
theowi

En fin de compte, la lecture automatique ne peut pas être effectuée sur les appareils iOS (iPhone, iPad, iPod touch) et Android.

Voir https://stackoverflow.com/a/8142187/2054512 et https://stackoverflow.com/a/3056220/2054512

55
orzechow

Regardez le code ci-dessous. Testé et trouvé fonctionnant sur des appareils mobiles et tablettes.

<!-- 1. The <iframe> (video player) will replace this <div> tag. -->
<div id="player"></div>

<script>
  // 2. This code loads the IFrame Player API code asynchronously.
  var tag = document.createElement('script');

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

  // 3. This function creates an <iframe> (and YouTube player)
  //    after the API code downloads.
  var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
      height: '390',
      width: '640',
      videoId: 'M7lc1UVf-VE',
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
  }

  // 4. The API will call this function when the video player is ready.
  function onPlayerReady(event) {
    event.target.playVideo();
  }

  // 5. The API calls this function when the player's state changes.
  //    The function indicates that when playing a video (state=1),
  //    the player should play for six seconds and then stop.
  var done = false;
  function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING && !done) {
      setTimeout(stopVideo, 6000);
      done = true;
    }
  }
  function stopVideo() {
    player.stopVideo();
  }
</script>
11
Zubi

Il existe un moyen de faire une lecture automatique sur YouTube et de lire des listes de lecture complètes. Obtenez le navigateur Adblock pour Android, puis accédez au site Web youtube, configurez-le pour la version de bureau de la page, fermez le navigateur Adblock, puis rouvrez-le et vous obtiendrez la version de bureau sur laquelle la lecture automatique fonctionnera.

L'utilisation de la version de bureau signifie également que AdBlock fonctionnera. La version mobile appelle le lecteur YouTube autonome. C'est pourquoi vous souhaitez utiliser la version de bureau de la page pour que la lecture automatique fonctionne et que le blocage des publicités fonctionne.

1
Chilly8