Javascript 如何在YouTube Api上实现分页？

我正在尝试显示用户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;
                    }

                }





        );




    }

var channelName='********'；
var nextPageToken=“”；
var prevPageToken=“”；
var pid=“**********”；
var计数器；
begin（）；
函数begin（）{
美元(
"https://www.googleapis.com/youtube/v3/channels",{
第部分：“内容详细信息”，
forUsername:channelName，
键：'******************'}，
功能（数据）{
$.each（data.items，function（i，item）{
pid=item.contentDetails.relatedPlaylists.uploads；
getVids（pid）；
})
}       
);
}
函数getVids（pid）{
美元(
"https://www.googleapis.com/youtube/v3/playlistItems",{
部分：'代码片段'，
最大结果：50，
playlid:pid，
键：'***************'}，
功能（数据）{
计数器=data.pageInfo.totalResults；
var输出；
nextPageToken=data.nextPageToken；
prevPageToken=data.prevPageToken；
$.each（data.items，function（i，item）{
总计=data.pageInfo.totalResults；
videoId=item.snippet.resourceId.videoId；
videoTitle=item.snippet.title；
videoImg=item.snippet.thumbnails.maxres.url；
输出=`
${videoTitle}
`;
//附加到结果列表
$（“#结果”）。追加（输出）；
})
saveNext（nextpgetoken）；
对于（i=0；i

在这里，我尝试存储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);

                    })



                }                


        );


    }

函数saveNext（f）{
nextPageToken=f；
返回下一个getoken；
}
功能下一页（pid，下一页）{
美元(
"https://www.googleapis.com/youtube/v3/playlistItems",{
部分：'代码片段'，
最大结果：50，
playlid:pid，
pageToken:nextPageToken，
关键词：“AIzaSyCLj1raUEFRewglexWcIz5Z_roLYCAkpFw”}，
功能（数据）{
var输出；
nextPageToken=data.nextPageToken；
saveNext（nextpgetoken）；
prevPageToken=data.prevPageToken；
$.each（data.items，function（i，item）{
总计=data.pageInfo.totalResults；
videoId=item.snippet.resourceId.videoId；
videoTitle=item.snippet.title；
videoImg=item.snippet.thumbnails.maxres.url；
输出=`
${videoTitle}
`;
$（“#结果”）。追加（输出）；
})
}                
);
}

到目前为止，我只能将一个nextPageToken值传递给我的请求，并且似乎无法将下一个标记存储在包含近600个视频的播放列表中