• Stars
    star
    216
  • Rank 183,179 (Top 4 %)
  • Language
    Objective-C
  • License
    MIT License
  • Created over 10 years ago
  • Updated almost 5 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

πŸ’… πŸ‘±β€β™‚οΈ Forget passwords, use a fingerprint scanner!

Cordova TouchID Plugin

Also works with Face ID on iPhone X πŸš€

Index

  1. Description
  2. Screenshot
  3. Installation
  4. Usage
  5. Security++
  6. Face ID support

Description

Scan the fingerprint of your user with the TouchID sensor (iPhone 5S).

  • Compatible with Cordova Plugman.
  • Minimum iOS version is 8 (error callbacks will be gracefully invoked on lower versions).
  • Requires a fingerprint scanner, so an iPhone 5S or newer is required.

Screenshot

Distorted a bit because I created it back when Apple had not yet released the SDK and they're not a fan of developers posting screenshots of unreleased features.

ScreenShot

Installation

Automatically (CLI / Plugman)

Compatible with Cordova Plugman, compatible with PhoneGap 3.0 CLI, here's how it works with the CLI (backup your project first!):

From npm:

$ cordova plugin add cordova-plugin-touch-id
$ cordova prepare

The latest, from the master repo:

$ cordova plugin add https://github.com/EddyVerbruggen/cordova-plugin-touch-id
$ cordova prepare

TouchID.js is brought in automatically. There is no need to change or add anything in your html.

Manually

1. Add the following xml to your config.xml in the root directory of your www folder:

<feature name="TouchID">
  <param name="ios-package" value="TouchID" />
</feature>

You'll need to add the LocalAuthentication.framework and Security.framework to your project. Click your project, Build Phases, Link Binary With Libraries, search for and add the frameworks.

2. Grab a copy of TouchID.js, add it to your project and reference it in index.html:

<script type="text/javascript" src="js/TouchID.js"></script>

3. Download the source files and copy them to your project.

iOS: Copy the two .h and two .m files to platforms/ios/<ProjectName>/Plugins

Usage

First you'll want to check whether or not the user has a configured fingerprint scanner. You can use this to show a 'log in with your fingerprint' button next to a username/password login form.

window.plugins.touchid.isAvailable(
  function(type) {alert(type)}, // type returned to success callback: 'face' on iPhone X, 'touch' on other devices
  function(msg) {alert('not available, message: ' + msg)} // error handler: no TouchID available
);

If the onSuccess handler was called, you can scan the fingerprint. There are two options: verifyFingerprint and verifyFingerprintWithCustomPasswordFallback. The first method will offer a fallback option called 'enter passcode' which shows the default passcode UI when pressed. The second method will offer a fallback option called 'enter password' (not passcode) which allows you to provide your own password dialog.

window.plugins.touchid.verifyFingerprint(
  'Scan your fingerprint please', // this will be shown in the native scanner popup
   function(msg) {alert('ok: ' + msg)}, // success handler: fingerprint accepted
   function(msg) {alert('not ok: ' + JSON.stringify(msg))} // error handler with errorcode and localised reason
);

The errorhandler of the method above can receive an error code of -2 which means the user pressed the 'enter password' fallback.

window.plugins.touchid.verifyFingerprintWithCustomPasswordFallback(
  'Scan your fingerprint please', // this will be shown in the native scanner popup
   function(msg) {alert('ok: ' + msg)}, // success handler: fingerprint accepted
   function(msg) {alert('not ok: ' + JSON.stringify(msg))} // error handler with errorcode and localised reason
);

This will render a button labelled 'Enter password' in case the fingerprint is not recognized. If you want to provide your own label ('Enter PIN' perhaps), you can use awkwardly named function (added in version 3.1.0):

window.plugins.touchid.verifyFingerprintWithCustomPasswordFallbackAndEnterPasswordLabel(
  'Scan your fingerprint please', // this will be shown in the native scanner popup
  'Enter PIN', // this will become the 'Enter password' button label
   function(msg) {alert('ok: ' + msg)}, // success handler: fingerprint accepted
   function(msg) {alert('not ok: ' + JSON.stringify(msg))} // error handler with errorcode and localised reason
);

You can copy-paste these lines of code for a quick test:

<button onclick="window.plugins.touchid.isAvailable(function(msg) {alert('ok: ' + msg)}, function(msg) {alert('not ok: ' + msg)})">Touch ID available?</button>
<button onclick="window.plugins.touchid.verifyFingerprint('Scan your fingerprint please', function(msg) {alert('ok: ' + msg)}, function(msg) {alert('not ok: ' + JSON.stringify(msg))})">Scan fingerprint</button>

