Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

cordova-plugin-ionic-webview - Unable to save password in HTML form despite autocomplete attribute

I am working on a Cordova (~PhoneGap, ~Ionic) App and I followed the Apple guidelines and added to autocomplete attributes to my HTML login form to ask users whether they want to save their credentials when they try to sign up.

On Android the popup that asks the user whether they want to store their credentials correctly appears and I'm able to pick my stored credentials the next time I try to log in. That's not the case on iOS though.

The first thing that comes to my mind that could prevent the webview to associate passwords and domains for iOS is the fact that I use a custom domain for the latter (eg. iosapp://).

I cannot change the custom domain in use, is there a way to still let it prompt the user to save their credentials?


This issue can be reproduced in this way:

  1. Add the plugin cordova-plugin-ionic-webview to a Cordova App (cordova-ios 5.1.0)
  2. Add <preference name="Hostname" value="somescheme" /> to your config.xml to specify a custom hostname for your app (the default one is ionic:// and i believe that too would have the same issue)
  3. onDeviceReady redirect to my PoC (that works in all other browsers):
  window.location.href = 'https://gabriele-sacchi.github.io/pocs/biometric';

PoC working in Android Cordova:


(gitlab issue)

like image 677
Gabe Avatar asked Jul 13 '20 06:07

Gabe


1 Answers

It is not possible to trigger the iCloud keychain prompt from your webview. The cordova-plugin-ionic-webview uses the WKWebView class on iOS, which does not seem to support the iCloud keychain. It has nothing to do with the custom app hostname you set. As mentionned in the docs of shared web credentials : "Users often save their username and password in their iCloud keychain when logging into websites in Safari"

That's why for iOS, I had to use safari to make my users authenticate from a webview and allow them to save their password. There is a great cordova plugin to open webviews with Safari (cordova-plugin-safariviewcontroller). If you are using Ionic, there is also a Ionic native support for this plugin : safari-view-controller

I tried to implement your link with cordova-plugin-safariviewcontroller, and the iCloud keychain was properly triggered. The fact is that you will need to change some logic in your app, since going to the webview by using window.location.href=https://your.url will be working for Android only. You will need to detect the platform and then redirect the user properly.

enter image description here

like image 110
saperlipopette Avatar answered Nov 15 '22 00:11

saperlipopette