local_authの生体認証を使ってみる。
17725 ワード
はじめに
今回はFlutterのパッケージであるlocal_authを使用して生体認証を実装してみたいと思います。
今回使用しているバージョンは以下の通りです。
- Flutter 2.10.4
- Dart 2.16.2
- local_auth 2.0.0
- hooks_riverpod: ^1.0.3
インストール
pubspec.yaml
dependencies:
local_auth: ^2.0.0 //追加
基本設定
iOSの設定
以下の設定を追加します。
Info.plist
<key>NSFaceIDUsageDescription</key>
<string>生体認証を使用する目的を記述</string>
Androidの設定
以下のコードを追加します。
MainActivity.kt
import io.flutter.embedding.android.FlutterFragmentActivity
import io.flutter.embedding.engine.FlutterEngine
import io.flutter.plugins.GeneratedPluginRegistrant
class MainActivity: FlutterFragmentActivity() {
override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
GeneratedPluginRegistrant.registerWith(flutterEngine)
}
}
AndroidManifest.xml
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="com.example.app">
<uses-permission android:name="android.permission.USE_FINGERPRINT"/> //追加
<manifest>
コントローラーの作成
以下のように生体認証のメソッドを持つコントローラーを作成します。
※riverpodを使用しています。
auth_controller.dart
import 'package:hooks_riverpod/hooks_riverpod.dart';
import 'package:local_auth/local_auth.dart';
final localAuthenticationProvider = Provider<LocalAuthentication>(
(ref) => LocalAuthentication(),
);
final authControllerProvider = Provider<AuthControllerProvider>(
(ref) => AuthControllerProvider(ref.read),
);
class AuthControllerProvider {
AuthControllerProvider(this._read);
final Reader _read;
LocalAuthentication get _auth => _read(localAuthenticationProvider);
Future<bool> get canCheckBiometrics => _auth.canCheckBiometrics;
Future<bool> didAuthenticate() async {
final availableBiometrics = await _auth.getAvailableBiometrics();
var result = false;
if (availableBiometrics.contains(BiometricType.face) ||
availableBiometrics.contains(BiometricType.fingerprint)) {
result = await _auth.authenticate(
localizedReason: 'Please authenticate to show account balance',
options: const AuthenticationOptions(
useErrorDialogs: true,
stickyAuth: true,
biometricOnly: true,
),
);
}
return result;
}
}
メソッドの詳細
端末に利用可能な生体認証が搭載されているかどうかを確認するメソッド。
//参考: final localAuth = LocalAuthentication();
bool canCheckBiometrics = await localAuth.canCheckBiometrics
利用可能な生体認証の種類(顔認証、指紋認証)を取得するメソッド。
//参考: final auth = LocalAuthentication()
List<BiometricsType> availableBiometrics = await auth.getAvailableBiometrics();
//BiometricsTypeは生体認証が利用可能であれば、BiometricsType.faceかBiometricsType.fingerprintを返す
//どれも使用できない場合は空の配列を返す
認証を実行するメソッド。
//参考: final localAuth = LocalAuthentication();
bool didAuthenticate = await localAuth.authenticate(
localizedReason: ‘認証を実行してください。’,
//optionで指定 biometricsOnly: true, 生体認証のみを利用する場合trueにする。
);
生体認証を実行する
先ほど定義したメソッドを呼び出します。呼び出すことで生体認証を実行することができます。
home_page.dart
class HomePage extends ConsumerWidget {
const HomePage({Key? key}) : super(key: key);
Widget build(BuildContext context, WidgetRef ref) {
return Scaffold(
appBar: AppBar(
title: const Text('local_auth'),
),
body: Center(
child: ElevatedButton(
onPressed: () async {
//生体認証を実行
await ref.read(authControllerProvider).didAuthenticate();
},
child: const Text('生体認証'),
),
),
);
}
}
終わりに
記事の中で誤った情報などがあればコメントで指摘していただけますと幸いです。よろしくお願いいたします。
Author And Source
この問題について(local_authの生体認証を使ってみる。), 我々は、より多くの情報をここで見つけました https://zenn.dev/nakaken/articles/0589fe47d647a0著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Collection and Share based on the CC protocol