"Biometry is locked out" (code: -8)

window.plugins.touchid.askPassword(
   'Enter password', // this will become the 'Enter password' label
   function(msg) {alert('ok: ' + msg)}, // success handler: fingerprint reactivated
   function(msg) {alert('not ok: ' + JSON.stringify(msg))} // error reason as string
);

Security++

Since iOS9 it's possible to check whether or not the list of enrolled fingerprints changed since the last time you checked it. It's recommended you add this check so you can counter hacker attacks to your app. See this article for more details.

So instead of checking the fingerprint after isAvailable add another check. In case didFingerprintDatabaseChange returns true you probably want to re-authenticate your user before accepting valid fingerprints again.

window.plugins.touchid.isAvailable(
    // success handler; available
    function() {
      window.plugins.touchid.didFingerprintDatabaseChange(
          function(changed) {
            if (changed) {
              // re-auth the user by asking for his credentials before allowing a fingerprint scan again
            } else {
              // call the fingerprint scanner
            }
          }
      );
    },
    // error handler; not available
    function(msg) {
      // use a more traditional auth mechanism
    }
);

Face ID Support

Since iOS 11, LocalAuthentication also supports Face ID for biometrics. This is a drop-in replacement for Touch ID and any existing apps using Touch ID will work identically on devices that use Face ID.

Since plugin version 3.3.0 the success callback of isAvailable receives the type of biometric ID, which is either touch or face.

You can use this to display "Face ID" or "Touch ID" as appropriate in your app.

window.plugins.touchid.isAvailable(
  function(type) {alert(type)}, // type returned to success callback: 'face' on iPhone X, 'touch' on other devices
  function(msg) {alert('not available, message: ' + msg)} // error handler: no TouchID available
);

If you want to alter the usage description in the consent popup, then override the default empty adds an empty NSFaceIDUsageDescription. To do so, pass the following variable when installing the plugin:

cordova plugin add cordova-plugin-touch-id --variable FACEID_USAGE_DESCRIPTION="For easy authentication"

More Repositories

1

SocialSharing-PhoneGap-Plugin

πŸ‘¨β€β€οΈβ€πŸ’‹β€πŸ‘¨ Cordova plugin to share text, a file (image/PDF/..), or a URL (or all three) via the native sharing widget
Objective-C
1,778
star
2

nativescript-plugin-firebase

πŸ”₯ NativeScript plugin for Firebase
TypeScript
1,011
star
3

Calendar-PhoneGap-Plugin

πŸ“… Cordova plugin to Create, Change, Delete and Find Events in the native Calendar
Java
773
star
4

cordova-plugin-googleplus

βž• Cordova plugin to login with Google Sign-In on iOS and Android
Java
567
star
5

Toast-PhoneGap-Plugin

🍻 A Toast popup plugin for your fancy Cordova app
C++
509
star
6

nativescript-barcodescanner

πŸ”Ž NativeScript QR / barcode (bulk)scanner plugin
TypeScript
292
star
7

cordova-plugin-safariviewcontroller

🐯 🐘 🐊 Forget InAppBrowser for iOS - this is way better for displaying read-only web content in your PhoneGap app
Java
281
star
8

cordova-plugin-native-keyboard

🎹 Add a Slack / WhatsApp - style chat keyboard to your Cordova app!
Objective-C
275
star
9

Insomnia-PhoneGap-Plugin

πŸ˜ͺ Prevent the screen of the mobile device from falling asleep
JavaScript
266
star
10

cordova-plugin-actionsheet

πŸ“‹ ActionSheet plugin for Cordova iOS and Android apps
JavaScript
208
star
11

cordova-plugin-3dtouch

πŸ‘‡ Quick Home Icon Actions and Link Previews
Objective-C
176
star
12

nativescript-pluginshowcase

An app I'm using to showcase a bunch of NativeScript plugins (also in the appstores!)
TypeScript
175
star
13

HealthKit

Cordova plugin for the iOS HealthKit framework
Objective-C
168
star
14

remove.bg

A Node.js wrapper for the remove.bg API
TypeScript
162
star
15

nativescript-local-notifications

πŸ“« NativeScript plugin to easily schedule local notifications
TypeScript
162
star
16

SSLCertificateChecker-PhoneGap-Plugin

πŸ›‚ Prevent Man in the Middle attacks with this Cordova plugin
Objective-C
156
star
17

VideoCapturePlus-PhoneGap-Plugin

πŸŽ₯
Objective-C
133
star
18

nativescript-fingerprint-auth

