VT/MONOREPO
2
0
Fork 0
Code Issues 20 Pull requests Projects Releases Packages Wiki Activity Actions

[M1] Frontend: OIDC PKCE Login Flow mit Keycloak #4

New issue
Open
opened 2026-07-11 00:55:16 +00:00 by kocoder · 0 comments
kocoder commented 2026-07-11 00:55:16 +00:00
Owner
Copy link

Zielsetzung

Das Frontend darf nur für authentifizierte Benutzer nutzbar sein. Der Login muss über das OIDC PKCE (Proof Key for Code Exchange) Protokoll gegen unseren lokalen Keycloak laufen.

Aufgaben

  • Einbinden einer OIDC-Bibliothek (z.B. oidc-client-ts oder @solid-primitives/oidc).
  • Erstellen eines AuthContext, der den Login-Status global in der App verfügbar macht.
  • Login-Button / automatische Weiterleitung zu Keycloak (keycloak.localhost) implementieren.
  • Handling des Redirects nach erfolgreichem Login.
  • Extrahieren und Speichern des Access Tokens.
  • Einrichten eines Axios/Fetch Interceptors, um das Access Token in den Headern für zukünftige Connect-RPC Calls bereitzustellen.

Akzeptanzkriterien

  • Bei unauthentifiziertem Zugriff wird der User zu Keycloak weitergeleitet.
  • Nach Login bei Keycloak wird man zurück in die App geleitet.
  • Das Access-Token ist im Frontend validierbar.
### Zielsetzung Das Frontend darf nur für authentifizierte Benutzer nutzbar sein. Der Login muss über das OIDC PKCE (Proof Key for Code Exchange) Protokoll gegen unseren lokalen Keycloak laufen. ### Aufgaben - [ ] Einbinden einer OIDC-Bibliothek (z.B. `oidc-client-ts` oder `@solid-primitives/oidc`). - [ ] Erstellen eines `AuthContext`, der den Login-Status global in der App verfügbar macht. - [ ] Login-Button / automatische Weiterleitung zu Keycloak (`keycloak.localhost`) implementieren. - [ ] Handling des Redirects nach erfolgreichem Login. - [ ] Extrahieren und Speichern des Access Tokens. - [ ] Einrichten eines Axios/Fetch Interceptors, um das Access Token in den Headern für zukünftige Connect-RPC Calls bereitzustellen. ### Akzeptanzkriterien - Bei unauthentifiziertem Zugriff wird der User zu Keycloak weitergeleitet. - Nach Login bei Keycloak wird man zurück in die App geleitet. - Das Access-Token ist im Frontend validierbar.
Sign in to join this conversation.
No Branch/Tag specified
Branches Tags
main
email-service
No results found.
Labels
Clear labels
No items
No labels
Projects
Clear projects
No items
No project
Assignees
Clear assignees
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
VT/MONOREPO#4
No description provided.