在这里插入图片描述

在用户体验方面,我们最常发现的是安卓手机有指纹认证,iPhone有面部识别。

让我解释一下幕后发生的主要情况。当用户在第一次登录/注册后决定使用上述方法激活认证时,他/她实际上是在说把我的登录凭证保存在本地主机中,没有注册指纹和脸部识别的人无法访问。因此,当用户登录并决定使用此方法时,它基本上会从本地存储的位置获取登录凭据。

在这篇文章中,我将向你展示如何访问设备,并验证其收到的作为输入的指纹或面部识别是否在设备上注册。

开始

使用以 flutter create your_app_name 命令创建一个新项目

在您喜欢的文本编辑器上打开文件夹并打开 lib 文件夹中的 main.dart 并将代码替换为

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
      	primarySwatch: Colors.blue,
    	),
			home: MyHomePage(),	
		);
	}
}

class MyHomePage extends StatefulWidget {
  
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
      	child: Text(""),
    	),
      floatingActionButton: FloatingActionButton(
      	onPressed: null,
      	child: Icon(Icons.add),
  		),
		);
	}
}

与往常一样,由于 Flutter 是一个开源框架,并且社区一直非常积极地通过不同的构建包来帮助使开发变得简单快捷。
为了归档本文的目的,你需要将local_auth包安装到你刚刚创建的应用程序中。打开你的pubspec.yaml,在你的依赖关系中添加以下一行代码

local_auth: ^0.6.3+2

并在 main.dart 顶部导入

import 'package:local_auth/local_auth.dart';

包设置

由于您将要与 android 组件进行通信,因此您必须请求设备以获取使用指纹功能的权限。

为此,进入 android > app > src > main 打开 AndroidManifest.xml 并在 <application 标签上方添加以下代码行:

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

最后一句。

然后,在主文件夹中,进入 kotlin > com > examples > your_app_name 并打开 MainActivity.kt 并替换为以下代码:

package com.example.your_app_name

import androidx.annotation.NonNull;
import io.flutter.embedding.android.FlutterFragmentActivity
import io.flutter.embedding.engine.FlutterEngine
import io.flutter.plugins.GeneratedPluginRegistrant

class MainActivity: FlutterFragmentActivity() {
	override fun configureFlutterEngine(@NonNull flutterEngine: FlutterEngine) {
    	GeneratedPluginRegistrant.registerWith(flutterEngine);
    }
}

注意将每个 your_app_name 替换为您的应用程序的名称

第一步是检查设备是否有任何生物指标设置,为此你将创建一个 future 方法,它将返回 bool 值,并在 build 方法之前运行。在此之前,初始化 _MyHomePageState类中的以下变量:

final LocalAuthentication _localAuthentication = LocalAuthentication();
String _message = "Not Authorized";

_localAuthentication 是 local_auth 的实例化。

在初始化下方添加以下代码:

Future<bool> checkingForBioMetrics() async {
  bool canCheckBiometrics = await _localAuthentication.canCheckBiometrics;
  print(canCheckBiometrics);
  return canCheckBiometrics;
}

现在创建一个函数来实际验证用户并在屏幕上显示一条消息。在您的函数下方添加以下代码:

Future<void> _authenticateMe() async {
  // 8. 此方法会打开一个指纹验证对话框。
  //    我们不需要创建一个对话框,它可以从设备中自然弹出。
  bool authenticated = false;
  try {
    authenticated = await _localAuthentication.authenticateWithBiometrics(
      localizedReason: "Authenticate for Testing", // 消息对话框
      useErrorDialogs: true, // 在对话框中显示错误
      stickyAuth: true, // native process
    );
    setState(() {
    	_message = authenticated ? "Authorized" : "Not Authorized";
    });
  } catch (e) {
  	print(e);
  }
  if (!mounted) return;
}

之后,该函数创建了一个 init 函数,并在其中调用 checkingForBioMetrics 方法。


void initState() {
  // TODO: implement initState
  checkingForBioMetrics();
  super.initState();
}

是的,现在是更新用户界面的时候了,首先更新文本小部件。

Text("$_message")

然后在 FloatingActionButton 中使用 onPressed:

onPressed: _authenticateMe,

这时,你可以继续运行你的代码。

Logo

开源鸿蒙跨平台开发社区汇聚开发者与厂商,共建“一次开发,多端部署”的开源生态,致力于降低跨端开发门槛,推动万物智联创新。

更多推荐