我正在尝试显示用户YouTube频道的所有视频，为此，我尝试使用YouTube API进行分页。但是，我无法将页面令牌存储到每个请求中。
var channelName = '*******';
var nextPageToken = "";
var prevPageToken = "";
var pid = "**********";
var counter;
begin();
function begin(){
$.get(
"https://www.googleapis.com/youtube/v3/channels",{
part: 'contentDetails',
forUsername: channelName,
key: '*********************'},
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: 50,
playlistId: pid,
key: '******************'},
function(data){
counter = data.pageInfo.totalResults;
var output;
nextPageToken = data.nextPageToken;
prevPageToken = data.prevPageToken;
$.each(data.items, function(i, item){
total = data.pageInfo.totalResults;
videoId = item.snippet.resourceId.videoId;
videoTitle = item.snippet.title;
videoImg = item.snippet.thumbnails.maxres.url;
output = `<div class="col-md-4" style="padding-bottom:1em;">
<div class="card" style="width: auto; border:none; border-radius:0%; background-image:url('${videoImg}');background-size: 100% 100%; background-repeat: no-repeat;">
<div class="card-body card-mod">
<p class="card-text" id="nombre-mod" style="text-align:left; font-weight:bold !important; color:#f2f2f2!important; font-size:20px; text-shadow: 2px 2px 5px #141313;">${videoTitle}</p>
</div>
<a href=https://www.youtube.com/watch?v=${videoId} class="stretched-link"></a>
</div>
</div>`;
//Append to results list
$('#results').append(output);
})
saveNext(nextPageToken);
for (i = 0; i < counter ; i++){
nextPage(pid,nextPageToken);
counter = counter - 50;
}
}
);
}
在这里，我尝试存储nextPageToken值以将其传递给新请求。
function saveNext(f){
nextPageToken = f;
return nextPageToken;
}
function nextPage(pid, nextPageToken){
$.get(
"https://www.googleapis.com/youtube/v3/playlistItems",{
part: 'snippet',
maxResults: 50,
playlistId: pid,
pageToken : nextPageToken,
key: 'AIzaSyCLj1raUEFRewglexWcIz5Z_roLYCAkpFw'},
function(data){
var output;
nextPageToken = data.nextPageToken;
saveNext(nextPageToken);
prevPageToken = data.prevPageToken;
$.each(data.items, function(i, item){
total = data.pageInfo.totalResults;
videoId = item.snippet.resourceId.videoId;
videoTitle = item.snippet.title;
videoImg = item.snippet.thumbnails.maxres.url;
output = `<div class="col-md-4" style="padding-bottom:1em;">
<div class="card" style="width: auto; border:none; border-radius:0%; background-image:url('${videoImg}');background-size: 100% 100%; background-repeat: no-repeat;">
<div class="card-body card-mod">
<p class="card-text" id="nombre-mod" style="text-align:left; font-weight:bold !important; color:#f2f2f2!important; font-size:20px; text-shadow: 2px 2px 5px #141313;">${videoTitle}</p>
</div>
<a href=https://www.youtube.com/watch?v=${videoId} class="stretched-link"></a>
</div>
</div>`;
$('#results').append(output);
})
}
);
}
到目前为止，我只能将一个nextPageToken值传递给我的请求，并且似乎无法将下一个令牌存储在包含近600个视频的播放列表中。