Biometric Authentication dengan Flutter

Rizki Maulana
Dec 14, 2018 · 3 min read

Image from https://support.apple.com/en-us/HT208109

Pada post kali ini kita akan membahas mengenai penggunaan Biomteric Authentication
dengan menggunakan Flutter.

Biometric authentication yang akan kita bahas meliputi fingerprint Android atau Touch ID
pada iOS dan Face ID yang digunakan oleh seri iPhone X .
Autentikasi Fingerprint dengan Flutter pada Android

Flutter sendiri sudah menyediakan library untuk autentikasi dengan integrasi yang sudah
sangat bagus, tanpa harus melakukan banyak setting manual pada masing-masing platform
(iOS dan Android). Ok, show me the code.
Autentikasi Face ID dengan Flutter pada iPhone X

Saya asumsikan kita sudah membuat sebuah project baru flutter, kemudian kita tambahakan
librari local_auth pada pubspec.yaml project kita.

Kita akan melakukan modifikasi pada halaman counter app yang merupakan default app yang
di generate oleh flutter ketika pertama kali membuat project flutter. Buka main.dart
kemudian modifikasi method build seperti dibawah ini

Jalankan code, pastikan tampilannya sudah berubah seperti ini.

Skenarionya adalah ketika user melakukan tap pada FAB maka akan menjalankan Biometric
Auth yang sudah di setting oleh user, baik itu fingerprint atau face recognition.
Selanjutnya buat sebuah method bernama _auth, yang sebelumnya sudah kita panggil pada
atribut onPress milik FAB.

Kemudian buat method baru bernama _startBioMetricAuth

Variable didAuthenticate adalah variable yang menampung data async ketika menjalankan
biometric recognition, bernilai true apabila user berhasil melakukan autentikasi, dan false
apabila gagal atau di batalkan oleh user, sehingga kita dapat melakukan action selanjutnya
ketika user berhasil melakukan autentikasi. Pada code diatas action selanjutnya adalah
memberitahu user bahwa autentikasi berhasil atau gagal.

Pada method auth.authenticateWithBiometrics terdapat parameter localizedReason,

parameter ini akan dimunculkan sebagai pesan kepada user ketika dialog biometric auth di
tampilkan.
Pesan pada biometric auth dialog

Kemudian untuk menjalankan pada Android kita harus menambahkan permission untuk
menggunakan fitur fingerprint pada AndroidManifest.xml. buka folde android -> app ->
src -> main kemudian buka AndroidManifest.xml tambahkan line berikut dibawah
permission internet :

Sedangkan untuk menjalankan pada iOS kita perlu menambahkan line pada info.plist. Buka
folder ios -> Runner kemudian tambahkan line berikut :

Pada tag string dapat kita modifikasi dengan pesan sendiri, pesan tersebut akan dimunculkan
ketika aplikasi menampilkan dialog untuk meminta permission user untuk menggunakan fitur
Touch ID / Face ID.

Untuk mencoba Face ID dibutuhkan simulator seri iPhone X, kemudian pilih menu
Hardware -> Face ID kemudian pilih Enrolled untuk mengaktifkan fitur Face ID pada
simulator.

Sekian :)

Tulisan lain tentang Flutter :

https://medium.com/@almaulanarizki/membangun-landing-page-aplikasi-go-jek-dengan-
flutter-sdk-bagian-1-3-531d0cd537db