KEYCLOAK-2606: document the different cordova modes of the javascript adapter
This commit is contained in:
parent
15b3d7f707
commit
bf29410b6b
1 changed files with 47 additions and 0 deletions
|
@ -161,6 +161,52 @@ For the Hybrid flow, you need to pass the parameter `flow` with value `hybrid` t
|
|||
keycloak.init({ flow: 'hybrid' })
|
||||
----
|
||||
|
||||
==== Hybrid Apps with Cordova
|
||||
|
||||
Keycloaks support hybird mobile apps developed with https://cordova.apache.org/[Apache Cordova]. The Javascript adapter has two modes for this: `cordova` and `cordova-native`:
|
||||
|
||||
The default is `cordova`. The adapter will pick it automatically if no adapter type has been configured and `window.cordova` is present.
|
||||
When logging in, it will open an https://cordova.apache.org/docs/en/latest/reference/cordova-plugin-inappbrowser/[InApp Browser] that lets the user interact with keycloak and afterwards returns to the app by redirecting to http://localhost.
|
||||
Therefore this URL needs to be whitelisted as valid redirect-uri in the client configuration section of the Administration Console.
|
||||
|
||||
While this mode is very easy to setup, it also has a few disadvantages:
|
||||
The InApp-Browser is a browser embedded in the app and not the phones default browser.
|
||||
Therefore it will have different settings and stored credentials will not be available. It might be slower, especially when rendering more complex themes.
|
||||
There are security concerns to consider, before using this mode:
|
||||
It is possible for the app to gain access to the credentials of the user, as it has full control of the browser rendering the login page.
|
||||
So do not allow its use in apps you dont trust.
|
||||
|
||||
The alternative mode `cordova-native` takes a different approach.
|
||||
It opens the login page in the systems browser.
|
||||
After the user has authenticated, the browser redirects back into the app by a special URL.
|
||||
From there, the keycloak adapter can finish the login by reading the code or token from the URL.
|
||||
|
||||
You can activate the native mode by passing the adater type `cordova-native` to the ìnit` method:
|
||||
|
||||
[source,javascript]
|
||||
----
|
||||
keycloak.init({ adapter: 'cordova-native' })
|
||||
----
|
||||
|
||||
This adapter required two additional plugins:
|
||||
|
||||
* https://github.com/google/cordova-plugin-browsertab[cordova-plugin-browsertab]: allows the app to open webpages in the systems browser
|
||||
* https://github.com/e-imaxina/cordova-plugin-deeplinks[cordova-plugin-deeplinks]: allow the browser to redirect back to your app by special URLs
|
||||
|
||||
The technical details for linking to an app differ on each plattform and special setup is needed.
|
||||
Please refer to the according sections of the deeplinks plugin for further instructions (https://github.com/e-imaxina/cordova-plugin-deeplinks#android-web-integration[Android] and [iOS https://github.com/e-imaxina/cordova-plugin-deeplinks#ios-web-integration[iOS]].
|
||||
|
||||
There are different kinds of links for opening apps: custom schemes (i.e. `myapp://login` or `android-app://com.example.myapp/https/example.com/login`) and https://developer.apple.com/ios/universal-links/[Universal Links (iOS]) / https://developer.android.com/training/app-indexing/deep-linking.html[Deep Links (Android)]. While the former are easier to setup and tend to work more reliable, the later offer extra security as they are unique and only the owner of a domain can register them. Custom-URLs are deprecated on iOS. We recommend that you use universal links, combined with a fallback site with a custom-url link on it for best reliability.
|
||||
|
||||
Furthermore, we recommend the following steps to improve compatibility with the Keycloak Adapter:
|
||||
|
||||
* Universal Links on iOS seem to work more reliable with `response-mode` set to `query`
|
||||
* To prevent Android from opening a new instance of your app on redirect add the following snippet to `config.xml`:
|
||||
[source,xml]
|
||||
----
|
||||
<preference name="AndroidLaunchMode" value="singleTask" />
|
||||
----
|
||||
|
||||
==== Earlier Browsers
|
||||
|
||||
The JavaScript adapter depends on Base64 (window.btoa and window.atob) and HTML5 History API.
|
||||
|
@ -233,6 +279,7 @@ adapter::
|
|||
Available options:
|
||||
* "default" - the library uses the browser api for redirects (this is the default)
|
||||
* "cordova" - the library will try to use the InAppBrowser cordova plugin to load keycloak login/registration pages (this is used automatically when the library is working in a cordova ecosystem)
|
||||
* "cordova-native" - the library try to open the login andregistration page in the phones system browser using the BrowserTabs cordova plugin. This requires extra setup for redirecting back to the app (see <<hybrid-apps-with-cordova>>)
|
||||
* custom - allows you to implement a custom adapter (only for advanced use cases)
|
||||
|
||||
responseType::
|
||||
|
|
Loading…
Reference in a new issue