无法获取YouTube视频的自定义播放列表

第一个视频播放，但不是我列表中的下一个视频。我已经复制了YouTube API example的初始代码。也使用this SO answer的onPlayerStateChange（event）的想法。无法获取YouTube视频的自定义播放列表

第一个视频播放正常。使用Firebug，我也可以看到它进入playnextvideo（）函数。但是，下一个视频不播放。我也尝试在该函数的最后一行添加

player.playVideo()

，但我得到一个错误说“player.playVideo（）不是一个函数”。以下是我的整个<body>部分。此页面中没有其他脚本。

<div id="container"> 
<div id="content"> 
    <div class="fixedwidthlower"> 
    <?php 
     require 'dbconn.inc'; //database connection code 
     echo "<div id=\"SongList\"><ul id = \"songs\">"; 
     $list = explode(" ", $_POST['playlist']); 
     $hlist = array(); 
     for($i=0; $i<count($list); $i++){ 
      $sql = "SELECT * FROM songs where aikey = " . $list[$i] . ";"; 
      $result = $conn->query($sql); 
      $row = $result->fetch_assoc(); 
      if ($i==0) 
       $liclass = " class=\"active\""; 
      else 
       $liclass = ""; 
      echo "<li" . $liclass . "><a href=\"" . $row["URL"] . "\">" . $row["Song"] . " (" . substr($row["URL"], stripos($row["URL"], "=") + 1) . ")</a></li>"; 
      $hlist[] = substr($row["URL"], stripos($row["URL"], "=") + 1); 
     } 
     echo "</ul></div>"; 
     echo "<div id=\"Player\">"; 
     for($i=0; $i<count($hlist); $i++){ 
      echo $hlist[$i] . " "; 
     } // This loop puts the raw videoids into the Player Div 
      // which are then read by the first line in javascript below 
      // Example: "usNsCeOV4GM 8pPvNqOb6RA cwqhdRs4jyA XcATvu5f9vE WANNqr-vcx0 t-iJ47in9YQ OMOGaugKpzs l3LFML_pxlY mLDDxfFKd9Y 9Z4rmlyuH-s " 
     echo "</div>"; 
     $conn->close(); 
    ?> 
</div> 
</div> 
<script type="text/javascript"> 
     var videolist = document.getElementById("Player").innerHTML.split(" "); 
     var i =0; 
     var video = videolist[i]; 
     function playnextvideo(){ 
      i++; 
      video = videolist[i]; 
      playmyvideo(); 
      player.playVideo(); 
     } 
     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() { 
      playmyvideo(); 
     } 
     function playmyvideo() { 
       player = new YT.Player('Player', { 
       height: '390', 
       width: '640', 
       videoId: video, 
        events: { 
        'onReady': onPlayerReady, 
        'onStateChange': onPlayerStateChange 
       } 
      }); 
     } 
     function onPlayerReady(event) { 
      event.target.playVideo(); 
     } 
     function onPlayerStateChange(event) { 
      if (event.data === 0) { 
       playnextvideo(); 
      } 
     } 
     console.log(i); 
     console.log(video); 
    </script>

该php代码可能不相关，但我已经表明它的完整性。我没有包括CSS，因为它可能不相关（没有显示：没有 divs，因为我看到在其他问题中导致问题）。如果你想要一个链接到这个页面，我可以提供这个...

谢谢你的帮助！

来源

2015-12-21 Chiwda

您需要修改您的实现并使用loadPlaylist or cuePlaylist函数，因为它可以完美地解决您的问题，而无需执行太复杂的代码。

使用loadPlaylist可以加载指定的playList并播放它。在下面的示例中，我指定了要在onPlayerReady事件中播放的视频ID列表。

（你可以尝试在jsFiddle运行下面的代码）

<div id="player"></div> 
<script> 
    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 onYouTubePlayerAPIReady() { 
    player = new YT.Player('player', { 
     height: '390', 
     width: '640', 
     events: { 
     'onReady': onPlayerReady, 
     'onStateChange': onPlayerStateChange 
     } 
    }); 
    } 

    function onPlayerReady(event) { 
    event.target.loadPlaylist(['RB-RcX5DS5A','QtXby3twMmI']); 
    } 
    var done = false; 
    function onPlayerStateChange(event) { 
    if (event.data == YT.PlayerState.PLAYING && !done) { 
     done = true; 
    } 
    } 
function stopVideo() { 
    player.stopVideo(); 
} 
</script>

来源

2015-12-22 11:33:41 goblin

我会尝试这一点，但是这不利于大局。我希望能够播放来自其他网站的视频。因此，我将切换到另一个使用不同的API实例化不同玩家的函数。 Vimeo当Vimeo视频出现时。 – Chiwda

Thanx！它的工作，所以我已经接受你的答案。但是，我现在意识到我的架构是错误的。我必须将循环放在YouTube API（和其他API）之外。咄！ – Chiwda

无法获取YouTube视频的自定义播放列表

回答

相关问题