13

No puedo obtener la duración/duración del video correcto (en segundos) de un video cargado/cued mediante el método getDuration() de YouTube Player API; el mismo método, sin embargo, devuelve un valor válido una vez que el video comienza a reproducirse. Preguntándose cómo YouTube puede mostrar la duración válida de un video cargado/cued.YouTube Player API: ¿Cómo obtener la duración de un video cargado/señalizado sin reproducirlo?

Cuando me carga esta página HTML con un segundo clip de vídeo 15, me sale el siguiente resultado de la depuración:

estado = 5 Duración = -0.000025

Cuando pulso el botón de reproducción, consigo la siguiente salida de depuración:

estado = 3 duración = 15,

agradecería mucho una solución o una solución. Cargando, e inmediatamente jugar y pausar al jugador no sería mi método favorito.

<html> 
<head> 
    <script type="text/javascript"> 
    var videoId; 
    videoId = 'http://www.youtube.com/v/4TSJhIZmL0A'; // bbc 
    // videoId = 'http://www.youtube.com/v/ezwyHNs_W_A'; // physics 

    function $(id) { 
     return document.getElementById(id); 
    } 
    </script> 

    <script src="http://www.google.com/jsapi"></script> 
    <script> 
    google.load("swfobject", "2.1"); 
    </script> 

</head> 

<body> 


    <table> 
    <tr><td> 
     <div id="player"> 
     You need Flash player 8+ and JavaScript enabled to view this video. 
     </div> 

    <script> 
     var ytplayer; 

     function myOnPlayerStateChange(state) { 
      switch(state) { 
      case 1: // playing 
       $("out").innerHTML += " playing"; 
       break; 
      case 2: // paused 
       $("out").innerHTML += " paused"; 
       break; 
      case 0: // ended 
       $("out").innerHTML += " ended"; 
       break;  

      case -1: // unstarted 
      case 3: // buffering 
      case 5: // cued 
       $("out").innerHTML += " state = " + state; 
       break; 
      default: // unknown 
       $("out").innerHTML += " state = " + state; 
       break; 
      } 

      $("out").innerHTML += " duration = " + ytplayer.getDuration() + ","; 
     } 

     function myOnPlayerError(errorCode) { 
      $("out").innerHTML += " Error occurred: " + errorCode; 
     } 

     function onYouTubePlayerReady(playerId) { 
      ytplayer = ytplayer || $(playerId); 
      ytplayer.addEventListener("onStateChange", "myOnPlayerStateChange"); 
      ytplayer.addEventListener("onError", "myOnPlayerError"); 
     } 

     var params = { allowScriptAccess: "always", bgcolor: "#cccccc" }; 
     var atts = { }; 

     swfobject.embedSWF(videoId + "?border=0&amp;enablejsapi=1&amp;playerapiid=" + 'player', 'player', 425, 344, "8", null, null, params, atts); 
    </script> 
    </td></tr> 
    </table> 
    <div id="out"></div> 
    <div id="err"></div> 
</body> 
</html> 
+0

Desafortunadamente todas las respuestas han quedado obsoletas ya que Google V2 con discapacidad de la API de YouTube. – Synetech

Respuesta

17

Solución 1

Puede utilizar la API de datos de YouTube para acceder a la mayor parte de la información sobre el video, incluyendo la duración:

<script type="text/javascript"> 
    function youtubeFeedCallback(json){ 
     document.write(json["data"]["duration"] + " second(s)"); 
    } 
</script> 
<script type="text/javascript" src="http://gdata.youtube.com/feeds/api/videos/4TSJhIZmL0A?v=2&alt=jsonc&callback=youtubeFeedCallback&prettyprint=true"></script> 

Demo here

Al usar jQuery puede usar $.getJSON() para hacer las cosas más fáciles.

Solución 2

parece que YouTube JavaScript API v3 le permite obtener la correcta duración dentro del evento onYouTubePlayerReady(). Todo lo que necesita hacer es pasar &version=3 al llamar al método swfobject.embedSWF().

Demo here

+0

Su demo de la solución 2 no da la duración correcta aquí. La alerta todavía muestra 0. Sin embargo, cuando reproduzco el video en su página de demostración, cierro la pestaña y la vuelvo a abrir, la alerta _doses_ muestra la duración correcta. – ShinNoNoir

+0

