Fingerprint (biometric) authentication (HTML)

You can enhance the security of your app by including a request for fingerprint (biometric) authentication when the user must consent to a particular action. For example, you can require fingerprint authentication before authorizing an in-app purchase, or access to restricted resources. You can manage fingerprint authentication using the UserConsentVerifier class in the Windows.Security.Credentials.UI namespace.

To find out whether the device has a fingerprint reader, call the UserConsentVerifier.CheckAvailabilityAsync method. Even if a device supports fingerprint authentication, your app should still provide users with an option in Settings to enable or disable it. For more info about creating this setting, see Adding app settings.

The following example shows a method that checks to see if the current computer supports fingerprint authentication, and then returns a message with the result.

function checkFingerprintAvailability() {
    try {
        // Check the availability of fingerprint authentication.

        Windows.Security.Credentials.UI.UserConsentVerifier.checkAvailabilityAsync().then(
        function (ucvAvailability) {

            switch (ucvAvailability)
            {
                case Windows.Security.Credentials.UI.UserConsentVerifierAvailability.available:
                    outputDiv.innerHTML = "<br/>Fingerprint verification is available.";
                    break;
                case Windows.Security.Credentials.UI.UserConsentVerifierAvailability.deviceBusy:
                    outputDiv.innerHTML = "<br/>Biometric device is busy.";
                    break;
                case Windows.Security.Credentials.UI.UserConsentVerifierAvailability.deviceNotPresent:
                    outputDiv.innerHTML = "<br/>No biometric device found.";
                    break;
                case Windows.Security.Credentials.UI.UserConsentVerifierAvailability.disabledByPolicy:
                    outputDiv.innerHTML = "<br/>Biometric verification is disabled by policy.";
                    break;
                case Windows.Security.Credentials.UI.UserConsentVerifierAvailability.notConfiguredForUser:
                    outputDiv.innerHTML = "<br/>The user has no fingerprints registered. Please add a fingerprint to the " +
                                    "fingerprint database and try again.";
                    break;
                default:
                    outputDiv.innerHTML = "<br/>Fingerprints verification is currently unavailable.";
                    break;
            }
        });
    }
    catch (ex) {
        outputDiv.innerHTML = "<br/>Fingerprint authentication availability check failed: " + ex.toString();
    }
}

To request user consent from a fingerprint scan, call the UserConsentVerifier.RequestVerificationAsync method. For fingerprint authentication to work, the user must have previously added a fingerprint "signature" to the fingerprint database. When you call the UserConsentVerifier.RequestVerificationAsync, the user is presented with a modal dialog requesting a fingerprint scan. You can supply a message to the UserConsentVerifier.RequestVerificationAsync method that will be displayed to the user as part of the modal dialog, as shown in the following image.

fingerprint authentication modal dialog

The following example shows a method that requests fingerprint verification, and then returns a message with the result.

function requestConsent(userMessage) {
    if (!userMessage) {
        userMessage = "Please provide fingerprint verification.";
    }

    try {
        // Request the logged on user's consent via fingerprint swipe.
        Windows.Security.Credentials.UI.UserConsentVerifier.requestVerificationAsync(userMessage) 
        .then(
            function (consentResult) { 
                switch (consentResult) {
                    case Windows.Security.Credentials.UI.UserConsentVerificationResult.verified:
                        outputDiv.innerHTML = "<br/>Fingerprint verified.";
                        break;
                    case Windows.Security.Credentials.UI.UserConsentVerificationResult.deviceBusy:
                        outputDiv.innerHTML = "<br/>Biometric device is busy.";
                        break;
                    case Windows.Security.Credentials.UI.UserConsentVerificationResult.deviceNotPresent:
                        outputDiv.innerHTML = "<br/>No biometric device found.";
                        break;
                    case Windows.Security.Credentials.UI.UserConsentVerificationResult.disabledByPolicy:
                        outputDiv.innerHTML = "<br/>Biometric verification is disabled by policy.";
                        break;
                    case Windows.Security.Credentials.UI.UserConsentVerificationResult.notConfiguredForUser:
                        outputDiv.innerHTML = "<br/>The user has no fingerprints registered. Please add a fingerprint to the " +
                                        "fingerprint database and try again.";
                        break;
                    case Windows.Security.Credentials.UI.UserConsentVerificationResult.retriesExhausted:
                        outputDiv.innerHTML = "<br/>There have been too many failed attempts. Fingerprint authentication canceled.";
                        break;
                    case Windows.Security.Credentials.UI.UserConsentVerificationResult.canceled:
                        outputDiv.innerHTML = "<br/>Fingerprint authentication canceled.";
                        break;
                    default:
                        outputDiv.innerHTML = "<br/>Fingerprint authentication is currently unavailable.";
                        break;
                }
            });
    }
    catch (ex) {
        outputDiv.innerHTML = "<br/>Fingerprint authentication failed: " + ex.toString();
    }
}

UserConsentVerifier sample

UserConsentVerifier

Windows.Security.Credentials.UI

Authentication and User Identity