A simple example of accessing protected with Keycloak resource in a context of single page react application.
Note This software is meant for demonstration purposes only. Please refer to official documentation to use Keycloak in production environment.
These instructions will get you a copy of the project up and running on your local machine.
The tools you need to run the example:
- docker to run keycloak server
- node.js to run resource server / spa client (required node version is specified in a corresponding
.nvmrc
file) - yarn package manager
Keycloak server is set up as a docker container.
To start up Keycloak server navigate to a corresponding folder and run docker-compose:
cd ./keycloak-server
docker-compose up
To make sure Keycloak server is up and running navigate to admin console http://localhost:8080/auth/admin
.
Keycloak admin credentials are:
username: admin
password: admin
On startup the container imports test-realm
configuration which is used for the demo.
User credentials you will need to go through the example are:
username: test-user
password: 1234
Resource server is set up as a node.js application.
To start up Resource server navigate to a corresponding folder, install dependencies and run the server:
cd ./resource-server
yarn
yarn start
When you open http://localhost:5001
in your browser you will see Access denied
response since resource is protected.
To start up SPA client navigate to a corresponding folder, install dependencies and run the server:
cd ./react-client
yarn
yarn start
Navigate to http://localhost:3000
in your browser to go through example.
You will need test-user
credentials specified above.
You may want to play around with Keycloak configuration. If you would ever need to persist test-realm
settings please export it and save as data/test-realm.json
file with the following commands:
docker exec -it keycloak-server /opt/jboss/keycloak/bin/standalone.sh \
-Djboss.socket.binding.port-offset=100 -Dkeycloak.migration.action=export \
-Dkeycloak.migration.provider=singleFile \
-Dkeycloak.migration.realmName=test-realm \
-Dkeycloak.migration.file=/tmp/data.json
cd ./keycloak-server
docker cp keycloak-server:/tmp/data.json ./data/test-realm.json
Make sure your browser has third-party cookies enabled.