Question

这是我正在尝试做的事情：

使用YouTube数据API（v3）从播放列表中检索视频，并为每个播放列表项目添加视频播放器。

我发现了这篇文章，它描述了我想要做的事情：Is there a way to generate separate YouTube embeds for each video in a YouTube Playlist?

我在答案中检查了两个链接，这是有道理的，但我想知道社区中是否有人有关于如何使用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}

喜欢或上传

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

2 个答案: