Keycloak OpenID Connect Authentication Example
Configuration
Let's start by configuring WunderGraph.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
Get GitHub OAuth app credentials:
- Go to GitHub profile settings and create a new OAuth app.
- Generate client secret
- Set authorization callback URL to:
http://localhost:8080/realms/demo/broker/github/endpoint
, and home page URL to:http://localhost:3000
- Copy the
Client ID
andClient Secret
to the clipboard - Rename the
.example.env
file to.env
- Paste the credentials into the
.env
file
Install & Start
Run keycloak:
1
Install the dependencies and run the complete example in one command:
1
3. Use the application
On the NextJS frontend, click the "Login" button. Once the login is complete, the Frontend will automatically fetch the data and inject the bearer token into the origin request.
4. Keycloak console
http://localhost:8080/
- user name: admin
- password: admin