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

ego6inou  于 2021-09-23  发布在  Java
关注(0)|答案(1)|浏览(384)

我正试着得到那份工作 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"
bpsygsoo

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 作用 asyncawait 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(...)

相关问题