Steps needed to configure password autofill for both Android and iOS

OutSystems configuration

1.Introduction

2.Application

3.Plugin

4.Extensibility configurations

1.Introduction

The OutSystems application needs specific input field attributes and configurations to allow the autofill to work

2. Application

The login screen should have the fields autocomplete attribute configured as:

Username:

autocomplete=”username”

Password:

autocomplete=”current-password”

3. Plugin

Configure this Plugin’s extensibility configurations to fit your needs

{

    "plugin": {

        "url": "https://github.com/os-adv-dev/cordova-plugin-passwordautofill.git",

        "variables": [

            {

                "name": "TrapezeVars",

                "value": "{'ASSOCIATED_DOMAINS':['webcredentials:<your-domain>']}"

            },

            {

                "name": "Domain",

                "value": "<your-domain>"

            }

        ]

    }

}

Using the Manage Dependencies, reference the plugin by choosing the PasswordAutofillPlugin module and selecting the CheckAutofillPlugin client action

Android configuration

1.Introduction

2.Keystore

3.Site Association file

1. Introduction

Android configuration involves creating a site association file. The Site Association file requires the SHA256 fingerprint of your Android certificate, aka keystore.

2. Android certificate/Keystore

If you don’t have the android certificate use the following code to create it:

keytool -genkey -v -keystore KEY-NAME.keystore -alias ALIAS -keyalg RSA -keysize 2048 -validity 10000

Using your existing (or newly created) Keystore certificate, use the keytool command to list the keystore's details:

keytool -list -v -keystore my-release-key.keystore

The printed output will include the SHA256 fingerprint:

2. Site Association file

Next, use Google's Asset Links tool to create the Site Association file. Fill in the website domain, app package name, and SHA256 fingerprint, then click "Generate statement"

Copy the JSON output into a new local file under .well-known/assetlinks.json.

iOS configuration

1.Introduction

2.Application Identifier & provisioning profile

3.Apple App Site Association File

1. Introduction

iOS configuration involves having a provisioning profile with the Associated Domains capability and the Apple App Site Association File server side.

2. Provisioning profile

If your application provisioning profile doesn't have the Associated Domains capability enabled:

Go to your Apple developer account and navigate to Certificates, Identifiers & profiles

On the left menu, select Identifiers and choose your application identifier from the list

Mark the Associated Domains checkbox and click Save

A new provisioning profile needs to be created

Go to Provisioning Profiles from the left side menu

Choose the appropriate provisioning profile from the list

Click Edit followed by Save

The last step should show a Download button

Finally, use this new provisioning profile to sign your application.

3. Apple App Site Association File

Create the site association file called apple-app-site-association similar to the one below

{

    "applinks": {

        "details": [

            {

                "appID": "TEAMID.BUNDLEID",

                "paths": [

                    "*"

                ]

            }

        ]

    }

}

Replace TEAMID.BUNDLEID with your own Apple Team ID and App Bundle ID

The provisioning profile contains both bundle ID and Team ID

Upload the file into the .well-known folder on your web site (must be hosted on HTTPS). The URL should follow this format: https://my-app.com/.well-known/apple-app-site-association (no json extension)