javascript youtube api 请求缓存

javascript youtube api request cache

我有一个奇怪的问题。

我使用 OAuth2 和 gapi.auth.authorize({client_id:'...',scope:'../youtube',immediate:false}) 让用户登录我的应用程序。此方法让用户选择要使用的连接帐户(身份)。

我使用 gapi.client.youtube.channels.list 和 gapi.client.youtube.playlistItems.list 检索用户的视频。

稍后在同一个应用程序中,用户可以单击一个按钮来选择他的另一个关联帐户(身份)。我再次使用 gapi.auth.authorize({client_id:'...',scope:'../youtube',immediate:false}) 方法。

问题是在成功更改帐户后,gapi.client.youtube.channels.list 方法 return 缓存了第一次调用的结果。

一些评论: - 在 ie 11 中它工作正常 - 在 google chrome 中,如果我从开发人员工具中禁用缓存,它也可以正常工作 - 在调用 channels.list 之前,我调用了 /oauth2/v2/tokeninfo 和 /plus/v1/people/me 并且它们都 return 正确的结果,即第二个帐户的数据

有什么办法可以纠正这个问题吗? 谢谢。

有人可以通过使用 XMLHttpRequest(参见 https://developers.google.com/api-client-library/javascript/features/cors)来解决这个问题。这可能是 javascript YouTube api.

的错误

对我有用的是在欺骗 Google 系统的请求中引入一个愚蠢的额外参数......或者至少这是我的印象,因为它似乎一直有效:

我只是将它添加到 URL:

"https://www.googleapis.com/youtube/v3/channels?mine=true" +
  "&part=" + encodeURIComponent("id,snippet") +
  "&key=" + encodeURIComponent(API_KEY) +
  "&random=" + encodeURIComponent(Math.random().toString())

完整示例如下:

  refreshChannels(): Promise<YoutubeChannel[]> {
    return new Promise((resolve, reject) => {
      const xhr = new XMLHttpRequest();
      xhr.onreadystatechange = () => {
        if (xhr.readyState === 4) {
          if (xhr.status === 200) {
            this.channels = JSON.parse(xhr.response).items.map(ch => new YoutubeChannel().deserialize(ch));
            console.log("[Youtube][loadChannels] Got some channels:");
            console.log(this.channels);
            this.onReceivedYoutubeChannels.next(this.channels);
            resolve(this.channels);
          } else {
            reject(JSON.parse(xhr.response));
          }
        }
      };

      xhr.onerror = () => reject();

      const user = gapi.auth2.getAuthInstance().currentUser.get();
      const oAuthToken = user.getAuthResponse().access_token;
      xhr.open(
        "GET",
        "https://www.googleapis.com/youtube/v3/channels?mine=true&part=" +
          encodeURIComponent("id,snippet") +
          "&key=" +
          encodeURIComponent(API_KEY) +
          "&random=" + encodeURIComponent(Math.random().toString())
      );
      xhr.setRequestHeader("Authorization", "Bearer " + oAuthToken);
      xhr.send();
    });
  }

我得到了不同的 ETag。我还看到了一个 Cache-Control 响应 header 可能也在缓存?

cache-control: private, max-age=300, must-revalidate, no-transform

通过我的解决方案,我可以克服它。如果有人理解为什么可以详细说明此解决方案,那就太好了。