WebToNative
  • Getting started
  • Plugin Setup
    • OneSignal Set Up
    • Google AdMob Setup
    • In App Purchase - iOS Setup
    • In App Purchase - Android Setup
    • Firebase Notification Integration - iOS Setup
  • Social Login Integrations
    • Getting the SHA Key for Google Login
    • Create Google OAuth Client Id
    • Facebook Login Configuration
  • Javascript APIS
    • Getting Started
    • Status Bar
    • Pull To Refresh
    • Close App
    • Device Info
    • Clear App Cache
    • OneSignal Push Notification
    • Download Files
    • Printing Options
    • AdMob
    • Geo Location
    • Load In External Browser
    • Barcode Scan
    • In App Purchase - iOS Integration
    • In App Purchase - Android Integration
    • Social Login
    • Facebook App Events
    • Bottom Navigation
    • Clipboard
    • Screen Control
    • Background Location
    • Native Contacts
    • iOS App Tracking Transparency
    • Google Firebase Analytics
    • Haptic Feedback
    • Google Firebase Notification
    • Apps Flyer
    • App Review
    • Calender - iOS
    • Calendar - Android
    • Biometric Authentication
    • Media Player
    • Notification View
    • Offer Card
    • Cookie Update
    • App Launch Detection
    • Download Manager
    • Dynamic App Icon
    • File Sharing
  • Website Plugins
    • Wordpress
      • Push notification (WooCommerce)
      • In-App Purchase
        • In-App Purchase (IAP) Configuration Guide for iOS and Android
        • In-App Purchase (WooCommerce)
        • In-App Purchase
      • Offercard
      • Biometric Authentication
      • Social Login
      • Webtonative media player
        • WebToNative Radio Player
        • MediaPlayer Native Control
    • Bubble.io
      • Customize Status Bar
      • Device-Based Element Visibility
      • Pull to Refresh (Android)
      • OneSignal Push Notification
        • Set External ID
        • Send Push Notification
        • Set/Remove Email or SMS Phone
        • Set Tag
      • Close App
      • Get Device Info
      • Clear App Cache (Android)
      • Screen Control
      • Facebook Events
        • Regular
        • Purchase
      • AdMob
      • Offercard
      • In-App Purchase
        • In-App Purchase (Android/iOS)
        • Get IAP Canceled Subscription List (iOS)
      • Social Login
      • Biometric Authentication
  • Shopify
    • Social Login
    • In-App Purchase
      • In-app purchase
    • Push Notification
      • Abandoned Cart
    • Status Bar Customization
    • Native Device Visibilty
    • Set Onesignal Tags
    • Pull to Refresh
    • Account Deletion
    • Biometric Authentication
  • Upload Apps
    • Android App
    • Ios App
Powered by GitBook
On this page
  • Show Biometric option
  • Save secret
  • Delete Secret
  • Check Status

Was this helpful?

  1. Javascript APIS

Biometric Authentication

Secure Apps With Devices Touch Id or Face Id

PreviousCalendar - AndroidNextMedia Player

Last updated 2 months ago

Was this helpful?

You'll need to import the javascript file in your website before starting from this .

This module explains the ways to use the Biometric authentication functions where you can use the devices Touch/Face Id to unlock an app or use it to secure pages.

If you have choose to handle biometric by yourself then following js apis will be required.

Show Biometric option

Use following code to show biometric in the app. If it is authenticated successfully then callback function will be called.

window.WTN.Biometric.show({
    prompt:"Authenticate to continue!",
    callback:function(data){
        /* data returns the object below 
        {
            isSuccess: true,
            secret: 'saved secret token'
        }
        */
        
    }
});
import { show } from "webtonative/Biometric";

show({
    prompt:"Authenticate to continue!",
    callback:function(data){
         /* data returns the object below 
        {
            isSuccess: true,
            secret: 'saved secret token'
        }
        */
    }
});

Prompt - Used to show text to user when aithentication prompt is shown.

Callback - function called on user authenticating or cancelling the promt.

Save secret

Use following code to save secret in the app. This secret will be returned when you show the biometric when user opens the app. Secret can be used for example to store a login token, using that token you can handle custom handling like get the user logged in.

window.WTN.Biometric.saveSecret({
    secret:"send secret token here",
    callback:function(data){
        /* data returns the object in below format
        
        {
           isSuccess: true
        }
        */
    }
});
import { saveSecret } from "webtonative/Biometric";

saveSecret({
    secret:"send secret token here",
    callback:function(data){
         /* data returns the object in below format
        
        {
           success: true
        }
        */
    }
});

Delete Secret

Use following code to delete secret in the app.

window.WTN.Biometric.deleteSecret({
    callback:function(data){
        /* data returns the object below 
        {
            isSuccess: true
        }
        */
    }
});
import { deleteSecret } from "webtonative/Biometric";

deleteSecret({
    callback:function(data){
       /* data returns the object below 
        {
            success: true
        }
        */
    }
});

Check Status

Check status function will return if biometric is active.

window.WTN.Biometric.checkStatus({
    callback:function(data){
        /* data returns the object below */
        {
            isSuccess: true,
            hasTouchId: true,
            hasSecret: true/false
        }
    }
});
import { checkStatus } from "webtonative/Biometric";

checkStatus({
    callback:function(data){
        console.log("Function called",data);
    }
});
link
Biometric Auth Screen