Chapeaux Keycloak Component
Keycloak Component Purpose
- Interface with Keycloak
- Create an HTML-based interface for Keycloak's JS Adapter
- Provide centralized mechanism for auth that can be distributed and used by a variety of teams
Events
-
token-ready
- fires when the.user
object data is populated -
user-update
- fires when the.user
object is updated
Usage
User data is always stored on the .user
property once it is available.
-
```html <cpx-user> <script type="data"> { "name": "Test User", "email": "test123@test123.com" } </script> </cpx-user> ```
-
Requires that
jwt_decode
library be available globally.Available component properties:
-
jwt-cookie
: sets the cookie to parse for JWT data -
jwt-token
: sets the JWT token to parse for data
```html <cpx-user jwt-cookie="SOME_JWT_COOKIE_NAME"></cpx-user> ```
```html <cpx-user jwt-token="SOMEJWTENCODEDSTRING"></cpx-user> ```
-
-
Requires
keycloak.js
to be available, and the following attributes to be set with the appropriate values:-
kc-url
- the Keycloak server url -
kc-realm
- the Keycloak realm -
kc-client-id
- the Keycloak client ID
-
login()
: log in using the Keycloak config -
logout()
: log out using the Keycloak config -
register()
: send user to registration screen based on Keycloak config -
account()
: send user to account management screen based on Keycloak config -
token.createLoginUrl()
: creates URL to direct user to login screen -
token.createLogoutUrl()
: creates URL to log user out
-
token
: the Keycloak object for authenticated users
```html <cpx-user kc-url="https://test123.com/auth" kc-realm="your-realm" kc-client-id="your-client-id"></cpx-user> ```
-