I need some help with keycloak

@bashir bro can you show me how you did, im still having an issue

@AlmondMilk4242 Sure, why not, I will send you the code here, today.

@AlmondMilk4242 https://github.com/ugiispoyo/react-keycloak-id/tree/master/examples/with-check-sso

1 Like

@bashir love you man, ill check it out

1 Like

@bashir not sure where is my issue

@bashir got it nice one,i removed the pkce config from keycloak, can you please attach a buy me a coffee in your github for me to make some contribution.

Btw is it possible for you to demonstrate a simple api connection to a backend, either by using http-proxy-middleware or some sort so i can see how the token is being utilized for our future request, since we are not utilizing the defauly adpater that has getToken()

import { useReactKeycloackId } from ‘react-keycloak-id’;


const { token } = useReactKeycloackId();

all you need is inside the hooks. like authenticated and so on.

1 Like

Can you please have a look at this

import React, {useState} from 'react';
import { retrieveApi } from '../service/api/Api';
import { useReactKeycloackId } from 'react-keycloak-id';

const ApiPage = () => {
    const [message, setMessage] = useState('');
    const { token } = useReactKeycloackId();
    function callApi() {
          .then((response) => successfulResponse(response))
          .catch((error) => errorResponse(error))
          .finally(() => console.log("cleanup"));
      function successfulResponse(response) {
      function errorResponse(error) {
    return (
      <div style={{ display: 'block', width: '300px', margin: '100px auto' }}>
        <button className="btn btn-success m-5" onClick={callApi}>
          Call Simple Api
        <div className="text-info">
  export default ApiPage;

what your node version ?

if 16, update it to 18(i.e recommended version)

then everything will work fine.

and if you’re using axios, why can’t you create useAxios custom hooks ?

I think that will be better. and use asycn await instead.

1 Like