πŸ’… πŸ‘±β€β™‚οΈ Forget passwords, use a fingerprint scanner or facial recognition!
TypeScript
133
star
19

nativescript-feedback

πŸ“’ Non-blocking textual feedback for your NativeScript app
TypeScript
129
star
20

nativescript-ar

Augmented Reality NativeScript plugin
TypeScript
118
star
21

nativescript-secure-storage

πŸ” NativeScript plugin for secure local storage of fi. passwords
TypeScript
108
star
22

nativescript-nodeify

Makes most npm packages compatible with NativeScript
JavaScript
91
star
23

nativescript-speech-recognition

πŸ’¬ Speech to text, using the awesome engines readily available on the device.
TypeScript
90
star
24

nativescript-directions

πŸ‘† πŸ‘‰ πŸ‘‡ πŸ‘ˆ Open the Maps app to show directions to anywhere you like
TypeScript
81
star
25

nativescript-localize

Internationalization plugin for NativeScript using native capabilities of each platform
TypeScript
79
star
26

nativescript-nfc

πŸ“ NativeScript plugin to discover, read, and write NFC tags
TypeScript
77
star
27

nativescript-keyboard-toolbar

βŒ¨οΈπŸ› Add a customizable toolbar on top of the soft keyboard
TypeScript
69
star
28

nativescript-admob

NativeScript plugin to earn some precious πŸ’°πŸ’° with ads by Google AdMob
JavaScript
68
star
29

cordova-plugin-ios-longpress-fix

πŸ” Suppress the magnifying glass when long pressing an iOS9 PhoneGap app
Objective-C
67
star
30

nativescript-i18n

This is a plugin for Nativescript that implements native i18n in an easy manner.
JavaScript
65
star
31

cordova-plugin-taptic-engine

πŸ“³ Use Apple's Taptic Engine to vibrate your iPhone 6s (or up) in a variety of ways
Objective-C
61
star
32

Flashlight-PhoneGap-Plugin

πŸ”¦ Cordova plugin for using the torch / flashlight of your device
Java
60
star
33

cordova-plugin-backgroundaudio

🎢 Background Audio plugin for Cordova PhoneGap apps
Objective-C
57
star
34

nativescript-gradient

🎨 Easily add fancy (or subtle) gradient backgrounds to your views
TypeScript
54
star
35

nativescript-app-shortcuts

πŸ‘‡ Home Icon Actions for your NativeScript app, now also for Android!
TypeScript
48
star
36

nativescript-appversion

πŸ”’ NativeScript plugin to retrieve your app's package ID and current version
JavaScript
48
star
37

nativescript-email

βœ‰οΈ NativeScript plugin for opening draft e-mails
JavaScript
47
star
38

nativescript-calendar

πŸ“… NativeScript plugin to Create, Delete and Find Events in the native Calendar
TypeScript
44
star
39

barcodescanner-lib-aar

Project which compiles barcodescanner sources to an aar for use in Android projects
Java
41
star
40

nativescript-clipboard

πŸ“‹ NativeScript plugin to copy stuff to the device clipboard, and read from it again
TypeScript
40
star
41

nativescript-apple-sign-in

Sign In With Apple, as seen on WWDC 2019, available with iOS 13
TypeScript
39
star
42

footplr

An app using NativeScript and Vue with Firebase (Firestore)
HTML
38
star
43

nativescript-ocr

πŸ“° πŸ” Tesseract-powered OCR plugin for NativeScript
TypeScript
38
star
44

nativescript-printer

πŸ“  Send an image or the screen contents to a physical printer
TypeScript
35
star
45

HeadsetDetection-PhoneGap-Plugin

🎧 A PhoneGap plugin for detection of a headset (wired or bluetooth)
Java
34
star
46

nativescript-numeric-keyboard

πŸ”’ Replace the meh default number/phone keyboard with this stylish one
TypeScript
33
star
47

nativescript-keyframes

Facebook Keyframes plugin - if CSS animations don't cut it for ya
JavaScript
32
star
48

nativescript-star-printer

🌟 Print directly to Star Micronics printers from your NativeScript app! http://www.starmicronics.com/
Objective-C
32
star
49

cordova-plugin-app-icon-changer

Change the homescreen icon of your Cordova iOS app at runtime!
Objective-C
32
star
50

nativescript-bluetooth-demo

JavaScript
30
star
51

nativescript-android-tv

A little PoC demonstrating code sharing between Android Phone and TV apps
TypeScript
27
star
52

nativescript-homekit

🏑 HomeKit plugin for your fancy NativeScript app
TypeScript
24
star
53

nativescript-plugin-firebase-demo

Demo app for the NativeScript Firebase plugin
JavaScript
24
star
54

