Comment puis-je lire automatiquement une vidéo Youtube (IFrame API) en mode muet?

Question

<br />

La vidéo n'est pas en sourdine! Je veux que le volume soit à 0 lorsqu'elle est diffusée pour la première fois...

Answer 1

Youtube ne permet pas de désactiver le son via des paramètres d'URL (voir http://code.google.com/apis/youtube/player_parameters.html).

Vous devez utiliser JavaScript pour cela. Voir http://code.google.com/apis/youtube/js_api_reference.html pour plus de détails.

Cependant, veuillez noter l'avertissement sur la page liée ci-dessus : "La dépréciation de l'API JavaScript du lecteur YouTube a été annoncée le 27 janvier 2015. Les intégrations Flash de YouTube ont également été dépréciées. Consultez la politique de dépréciation pour plus d'informations. Veuillez migrer vos applications vers l'API IFrame, qui peut utiliser intelligemment le lecteur intégré approprié - HTML () ou Flash () - que le client prend en charge."

Html

<br />

Veuillez noter enablejsapi=1 dans l'URL.

Javascript

var player =  iframe.getElementById('player');
player.mute();

Mise à jour

Le code précédent avait quelques problèmes et ne fonctionnait pas avec l'API actuelle (la syntaxe de playerVars était incorrecte). Voici le code mis à jour. Vous devrez peut-être ajuster les paramètres selon vos besoins.

      // 1. Ce code charge de manière asynchrone le code de l'API du lecteur IFrame.
      var tag = document.createElement('script');

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

      // 2. Cette fonction crée un <iframe> (et un lecteur YouTube)
      //    après le téléchargement du code de l'API.
      var player;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          height: '100%',
          width: '100%',
          playerVars: {
                    autoplay: 1,
                    loop: 1,
                    controls: 0,
                    showinfo: 0,
                    autohide: 1,
                    modestbranding: 1,
                    vq: 'hd1080'},
          videoId: '1pzWROvY7gY',
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
      }

      // 3. L'API appellera cette fonction lorsque le lecteur vidéo est prêt.
      function onPlayerReady(event) {
        event.target.playVideo();
        player.mute();
      }

      var done = false;
      function onPlayerStateChange(event) {

      }
      function stopVideo() {
        player.stopVideo();
      }

Answer 2

Le player_api sera obsolète le 25 juin 2015. Pour lire des vidéos YouTube, il existe une nouvelle API IFRAME_API

Il ressemble au code suivant :

  // 2. Ce code charge de manière asynchrone le code de l'API du lecteur IFrame.
  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. Cette fonction crée un <iframe> (et un lecteur YouTube)
  //    après le téléchargement du code de l'API.
  var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
      height: '390',
      width: '640',
      videoId: 'M7lc1UVf-VE',
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
  }

  // 4. L'API appelle cette fonction lorsque le lecteur vidéo est prêt.
  function onPlayerReady(event) {
    event.target.playVideo();
  }

  // 5. L'API appelle cette fonction lorsque l'état du lecteur change.
  //    La fonction indique que lors de la lecture d'une vidéo (état=1),
  //    le lecteur doit lire la vidéo pendant six secondes, puis s'arrêter.
  var done = false;
  function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING && !done) {
      setTimeout(stopVideo, 6000);
      done = true;
    }
  }
  function stopVideo() {
    player.stopVideo();
  }

Answer 3

Essayez c'est bien fonctionnel

                var player;
        function onYouTubeIframeAPIReady()
        {player=new YT.Player('playerId',{events:{onReady:onPlayerReady}})}
        function onPlayerReady(event){player.mute();player.setVolume(0);player.playVideo();}

        </body></html></code></pre>
</div>
</div>
</p></x-turndown>

Answer 4

Mise à jour 2021 pour boucler et lire automatiquement la vidéo sur les appareils de bureau / mobiles (testé sur iPhone X - Safari).

J'utilise l'événement onPlayerStateChange et si la vidéo se termine, je rejoue la vidéo. Référence à l'événement onPlayerStateChange dans l'API YouTube.

  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 player;

  function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
      height: '100%',
      width: '100%',
      playerVars: {
        autoplay: 1,
        loop: 1,
        controls: 0,
        showinfo: 0,
        autohide: 1,
        playsinline: 1,
        mute: 1,
        modestbranding: 1,
        vq: 'hd1080'
      },
      videoId: 'ScMzIvxBSi4',
      events: {
        'onReady': onPlayerReady,
        'onStateChange': onPlayerStateChange
      }
    });
  }

  function onPlayerReady(event) {
    event.target.mute();

    setTimeout(function() {
      event.target.playVideo();
    }, 0);
  }

  function onPlayerStateChange(event) {
    if (event.target.getPlayerState() == 0) {
      setTimeout(function() {
        event.target.playVideo();
      }, 0);
    }
  }

Answer 5

Vous pouvez sélectionner le lecteur vidéo, puis définir son volume :

var mp = iframe.getElementById('movie_player');
mp.setVolume(0);

Source : http://userscripts.org/scripts/review/49366