Javascript 中的异步 YouTube API 调用

Question

我想使用 YouTube API 获取我所有的 YouTube 订阅。但是，Google 将 API 调用中返回的项目数量限制为 50。如果我订阅了 100 多个频道，我将不得不循环调用 API得到所有这些。现在我只想在 "Inspect popup" 调试控制台中 console.log() 它们。

我阅读了很多关于如何在 Javascript 中的循环中进行异步调用的阅读资料，但所有这些都是使用基本的 for() 循环。在使用 YouTube 数据 API 的情况下，您必须进行 API 调用，然后使用 nextPageToken 属性获取下一页。

这是我目前的 popup.js 文件：

$(document).ready(function() {
    var ClientID = '[my client id]';

    $('#testBtn').click(function() {
        chrome.identity.getAuthToken({"interactive": true}, function(token) {

            GetInfo(token, "");

        });
    });

    function GetInfo(userToken, pageToken) {

        $.ajax({
            url: "https://www.googleapis.com/youtube/v3/subscriptions", 
            type: 'GET',
            data: {
                part: "snippet",
                mine: "true",
                nextPageToken: pageToken,
                access_token: userToken
            },
            success: function(data) {
                var allIds = "";
                $.each(data.items, function(i, item) {
                    console.log(item.snippet.resourceId.channelId);
                });

                var nextPageToken = data.nextPageToken;
                if (typeof nextPageToken !== 'undefined')
                {
                    GetInfo(userToken, nextPageToken);
                }


            },
            error: function(xhr, status, error) {
                console.log(xhr.responseText);
            }
        });
    }
});

我知道通常您不应该在 popup.js 中进行 API 调用，但我只是想让它正常工作，然后我会将其移至后台脚本。

这段代码在第一次执行时效果很好；成功函数执行并记录频道 ID。所以我知道这不是身份验证的问题。但是，当在 success 回调中再次调用 GetInfo() 函数时， data 参数保持不变。所以我的脚本只是无限期地在第一个回调中记录数据。

我想说这是 Javascript 中闭包的问题，但我不知道 ajax 调用中的语法是什么样的。

如果有人能提供帮助，那就太好了！

Answer 1

根据 the documentation，API 的参数名称是 pageToken，而不是 nextPageToken。您的 nextPageToken 参数可能被 API 忽略，因此您一遍又一遍地获得第一页。所以你应该：

        data: {
            part: "snippet",
            mine: "true",
            pageToken: pageToken,
            access_token: userToken
        },

Javascript 中的异步 YouTube API 调用

Asynchronous YouTube API Calls in Javascript

javascript

ajax

youtube-api

google-chrome-extension