Spotify 请求授权错误 API

Question

我的 React 应用程序发生了最奇怪的事情。我已将 Client Id 和 Client Secret 移动到环境变量中，并使用 dotenv 将它们加载到此文件中以创建 authorization request:

// Inject environment variables
import dotenv from 'dotenv';
dotenv.config();

const clientID = process.env.CLIENT_ID;
const clientSecret = process.env.CLIENT_SECRET;

// Request authorization
const authOptions = {
  url: "https://accounts.spotify.com/api/token",
  headers: {
    "Authorization":
      "Basic " +
      new Buffer.from(clientID + ":" + clientSecret).toString("base64"),
    "Content-Type": "application/x-www-form-urlencoded",
  },
  form: {
    grant_type: "client_credentials",
  },
  json: true,
};

export default authOptions;

但我遇到 Failed to load resource: the server responded with a status of 400 () 错误：

{ error: "invalid_client", error_description: "Invalid client" }

奇怪的是，如果对客户端 ID 和密码进行硬编码，它会完美运行。

我什至在控制台中打印了环境变量并获得了正确的值，但是当我在授权中使用它们时 header 它停止工作。

有什么办法可以解决这个问题吗？

Answer 1

我遇到过一次这个错误。我重置了我的 client_secret，在 .env 文件中添加了新值，但忘记终止我的应用程序并再次运行它。在我重新运行我的应用程序后，它工作了。

Answer 2

据我所知，您所做的是在 React 中使用浏览器中不可用的环境变量。

Just a side note, maybe you shouldn't load secrets in the browser as that isn't a secure environment. Rather use the OAuth strategy for using your client id. Here's a link

将环境变量加载到您的应用程序。您需要在它前面加上 REACT_APP_。 Here's a link

这是一个例子

.env

REACT_APP_CLIENT_ID=my-spotify-client-id

Spotify 请求授权错误 API

Request authorization error in Spotify API

javascript

environment-variables

spotify

reactjs

redux