keycloak-capacitor
This is an extended version of the existing keycloak.js Adapter. It's the same code, I try to keep it up-to-date.
The version of keyloak and this package match.
The only difference are 2 more adapters for capacitor. It's possible to provide custom adapters, but the original
library implements a lot of private methods, which are not accessible with custom adapters. Therefore, duplicate
implementations are required for custom adapters.
There is an open discussion about implementing the capacitor adapter in the original library
here: https://github.com/keycloak/keycloak/issues/10174
Original (v19.0.1) Implementation:
Official Documentation:
Extensions:
- Added
capacitor
adapter - Added
capacitor-native
adapter
Adapter: capacitor-native
Adapter to use the system browser.
Prerequisites
- Setup your iOS App to work with universal links (see official docs linked above)
- Setup your Android App to work with deep links
The adapter will directly access Capacitors app api to listen to iOS (universal links) and Android deep links. Also the
native browser will be opened for the login/logout/register and account management pages.
Usage
- Install package
npm i keycloak-capacitor
- Use it
public keycloak: Keycloak.KeycloakInstance;
constructor()
{
this.keycloak = Keycloak({
clientId: 'webapp',
realm: 'master',
url: 'http://localhost:8080/auth/'
});
this.keycloak.init({
adapter: 'capacitor-native',
responseMode: 'query',
redirectUri: 'http://localhost:8100'
});
this.keycloak.onAuthSuccess = () => {
console.log('authenticated!');
};
}
Adapter: capacitor
Adapter to use an inApp browser
Prerequisites
- Install cordova-plugin-browsertab
- Setup your iOS App to work with universal links (see official docs linked above)
- Setup your Android App to work with deep links
The adapter will directly access Capacitors app api to listen to iOS (universal links) and Android deep links. Also the
inApp browser will be opened for the login/logout/register and account management pages.
Usage
- Install package
npm i keycloak-capacitor
- Use it
Check out the examples
folder.
public keycloak: Keycloak.KeycloakInstance;
constructor()
{
this.keycloak = Keycloak({
clientId: 'webapp',
realm: 'master',
url: 'http://localhost:8080/auth/'
});
this.keycloak.init({
adapter: 'capacitor',
responseMode: 'query',
redirectUri: 'http://localhost:8100'
});
this.keycloak.onAuthSuccess = () => {
console.log('authenticated!');
};
}