Auth0 + Capacitor + Ionic (the good part):
We were able to get auth0 running without much problems by leveraging the ionic-appauth npm package (which is a ionic wrapper for appauth-js). A working demo for ionic-appauth + capacitor can be found here:
https://github.com/wi3land/ionic-appauth-capacitor-demo
All we needed todo is plugin the ODIC endpoints for auth0 and we login was working as excepted. We did have to override the logout method but that wasn’t an issue.
The issue: Forced First Party Consent on device
The default url schemes for capacitor on devices are are
- capacitor://localhost (ios)
- and http://localhost (android)
Based on documentation and community articles a consent screen is shown in either of the below scenarios:
- third party app (both app + api are first party)
- api app has “Allow Skipping User Consent” flag not set (we have the flag set)
- redirect url is localhost based <= bingo
This leads to the Consent screen being shown even if this is a First Party App + API. Based on the documentation I have found there is no way to disable this as localhost is regarded as unsafe by auth0 no matter the circumstance.
This however conflicts with how device operating systems treat localhost. From capacitor documentation (Capacitor Configuration | Capacitor Documentation):
// You can configure the local hostname, but it’s recommended to keep localhost
// as it allows to run web APIs that require a secure context such as
// navigator.geolocation and MediaDevices.getUserMedia.
This is a make or break problem for us. We leverage these native apis so we need to stay on localhost. In addition we leverage third party social providers (via auth0) that already show a consent screen and it would throw off our users if there would be a second one.
We have tested a validated this assumption already and drop off rate have been so scary high that we have decided we cannot move forward with the consent screens in place.
From our understanding it also wouldn’t make a difference if we leverage the first party auth0 client to handle login + auth. Since the decision to show the consent screen happens server side and is in our case depended on the redirect url.
Its not an option for us to use the mobile native auth0 components unless they are accessible via capacitor.
Please note:
We have also deployed the same ionic capacitor application to a public web url. Here the consent page is not shown, since the redirect url provided is not localhost but to a public url where the app is hosted. So our app + auth0 are properly configured.
Please let us know if:
- there is any way to circumvent showing the consent screen in the above scenario (localhost redirect url)
- or if as of now there is no other option todo this in which case we sadly had to abandon auth0