@ShinNoNoir: en realidad, no estoy seguro de mí mismo. La documentación no aclara si onYouTubePlayerReady se activa antes o después de que se carguen los metadatos. Puedes intentar agregar un retraso de 2 segundos. –

+1

Al revivir mi comentario anterior, parece que hoy en día la solución 2 funciona. También parece funcionar para la API iframe de YouTube si configura 'version = 3' en' playerVars'. – ShinNoNoir

2

"Cargando, e inmediatamente jugando y pausando el jugador no sería mi método favorito."

No creo que haya otro método.

En mi caso, funciona bien, incluso para un usuario de Internet por satélite.

Aquí está mi código:

// I set youtube player-ready event to a variable for irrelevant reasons 
function onYouTubePlayerReady(playerid) { 
    youtube_player_ready; 
} 
youtube_player_ready = function(playerid) { 

    // load video 
    document.getElementById(playerid).cueVideoById(yt_video_id); 
    // mute video 
    document.getElementById(playerid).mute(); 
    // play video to get meta data 
    document.getElementById(playerid).playVideo(); 

    yt_get_duration[index] = function(){ 
     // if duration is available 
     if (document.getElementById(playerid).getDuration() > 0) { 
      // pause video 
      document.getElementById(playerid).pauseVideo(); 
      // unmute 
      document.getElementById(playerid).unMute(); 
      // save duration 
      video_duration = document.getElementById(playerid).getDuration(); 

     } 
     // else keep trying 
     else { 
      setTimeout(yt_get_duration[index], 150) 
     } 
    } 
    // get duration 
    yt_get_duration[index](); 

} 
0

Usando jQuery

var youTubeURL = 'http://gdata.youtube.com/feeds/api/videos/oHg5SJYRHA0?v=2&alt=json'; 
var json = (function() { 
    $.ajax({ 
     'async': false, 
     'global': false, 
     'url': youTubeURL, 
     'dataType': "jsonp", // necessary for IE9 
     crossDomain: true, 
     'success': function (data) { 
      var duration = data.entry.media$group.yt$duration.seconds; 
     } 
    }); 
})(); 
2

Aquí uno que convierte el tiempo de acabado para ti.

<script type="text/javascript"> 
function youtubeFeedCallback(json){ 

var totalSec = json["data"]["duration"]; 
var hours = parseInt(totalSec/3600) % 24; 
var minutes = parseInt(totalSec/60) % 60; 
var seconds = totalSec % 60; 

var result = (hours < 1 ? "" : hours + ":") + (minutes < 1 ? "0" : minutes) + ":" + (seconds < 10 ? "0" + seconds : seconds); 

document.write(result); 
} 
</script> 
<script type="text/javascript" src="http://gdata.youtube.com/feeds/api/videos/LzPWWpKlvqQ?v=2&alt=jsonc&callback=youtubeFeedCallback&prettyprint=true"></script> 
3

Siguiendo estos pasos: 1. Obtener
youtube video Identificación del
2. Uso de la API de YouTube para obtener la duración (ISO 8601 duración)
3.Convertir ISO 8601 duración en cuando

usando jQuery:

// convert ISO 8601 duration 
function covtime(youtube_time){ 
    array = youtube_time.match(/(\d+)(?=[MHS])/ig)||[]; 
    var formatted = array.map(function(item){ 
     if(item.length<2) return '0'+item; 
     return item; 
    }).join(':'); 
    return formatted; 
} 

// print video duration 
$('iframe').each(function(i) { 
    var ifr = $(this); 
    var regExp = /^.*(youtu\.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/; 
    var match = ifr.attr('src').match(regExp); // get youtube video id 
    if (match && match[2].length == 11) { 
     var youtubeUrl = "https://www.googleapis.com/youtube/v3/videos?id=" + match[2] 
     + "&key=AIzaSyDYwPzLevXauI-kTSVXTLroLyHEONuF9Rw&part=snippet,contentDetails"; 
     $.ajax({ 
      async: false, 
      type: 'GET', 
      url: youtubeUrl, 
      success: function(data) { 
       var youtube_time = data.items[0].contentDetails.duration; 
       var duration = covtime(youtube_time); 
       if(ifr.next().is('.time')) { 
       ifr.next().html(duration); 
       } 
      } 
     }); 
    } 
}); 
+0

Muchas gracias :) –

Cuestiones relacionadas