Flutter原生认证插件native_auth的使用

发布于 1周前 作者 vueper 来自 Flutter

Flutter原生认证插件native_auth的使用

native_auth 是一个用于在Flutter应用中集成设备生物识别系统的插件,支持Android和iOS平台。通过这个插件,开发者可以轻松地利用FaceID、TouchID或指纹识别来增强应用的安全性。

如何使用

首先,在你的Dart文件顶部导入 native_auth 包:

import 'package:native_auth/native_auth.dart';

然后你可以调用 Auth.isAuthenticate() 方法来进行生物识别认证,并根据返回的结果采取相应行动。下面是一个简单的例子:

final response = await Auth.isAuthenticate();
print(response.isAuthenticated); // true or false

这里 response 是一个枚举类型 AuthResult 的实例,包含三种可能的状态:

  • auth: 用户已成功通过认证。
  • noAuth: 用户未通过认证。
  • error: 无法请求任何生物识别信息(例如用户没有设置指纹或面部识别)。

示例代码

下面是一个完整的示例程序,演示了如何在Flutter应用中使用 native_auth 插件进行生物识别认证:

import 'dart:developer';
import 'package:flutter/material.dart';
import 'package:native_auth/native_auth.dart';

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

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return const MaterialApp(
      title: 'Flutter Demo',
      home: HomePage(),
    );
  }
}

class HomePage extends StatefulWidget {
  const HomePage({super.key});

  @override
  createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {
  String valueAuth = "No initialized";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: const Text("Auth")),
      bottomNavigationBar: buttonAuth(),
      body: Center(child: Text(valueAuth)),
    );
  }

  Widget buttonAuth() {
    return SafeArea(
      child: Padding(
        padding: const EdgeInsets.symmetric(horizontal: 20),
        child: ElevatedButton(onPressed: auth, child: const Text("Auth me")),
      ),
    );
  }

  Future<void> auth() async {
    final response = await Auth.isAuthenticate();
    log('is authenticated: ${response.isAuthenticated}');
    setState(() {
      valueAuth = response.toString();
    });
  }
}

在这个例子中,当用户点击“Auth me”按钮时,将触发 auth 函数执行生物识别认证过程,并更新界面上显示的认证状态。

平台配置

iOS集成

为了使iOS设备能够正常使用Face ID功能,请确保在项目的 Info.plist 文件中添加以下权限说明:

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

Android集成

对于Android设备,你需要在 AndroidManifest.xml 文件中声明使用指纹识别的权限:

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
 package="com.example.app">
  <uses-permission android:name="android.permission.USE_BIOMETRIC"/>
</manifest>

同时还需要修改 MainActivity.kt 或者 MainActivity.java 文件,继承自 FlutterFragmentActivity 类,以确保Flutter视图正确加载:

// MainActivity.kt
import io.flutter.embedding.android.FlutterFragmentActivity

class MainActivity: FlutterFragmentActivity() {
    // ...
}

// OR

// MainActivity.java
import io.flutter.embedding.android.FlutterFragmentActivity;

public class MainActivity extends FlutterFragmentActivity {
    // ...
}

这样就完成了对 native_auth 插件的基本配置与使用介绍。希望这些信息能帮助你在自己的项目中顺利实现生物识别认证功能!


更多关于Flutter原生认证插件native_auth的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter原生认证插件native_auth的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


当然,下面是一个关于如何在Flutter项目中使用native_auth插件进行原生认证的示例代码。native_auth插件通常用于访问设备的原生认证功能,比如Touch ID、Face ID等。不过,请注意,实际使用时,插件的具体方法和API可能会根据插件版本和设备的不同而有所变化。

首先,确保你已经在pubspec.yaml文件中添加了native_auth依赖:

dependencies:
  flutter:
    sdk: flutter
  native_auth: ^x.y.z  # 请替换为实际的版本号

然后,运行flutter pub get来安装依赖。

接下来,在你的Flutter项目中,你可以使用以下代码来实现原生认证功能:

1. 导入插件

在你的Dart文件中(例如main.dart),首先导入native_auth插件:

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

2. 配置权限

对于iOS,你需要在Info.plist中添加适当的权限,例如NSFaceIDUsageDescriptionNSAppleMusicUsageDescription(如果需要)。

对于Android,你需要在AndroidManifest.xml中添加适当的权限。不过,对于生物识别认证,通常不需要额外的权限声明,但你可能需要确保应用具有适当的签名和配置。

3. 实现认证逻辑

以下是一个简单的示例,展示了如何使用native_auth插件进行认证:

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: AuthScreen(),
    );
  }
}

class AuthScreen extends StatefulWidget {
  @override
  _AuthScreenState createState() => _AuthScreenState();
}

class _AuthScreenState extends State<AuthScreen> {
  String _result = "Press the button to authenticate...";

  void _authenticate() async {
    try {
      bool isAuthenticated = await NativeAuth.authenticate();
      setState(() {
        _result = isAuthenticated ? "Authenticated successfully!" : "Authentication failed.";
      });
    } catch (e) {
      setState(() {
        _result = "Error: ${e.message}";
      });
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Native Authentication Example"),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Text(_result),
            SizedBox(height: 20),
            ElevatedButton(
              onPressed: _authenticate,
              child: Text("Authenticate"),
            ),
          ],
        ),
      ),
    );
  }
}

在这个示例中,我们创建了一个简单的Flutter应用,其中包含一个按钮和一个文本显示区域。当用户点击按钮时,将调用_authenticate方法,该方法使用NativeAuth.authenticate()来尝试进行原生认证。认证结果将更新到文本显示区域。

注意事项

  1. 插件版本:确保你使用的是最新版本的native_auth插件,因为插件的API可能会随着版本的更新而变化。
  2. 错误处理:在实际应用中,你可能需要更详细的错误处理逻辑,以处理各种可能的异常情况。
  3. 平台特定配置:对于iOS和Android,你可能需要进行一些平台特定的配置,以确保插件能够正常工作。

希望这个示例能帮你更好地理解如何在Flutter项目中使用native_auth插件进行原生认证。如果你遇到任何问题或需要进一步的帮助,请随时提问。

回到顶部