Skip to content

Biometric Login

Use case

  • Users must register their biometric data in their OS settings (not in your apps).
  • All registered biometric data of different people in one device is valid for use.

Scenario 1: First time install

  1. User download the app
  2. User open the app
  3. User navigate to login page
  4. User tap "Biometric login" button
  5. Show message:

Dialog

Biometric login has not been activated on your device.
Please log in and activate it on "Preferences" page.

Scenario 2: Activating biometric login

  1. User log in with regular username and password
  2. User navigate to "Preferences" page
  3. User tap "Biometric login" option (checkbox)
  4. App will send credentials to server: username + password + deviceId
  5. Server will issues a long-live refresh token
  6. Refresh token will be saved by using the function below:
biometric.ts
const refreshToken = 'xxxxx.yyyyy.zzzzz'

await Fingerprint.registerBiometricSecret({
    secret: refreshToken
})

Scenario 3: Login with biometric (after the activation)

  1. User open the app
  2. User navigate to login page
  3. User tap "Biometric login" button
  4. Authenticate the user using biometry (fingerprint or faceId)
  5. If authenticated, load refreshToken from the biometric registry and send it to the server
  6. Server exchanges refreshToken for a valid access-token
biometric.ts
const secret = await Fingerprint.loadBiometricSecret()
const credential = JSON.parse(secret)

// POST api/v2/token

Test case

Scenario 1: User log in with different fingers

  1. User activate the biometric login feature in "Preferences" page using their thumb
  2. User try to log in using another registered finger

Result

Log in success

Scenario 2: User register new fingers

  1. User activate the biometric login feature in "Preferences" page using their thumb
  2. User go to OS settings, then register new finger
  3. User go back to app, then try to log in

Result

Log in failed

Dependencies