Spotify API 错误。 401 权限缺失。尝试播放曲目时答案

【问题标题】：Spotify API Error. 401 Permissions missing. When Attempting to Play TrackSpotify API 错误。 401 权限缺失。尝试播放曲目时
【发布时间】：2022-04-11 11:35:59
【问题描述】：

我正在尝试使用 spotify-web-api-node 在我的应用上播放曲目

  const playSong = async () => {
    // Verify access token with
    console.log(spotifyApi.getAccessToken())

    setCurrentTrackId(track.track.id);
    setIsPlaying(true);
    spotifyApi
      .play({
        uris: [track.track.uri],
      })
      .then((d) => console.log("hi", d))
      .catch((e) => console.log("err", e));
  };

https://github.com/caseysiebel/spotify-clone/blob/main/components/Song.tsx#L19

当我向spotifyApi.play() 发起此调用时，我收到此错误WebapiRegularError: An error occurred while communicating with Spotify's Web API. Details: Permissions missing.，错误代码为401。

我在我的应用程序中设置了 accessToken 和 refreshToken。我能够登录并从 API 获取数据，例如用户、播放列表和曲目数据。但是当我尝试播放曲目时，它说我没有权限。

我认为这可能与我在 Spotify API 中设置 scopes 的方式有关，但它们对我来说是正确的。

const scopes = [
  "user-read-email",
  "playlist-read-private",
  "playlist-read-collaborative",
  "user-read-email",
  "streaming",
  "user-read-private",
  "user-library-read",
  "user-top-read",
  // "user-library-modify"
  "user-read-playback-state",
  "user-modify-playback-state",
  "user-read-currently-playing",
  "user-read-recently-played",
  "user-read-playback-state",
  "user-follow-read",
].join(",");

https://github.com/caseysiebel/spotify-clone/blob/main/lib/spotify.ts#L5

这似乎与传递给授权LOGIN_URL 的scopes 有关，但streaming 范围肯定存在，我看不出是什么问题。看起来是这样的，因为某些 API 请求有效，而其他人说他们没有权限。

是否有人看到缺少权限问题和 Spotify API 可能导致此问题的原因？

【问题讨论】：

community.spotify.com/t5/Spotify-for-Developers/…

标签： javascript reactjs api next.js spotify

【解决方案1】：

lib/spotify.ts 第 23 行必须是 scope: scopes, 而不是 scopes: scopes,。

实际上在这里使用类型检查可能会有所帮助。

https://github.com/currenthandle/spotify-clone/commit/736108de1a1a132c43810d8415584f3be198609a#diff-b030a1ce426906990f8ed48fd8be76f54558b94141f4c811e679fef6661d396dR23

【讨论】：

【解决方案2】：

我认为问题出在您的 spotify.js 文件上。在 clientId 中，您确定名称 NEXT_PUBLICCLIENT_ID 是正确的吗？不应该是 NEXT_PUBLIC_CLIENT_ID。

    const spotifyApi = new SpotifyWebApi({
      clientId: process.env.NEXT_PUBLICCLIENT_ID,
      clientSecret: process.env.NEXT_PUBLIC_CLIENT_SECERT,
    });

试着告诉我这是否可行？

【讨论】：