KEYCLOAK-2606: Added fixes suggested by matthewhelmke

This commit is contained in:
Gregor Tudan 2018-07-03 07:02:43 +02:00 committed by Stian Thorgersen
parent 044afd3e62
commit bb7a5f5f22

View file

@ -163,25 +163,22 @@ 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`:
Keycloak 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.
The default is cordova, which the adapter will automatically select 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 {project_name} and afterwards returns to the app by redirecting to http://localhost. Because of this, you must whitelist this URL as a 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.
While this mode is easy to setup, it also has some disadvantages:
* The InApp-Browser is a browser embedded in the app and is not the phone's default browser. Therefore it will have different settings and stored credentials will not be available.
* The InApp-Browser might also be slower, especially when rendering more complex themes.
* There are security concerns to consider, before using this mode, such as that 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 do not trust.
We have an example app that can help you get started: https://github.com/keycloak/keycloak/tree/master/examples/cordova
Use this example app to help you get started: https://github.com/keycloak/keycloak/tree/master/examples/cordova
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.
The alternative mode `cordova-nativei` takes a different approach.
It opens the login page using the system's browser.
After the user has authenticated, the browser redirects back into the app using a special URL.
From there, the {project_name} 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 `init` method:
@ -192,20 +189,20 @@ 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/google/cordova-plugin-browsertab[cordova-plugin-browsertab]: allows the app to open webpages in the system's 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.
While the former are easier to setup and tend to work more reliably, 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`
* Universal Links on iOS seem to work more reliably 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]
----
@ -286,7 +283,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>>)
* "cordova-native" - the library tries to open the login and registration page using the phone's 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::