Spread the love
  •  
  •  
  •  
  •  
  •  
  •  
  •  
  •  

Ada kalanya kita perlu mengimplementasikan autentikasi berupa sidik jari (fingerprint) dalam aplikasi yang kita kembangkan. Dalam flutter implementasi sidik jari dapat dengan mudah digunakan. Tersedia plugin yang di maintain langsung oleh tim Flutter sendiri. Plugin yang kita gunakan adalah local_auth.

Untuk mulai mengimplementasikan :

  • Tambah plugin local_auth dalam pubspec.yaml

dependencies:
local_auth: “^0.0.1”

  • Lalu pada flutter, membuat file yang akan menampilkan scan fingerprint berupa popup :
import 'package:local_auth/local_auth.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

class AuthorizePage extends StatefulWidget {
  @override
  _AuthorizePageState createState() =>_AuthorizePageState();
}

class _AuthorizePageState extends State<AuthorizePage> {
  final LocalAuthentication localAuth = LocalAuthentication();
  bool _canCheckBiometric = false;
  String _authorizeText = 'Not Authorized!';

  List availableBiometrics = List();

  Future _authorize() async {
    bool _isAuthorized = false;
    try {
      _isAuthorized = await localAuth.authenticateWithBiometrics(
        localizedReason: 'Please authenticate to Complete this process',
        useErrorDialogs: true,
        stickyAuth: true,
      );
    } on PlatformException catch (e) {
      print(e);
    }

    if (!mounted) return;

    setState(() {
      if (_isAuthorized) {
        _authorizeText = "Authorized Successfully!";
      } else {
        _authorizeText = "Not Authorized!";
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('Touch ID Auth Example')),
      body: Center(
          child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Padding(
            padding: const EdgeInsets.all(8.0),
            child: Text(_authorizeText),
          ),
          RaisedButton(
            child: Text('Authorize'),
            color: Colors.red,
            onPressed: _authorize,
          )
        ],
      )),
    );
  }
}

Integrasi Android

Untuk dapat berjalan di android, kita perlu mengubah/menambah beberapa :

Tambahkan permission untuk mengakses fingerprint pada AndroidManifest.xml

<uses-permission android:name=android.permission.USE_FINGERPRINT/>

Selanjutnya ubah file MainActivity.java atau MainActivity.kt yang berada di struktur project android dengan mengubah implementasinya dari FlutterActivity ke FlutterFragmentActivity, seperti :

import android.os.Bundle;
import io.flutter.app.FlutterFragmentActivity;
import io.flutter.plugins.GeneratedPluginRegistrant;

public class MainActivity extends FlutterFragmentActivity {
 Override
 protected void onCreate(Bundle savedInstanceState) {
   super.onCreate(savedInstanceState);
   GeneratedPluginRegistrant.registerWith(this);
}

Integrasi di iOS

Sementara untuk di ios diperlukan permission juga ke dalam file info.plist berupa :

NSFaceIDUsageDescription
Why is my app authenticating using face id?

maka akan menampilkan seperti ini :

Related Posts
Push Notification di Flutter untuk Android Menggunakan Firebase Cloud Messaging (FCM)

Untuk mengimplementasikan push notification di flutter salah satunya dapat menggunakan firebase cloud messaging (FCM). Sudah tersedia library firebase pada flutter Read more

Flutter Swiper : Membuat Image / Layout Slider di Flutter

Flutter menawarkan lebih dari satu pilihan package untuk membuat image / layout slider yang bisa diimplementasikan di android dan iOS. Read more

Menambahkan OnChange Event Pada TextField di Flutter

Ada kalanya dalam aplikasi kita perlu menjalankan fungsi secara langsung tanpa enter atau tombol ketika user mengetikkan teks di textfield. Read more

Melakukan Migrasi Flutter Menggunakan AndroidX

Dalam mengembangkan aplikasi android, AndroidX merupakan peningkatan besar dari Android dalam penerapan Library Support. Dalam mengembangkan aplikasi flutter, seringkali kita Read more

Tagged : #

Leave a Reply

Your email address will not be published. Required fields are marked *