nativescript-performance-monitor

⚑ Proof your app maintains 60-ish FPS by collecting data or showing it on screen with this NativeScript plugin!
TypeScript
21
star
55

nativescript-pushy

Easy push notifications for your NativeScript app!
TypeScript
21
star
56

nativescript-webview-utils

πŸ•ΈAdd request headers to a NativeScript WebView. Perhaps more utils later.
TypeScript
20
star
57

nativescript-particle

πŸ•Ή Control your https://particle.io devices from NativeScript
TypeScript
20
star
58

cordova-plugin-webviewcolor

Objective-C
19
star
59

nativescript-appavailability

πŸ”Ž NativeScript plugin to check whether or not another app is installed on the device
JavaScript
19
star
60

nativescript-mapbox-demo

Demo app for the NativeScript Mapbox plugin
JavaScript
18
star
61

nativescript-pedometer

🐾 step count tracking plugin for your NativeScript app
TypeScript
17
star
62

nativescript-taptic-engine

πŸ“³ Use Apple's Taptic Engine to vibrate your iPhone 6s (and up) in a variety of ways
Vue
16
star
63

nativescript-app-icon-changer

Change the homescreen icon of your NativeScript iOS app at runtime!
TypeScript
16
star
64

nativescript-local-notifications-demo

Demo app for the NativeScript local notifications plugin
JavaScript
15
star
65

nativescript-dark-mode

NativeScript plugin to tap into iOS13's Dark Mode and Android's Night Mode configs
TypeScript
15
star
66

nativescript-aws

[DEPRECATED, see the readme] NativeScript plugin for Amazon's AWS ☁️ services
JavaScript
15
star
67

nativescript-headset-detection

Detect when a headphone (jack or bluetooth) is (dis)connected.
TypeScript
14
star
68

CameraRoll-PhoneGap-Plugin

Objective-C
11
star
69

nativescripthighcharts

Demoing how to add highcharts to your NativeScript app
TypeScript
10
star
70

NativePageTransitions-Ionic-Demo

Demo App for Ionic framwork apps with the Native Page Transitions plugin
JavaScript
10
star
71

X-Services-PhoneGap-Build-Plugins-Demo

A demo repo for all of our PhoneGap Build plugins
JavaScript
10
star
72

nativescript-call

NativeScript plugin to interact with the native Call UI
TypeScript
8
star
73

cordova-plugin-researchkit

Cordova / PhoneGap plugin for the Apple's ResearchKit
Objective-C
8
star
74

phonegapbuildmonitor

Repository for the iOS and Android PhoneGap Build app: Buildmeister
CSS
6
star
75

nativescript-izettle

Accept payments directly in your NativeScript app with iZettle
5
star
76

nativescript-calendar-demo

Demo app for the NativeScript Calendar plugin
JavaScript
5
star
77

ns-vue-firebase-test

Sample code to show how to use Firebase with the NS-Vue Vue CLI template
JavaScript
5
star
78

nativescript-randombytes

πŸ”€ πŸ”’ A NativeScript shim for the randombytes package
JavaScript
4
star
79

nativescript-date-utils

A simple plugin with a few date-related utilities
Shell
4
star
80

nativescript-admob-demo

Demo app for the NativeScript AdMob plugin
JavaScript
4
star
81

nativescript-snapkit

Log in to your app with your Snapchat account
TypeScript
3
star
82

ios-framework-barcodescanner

An iOS BarcodeScanner .framework library, wrapping the built-in iOS barcodescanner capabilities
Objective-C
2
star
83

bridgematebroadcast

Java
2
star
84

nativescript-barcodescanner-demo

Demo app for the NativeScript BarcodeScanner plugin
JavaScript
2
star
85

nativescript-ios-out-of-memory

Reproducing NativeScript issue 4490
JavaScript
1
star
86

nativescript-wkwebview

NativeScript WKWebView plugin for iOS
JavaScript
1
star
87

iOSMinVersion-PhoneGapBuild-Plugin

A PhoneGap Build plugin for overriding the minimal iOS version to deploy your app on.
1
star
88

iPadLandscapeEnabler-PhoneGapBuild-Plugin

1
star
89

mgggplus-frontend

Mobile client
JavaScript
1
star
90

nativescript-socket-mobile

1
star
91

Karma-App

JavaScript
1
star
92

nativescript-mapbox-vision

This is just a test, please ignore this repo for now 😊
TypeScript
1
star
93

cordova-and-nativescript-pokemon-app

Showing how to create a similar app in both Cordova and NativeScript, using plugins for SocialSharing and NetworkInformation.
TypeScript
1
star