Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationEventAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
61
Help us understand the problem. What is going on with this article?

More than 1 year has passed since last update.

@coka__01

Flutterで顔認証/指紋認証を簡単に実装する

Flutter | GW アドベントカレンダーの5日目の記事です。

顔認証/指紋認証を実装するために、Flutter公式のlocal_authプラグインを使用します。

完成形

以下のような感じで、顔認証/指紋認証を実装します。

顔認証

face.png

指紋認証

touch.png

Android

android_touch.png

顔認証/指紋認証の実装

1. プラグインとの紐付け

pubspec.yaml
dependencies:
  local_auth: ^0.4.0+1    // 追加

バージョンについては、local_authを参照してください。

2. 生体認証設定

iOSとAndroid側で以下を追加して、生体認証を行えるようにします。

iOS

info.plist
<key>NSFaceIDUsageDescription</key>
<string>Why is my app authenticating using face id?</string>

Android

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

顔認証/指紋認証の実装

main.dart
  import 'package:local_auth/local_auth.dart';
端末の可能な生体認証タイプを取得
main.dart
  LocalAuthentication _localAuth = LocalAuthentication();

  Future<List<BiometricType>> _getAvailableBiometricTypes() async {
    List<BiometricType> availableBiometricTypes;
    try {
      availableBiometricTypes = await _localAuth.getAvailableBiometrics();
    } on PlatformException catch (e) {
      // TODO
    }
    return availableBiometricTypes;
  }
生体認証を要求
main.dart
  Future<bool> _authenticate() async {
    bool result = false;

    List<BiometricType> availableBiometricTypes = await _getAvailableBiometricTypes();

    try {
      if (availableBiometricTypes.contains(BiometricType.face)
          || availableBiometricTypes.contains(BiometricType.fingerprint)) {
        result = await _localAuth.authenticateWithBiometrics(localizedReason: "認証してください");
      }
    } on PlatformException catch (e) {
      // TODO
    }
    return result;
  }

指紋/顔を登録していない場合の挙動は?

以下のように、登録を促すダイアログを自動的に表示してくれます。
ここで、顔や指紋を登録せずに「OK」ボタンを押された際には、認証結果がfalseで返ってきます。

touch_setting.png

Android

android_touch_setting.png

まとめ

local_authプラグインを実装しているだけです。
指紋認証も顔認証もかなり簡単に実装できてしまいます。
念のため、githubにプロジェクトおいています
Flutterつよし!!!!

61
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
61
Help us understand the problem. What is going on with this article?