React Keycloak Auth
React Keycloak Auth is a simple library for authentication with SSO Keycloak Client.
Installation
Use the package manager npm or yarn to install React Keycloak Auth.
yarn add @netkata/react-keycloak-authConfiguration
import Authentication from '@netkata/react-keycloak-auth';
Authentication.config.tokenURL = 'http://localhost:8040/auth/realms/master/protocol/openid-connect/token';
Authentication.config.revokeURL = 'http://localhost:8040/auth/realms/master/protocol/openid-connect/logout';
Authentication.config.refreshURL = 'http://localhost:8040/auth/realms/master/protocol/openid-connect/token';
Authentication.config.userInfoURL = 'http://localhost:8040/auth/realms/master/protocol/openid-connect/userinfo';
Authentication.config.grantType = 'password';
Authentication.config.clientID = 'account';
Authentication.config.refreshTokenInSecondsBeforeExpireDate = 15;
Authentication.config.authorizationURL = '/login';
Authentication.config.protectedAreaURL = '/dashboard';
Authentication.config.ignoredURLs = ['/privacy-policy'];Authorize
import { Authentication } from '@netkata/react-keycloak-auth';
Authentication.authorize('email@netkata.com', 'strongPassword');Unauthorize
import { Authentication } from '@netkata/react-keycloak-auth';
Authentication.revoke();Events
import {
Authentication,
EVENT_AUTHORIZATION_SUCCESS,
EVENT_AUTHORIZATION_FAILED,
EVENT_REFRESH_TOKEN_SUCCESS,
EVENT_REFRESH_TOKEN_FAILED,
EVENT_CHECK_USER_SUCCESS,
EVENT_CHECK_USER_FAILED,
EVENT_REVOKE_TOKEN_SUCCESS,
EVENT_REVOKE_TOKEN_FAILED,
} from '@netkata/react-keycloak-auth';
Authentication.events.addEventListener(EVENT_AUTHORIZATION_SUCCESS, (response) => {
//your callback
});
Authentication.events.addEventListener(EVENT_REVOKE_TOKEN_SUCCESS, (error) => {
//your callback
});React AuthProvider
If you are using react-router in your project, AuthProvider is useful to manage user session and protect your private route behind authorization. AuthProvider has implemented listeners which take action on authorize and unauthorize event.
Usage
import { AuthProvider } from '@netkata/react-keycloak-auth';
import { BrowserRouter } from 'react-router-dom';
const App = () => {
return (
<BrowserRouter>
<AuthProvider>
your application routing
</AuthProvider>
</BrowserRouter>
)
};