如何使用API​​ v3检索单个YouTube播放列表并显示其所有前10个视频节目?

时间:2017-02-16 08:33:05

标签: javascript jquery html5 youtube-data-api

如何检索单个YouTube播放列表并使用API​​ v3显示所有标题?

我已经获得的是视频标题,但没有播放列表。 如果有一个我缺席的话,任何人都会分享一些查询。 我的要求是单个YouTube播放列表视频标题。

现在我收到所有频道视频节目。缺少什么?

var channelname = 'mipaltan';

$(document).ready(function () {
    $.get("https://www.googleapis.com/youtube/v3/channels", {
        part: 'contentDetails',
        forUsername: 'mipaltan',
        key: 'AIzaSyCT8kXaxJ2l29vYg4HBdYy36H-PhAH-Teg'
    },
      function (data) {
          $.each(data.items, function (i, item) {
              pid = item.contentDetails.relatedPlaylists.uploads;
              getVids(pid);
          })
      }
    );

    function getVids(pid) {
        $.get("https://www.googleapis.com/youtube/v3/playlistItems", {
            part: 'snippet',
            maxResults: 10,
            playlistId: pid,
            key: 'AIzaSyCT8kXaxJ2l29vYg4HBdYy36H-PhAH-Teg'
        },

          function (data) {
              $.each(data.items, function (i, item) {
                  vidsTitle = item.snippet.title;
                  output = '<li>' + vidsTitle + '</li>';
                  // Append to results 
                  $('#results').append(output);
              })
          }
        );
    }
});
   <title> Get Video Title</title>
<style>
body {
      background: #f4f4f4;
      font-family: Arial, sans-serif;
      font-size: 14px;
      color: #666;
    }
    #container {
      width: 100%;
      height: auto;
      overflow: auto;
      margin: auto;
      padding: 5px;
    }
     #container2 {
      width: 100%;
      height: auto;
      overflow: auto;
      margin: auto;
      padding: 15px;
    }
</style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
       <script src="js/script.js"></script>
    <script>
       function newSrc(testurl) {
           document.getElementById("MyFrame").src = testurl;
       }
   </script>
    </head>   
    <body>
        <form id="form1" runat="server">
            <div id="container2"></div>
  <iframe id="MyFrame"; width="220"; height="160"; src="http://www.youtube.com/embed?listType=playlist&list=PLVB7Pe64pVdd0RwAOTy7K4pm7TMAK1fQq"   frameborder="0" allowfullscreen ></iframe>
             <div style="padding-left:5px", id="result" class ="footer-widget"> </div>
    <div id="container">
       <ul id="results"></ul>
    </div>
  </form>
   </body>
</html>

1 个答案:

答案 0 :(得分:0)

我的代码中没有发现任何问题。

要查看播放列表,您需要点击播放列表按钮,这会打开播放列表缩略图。

Please see the attachment