YouTube数据API-带视频播放器的播放列表项目[代码示例]

Question

这是我要做的：

使用YouTube数据API（V3）从播放列表中检索视频，还包括每个播放列表项目的视频播放器。

我找到了这篇文章，它准确地描述了我想做的：有没有一种方法可以在YouTube播放列表中为每个视频生成单独的YouTube嵌入？

我检查了答案中的两个链接，这很有意义，但是我想知道社区中的任何人是否都有有关如何使用JavaScript完全将其绑定的代码示例。

这是我到目前为止所拥有的：

$(document).ready(function() {
    var videosURL = "https://www.googleapis.com/youtube/v3/playlistItems?playlistId={myPlaylistID}&key={myAPIKey}&fields=items&part=snippet&callback=?";    
    $.getJSON(videosURL, function(data) {
        $("#results").append('<p>' + data.items[0].snippet.title + '</p>');
        $("#results").append('<p>' + data.items[0].snippet.description + '</p>');
    });
});

，但无法弄清楚如何为每个视频包含视频播放器。

事先感谢您的任何帮助！

Answer 1

解决方法可能是打印以下内容：

$("#results").append(
    '<iframe width="100%" height="360" src="//www.youtube.com/embed/'
    + data.items[0].snippet.resourceId.videoId
    + '" frameborder="0" allowfullscreen></iframe>'
);

希望它会有所帮助。

Answer 2

显示视频列表

$(document).ready(function() {
   var videosURL = "https://www.googleapis.com/youtube/v3/playlistItems?playlistId={myPlaylistID}&key={myAPIKey}&fields=items&part=snippet&maxResults=6&callback=?";
$.getJSON(videosURL, function(data) {
$.each(data.items, function(i,val) {
$("#results").append('<iframe width="100%" height="360" src="//www.youtube.com/embed/'
+ val.snippet.resourceId.videoId
+ '" frameborder="0" allowfullscreen></iframe>');       
   });
  });
});
<div id="results"></div>

如何获得您的playlistid？

https://www.googleapis.com/youtube/v3/channels?part=contentDetails&forUsername={myChannelName}&key={myAPIKey}

喜欢或上传