Flutter教程实现指纹识别登录

在Flutter中实现指纹识别登录时，如何正确集成local_auth插件？我的应用总在调用authenticate()时返回"NotAvailable"错误，但手机明明支持指纹解锁。请问需要额外配置哪些权限？生物识别功能的兼容性该如何检测？另外，能否提供完整的代码示例，包括错误处理和fallback到密码登录的流程？iOS和Android平台的实现是否有差异？

3 回复

要在Flutter中实现指纹识别登录，首先确保你的设备支持指纹识别。使用local_auth插件。

  1. 添加依赖：在pubspec.yaml添加local_auth: ^2.1.0，然后运行flutter pub get。
  2. 初始化权限：请求指纹识别权限，在Android的AndroidManifest.xml添加<uses-permission android:name="android.permission.USE_FINGERPRINT" />。
  3. 编写代码：
import 'package:flutter/material.dart';
import 'package:local_auth/local_auth.dart';

class FingerprintLogin extends StatefulWidget {
  @override
  _FingerprintLoginState createState() => _FingerprintLoginState();
}

class _FingerprintLoginState extends State<FingerprintLogin> {
  final LocalAuthentication auth = LocalAuthentication();
  bool _isAvailable = false;

  Future<void> _checkBiometric() async {
    bool isAvailable = false;
    try {
      isAvailable = await auth.canCheckBiometrics;
    } catch (e) {
      print(e);
    }
    setState(() {
      _isAvailable = isAvailable;
    });
  }

  Future<void> _authenticate() async {
    bool isAuthenticated = false;
    try {
      isAuthenticated = await auth.authenticate(
        localizedReason: '请验证指纹以登录',
        options: const AuthenticationOptions(stickyAuth: true),
      );
    } catch (e) {
      print(e);
    }
    if (isAuthenticated) {
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('登录成功')));
    } else {
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('指纹验证失败')));
    }
  }

  @override
  void initState() {
    super.initState();
    _checkBiometric();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('指纹登录')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: _isAvailable ? _authenticate : null,
              child: Text(_isAvailable ? '指纹登录' : '不支持指纹识别'),
            ),
          ],
        ),
      ),
    );
  }
}
  1. 测试应用，点击按钮验证指纹即可完成登录功能。

更多关于Flutter教程实现指纹识别登录的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


要在Flutter中实现指纹识别登录，你需要使用local_auth插件。首先，在pubspec.yaml中添加依赖：

dependencies:
  local_auth: ^2.1.0

然后运行flutter pub get。

接着，编写代码实现指纹登录功能：

import 'package:flutter/material.dart';
import 'package:local_auth/local_auth.dart';

class FingerprintLogin extends StatefulWidget {
  @override
  _FingerprintLoginState createState() => _FingerprintLoginState();
}

class _FingerprintLoginState extends State<FingerprintLogin> {
  final LocalAuthentication auth = LocalAuthentication();
  bool _canCheckBiometrics = false;

  Future<void> _checkBiometric() async {
    bool canCheckBiometrics;
    try {
      canCheckBiometrics = await auth.canCheckBiometrics;
    } catch (e) {
      print(e);
    }
    setState(() {
      _canCheckBiometrics = canCheckBiometrics;
    });
  }

  Future<void> _authenticateUser() async {
    bool authenticated = false;
    try {
      authenticated = await auth.authenticate(
        localizedReason: '请验证指纹以继续',
        options: const AuthenticationOptions(stickyAuth: true),
      );
    } catch (e) {
      print(e);
    }
    if (authenticated) {
      // 登录成功逻辑
      ScaffoldMessenger.of(context).showSnackBar(SnackBar(content: Text('登录成功')));
    }
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        ElevatedButton(
          onPressed: _canCheckBiometrics ? _authenticateUser : null,
          child: Text(_canCheckBiometrics ? '指纹登录' : '检查设备支持'),
        ),
      ],
    );
  }
}

该代码首先检查设备是否支持指纹识别，如果支持则允许用户进行指纹验证。验证通过后可以执行登录操作。

Flutter指纹识别登录实现

Flutter中实现指纹识别登录可以使用local_auth插件。以下是完整实现步骤：

1. 添加依赖

在pubspec.yaml中添加：

dependencies:
  local_auth: ^2.1.5

然后运行flutter pub get

2. 配置权限

Android配置

在AndroidManifest.xml中添加：

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

iOS配置

在Info.plist中添加：

<key>NSFaceIDUsageDescription</key>
<string>我们需要您的指纹/面容ID来验证身份</string>

3. 实现代码

import 'package:flutter/material.dart';
import 'package:local_auth/local_auth.dart';

class FingerprintAuthPage extends StatefulWidget {
  @override
  _FingerprintAuthPageState createState() => _FingerprintAuthPageState();
}

class _FingerprintAuthPageState extends State<FingerprintAuthPage> {
  final LocalAuthentication _localAuth = LocalAuthentication();
  bool _isAuthenticated = false;

  Future<void> _authenticate() async {
    try {
      bool canCheckBiometrics = await _localAuth.canCheckBiometrics;
      
      if (!canCheckBiometrics) {
        throw Exception('设备不支持生物识别');
      }

      bool isAuthenticated = await _localAuth.authenticate(
        localizedReason: '请验证指纹以登录',
        options: const AuthenticationOptions(
          biometricOnly: true, // 仅使用生物识别
          useErrorDialogs: true, // 使用系统错误对话框
          stickyAuth: true, // 保持认证状态
        ),
      );

      setState(() {
        _isAuthenticated = isAuthenticated;
      });

      if (isAuthenticated) {
        // 认证成功，执行登录操作
        Navigator.pushReplacementNamed(context, '/home');
      }
    } catch (e) {
      print('认证失败: $e');
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text('指纹登录')),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            Icon(Icons.fingerprint, size: 100),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: _authenticate,
              child: Text('使用指纹登录'),
            ),
            SizedBox(height: 20),
            Text(_isAuthenticated ? '认证成功' : '等待认证...'),
          ],
        ),
      ),
    );
  }
}

4. 注意事项

  1. 测试时确保设备支持指纹识别并已录入指纹
  2. iOS模拟器不支持指纹测试，需要真机测试
  3. Android可能需要处理权限请求
  4. 考虑为不支持指纹的设备提供备选登录方式

这个实现提供了基本的指纹认证功能，你可以根据需要添加更多错误处理和用户引导。

回到顶部