使用axios使用客户端凭据获取KeyClope access_令牌在nextjs应用程序中抛出400错误

ego6inou 于 2021-09-23 发布在 Java

关注(0)|答案(1)|浏览(307)

我正试着得到那份工作 access_token 使用axios和客户端凭据从KeyClope下载。但是，当我使用axios post请求获取access_令牌时，出现了400错误。
我没有使用postman测试我的客户端凭据，它确实返回了access__令牌。但是，在nextjs应用程序中使用时，我收到一个400错误：
目前在我的 _app.tsx 文件i有以下方法：

const getToken = () => {
  let token: string = undefined;
  const realm = process.env.NEXT_PUBLIC_KEYCLOAK_REALM;
  const keycloakClientSecret = process.env.NEXT_PUBLIC_KEYCLOAK_BEARER_CLIENT_SECRET;
  const kcTokenEndpoint = `http://localhost:8080/auth/realms/${realm}/protocol/openid-connect/token`;

  axios({
    method: 'POST',
    url: kcTokenEndpoint,
    data: {
      client_id: 'keycloak-token-bearer', // create client in keycloak with same name
      client_secret: keycloakClientSecret,
      grant_type: 'client_credentials',
    },
    headers: {
      'Content-type': 'application/x-www-form-urlencoded',
    },
    withCredentials: true,
  })
    .then(response => {
      token = (response as any)?.access_token;
    })
    .catch(error => {
      token = undefined;
    });

  return token;
};

我看到它返回一个 400 (Bad Request) error 当我检查响应时，我看到以下内容：

error   "invalid_request"
error_description   "Missing form parameter: grant_type"

JavaScript axios Keycloak next.js

来源：https://stackoverflow.com/questions/68320269/get-keycloak-access-token-using-client-credentials-using-axios-throws-400-error

1条答案

按热度按时间

bpsygsoo1#

axios.post 是一个异步操作。现在你总是回来 undefined 从你的功能，因为你没有等待 axios 请求解决。
若您有异步函数，那个么您只能从它返回一个承诺。
因此，您需要这样做：

// Add return here
  return axios({
    method: 'POST',
    url: kcTokenEndpoint,
    data: {
      client_id: 'keycloak-token-bearer', // create client in keycloak with same name
      client_secret: keycloakClientSecret,
      grant_type: 'client_credentials',
    },
    headers: {
      'Content-type': 'application/x-www-form-urlencoded',
    },
    withCredentials: true,
  })
    .then(response => {
      // Return token here
      return (response as any)?.access_token;
    })

或制造 getToken 作用 async 及 await axios请求：

const getToken = async () => {
  const realm = process.env.NEXT_PUBLIC_KEYCLOAK_REALM;
  const keycloakClientSecret = process.env.NEXT_PUBLIC_KEYCLOAK_BEARER_CLIENT_SECRET;
  const kcTokenEndpoint = `http://localhost:8080/auth/realms/${realm}/protocol/openid-connect/token`;

  cosnt { response } = await axios({
    method: 'POST',
    url: kcTokenEndpoint,
    data: {
      client_id: 'keycloak-token-bearer', // create client in keycloak with same name
      client_secret: keycloakClientSecret,
      grant_type: 'client_credentials',
    },
    headers: {
      'Content-type': 'application/x-www-form-urlencoded',
    },
    withCredentials: true,
  })

  return response.access_token;
};

显然现在你需要
await getToken 功能或用途 then(...) 也

赞(0）回复(0）举报 2021-09-23

我来回答

使用axios使用客户端凭据获取KeyClope access_令牌在nextjs应用程序中抛出400错误

1条答案

相关问题

热门标签

最新问答