/ra-keycloak

Primary LanguageTypeScriptMIT LicenseMIT

ra-keycloak

An auth provider for react-admin which handles authentication via a Keycloak server.

DocumentationSource Code

This repository contains:

  • The actual ra-keycloak package
  • A simple demo app you can run locally to try out ra-keycloak

Simple Demo

Prerequesites

This demo requires Docker and docker-compose in order to start a local Keycloak server.

Initial setup

  1. Clone this project
  2. Run make install run to install the dependencies, start the local Keycloak Server and start the Demo App

We need to add some minimal configuration to our Keycloak server in order to use it. This need to be done from the Keycloak Admin Console.

  1. Browse to http://localhost:8080/ (note: keycloak takes some time to start...)
  2. Go to Administration Console
  3. Login with the default credentials (admin / password)
  4. Create a new Realm named for instance Marmelab
  5. Create a new Realm Role named admin
  6. Create a new Realm Role named user
  7. Create a new User named admin@marmelab.com
  8. For admin@marmelab.com, under Credentials, set a new password (disable the temporary password tick)
  9. For admin@marmelab.com, under Role mapping, click Assign role and choose admin
  10. Create a new User named user@marmelab.com
  11. For user@marmelab.com, under Credentials, set a new password (disable the temporary password tick)
  12. For user@marmelab.com, under Role mapping, click Assign role and choose user
  13. Create a new Client and choose as Client ID front-marmelab. Leave all the other options to default.
  14. For Client front-marmelab, under Settings, edit the Access settings to the following:
  1. Click Save. Your keycloak instance is fully configured.

Using the Simple Demo

Now that all is configured and running, you can browse to http://localhost:8081/ to access the React Admin App.

  • Signing in with user@marmelab.com will only grant the user role permissions
  • Signing in with admin@marmelab.com will grant full admin role permissions, allowing for instance to see the 'Users' resource in the main menu

Feel free to play around with this demo, along with the Keycloak config, to understand better how it works!

License

This repository and the code it contains is licensed under the MIT License and sponsored by marmelab.