In this blog, we will implement biometric authentication in a Flutter app using the local_auth package. We’ll cover both fingerprint and face recognition, ensuring that your app provides a high level of security while maintaining user convenience.

If you’re looking for the best Flutter app development company for your mobile application then feel free to contact us at — support@flutterdevs.com.

Table of contents

Introduction

What is Biometric Authentication?

Why Use Biometric Authentication in Your Flutter App?

How Flutter & local_auth Package Enable Biometric Authentication

Prerequisites

Steps to Follow

Benefits of Biometric Authentication

Drawbacks of Biometric Authentication

Enhancing Security in Biometric Authentication

Best Practices for Biometric Authentication

Conclusion

References

Introduction

In today’s digital world, security and convenience go hand in hand. Traditional authentication methods like passwords and PINs are prone to security threats such as phishing and brute-force attacks. Biometric authentication, such as fingerprint and face recognition, provides a seamless and secure way to log in to apps, ensuring that only the rightful user gains access.

With biometric authentication, users can log in faster without remembering complex passwords. This method leverages the unique biological traits of individuals, making unauthorized access significantly more difficult. Additionally, it enhances the user experience by offering a smooth and hassle-free authentication process.

Biometric authentication, such as fingerprint and face recognition, provides a seamless and secure way to log in to apps. In this blog, we will implement biometric authentication in a Flutter app using the local_auth package.

What is Biometric Authentication?

Biometric authentication leverages a person’s unique biological characteristics (like fingerprints, face recognition, or even iris scans) to verify their identity. It’s widely used in smartphones for locking screens, securing apps, and even making payments. The main advantage is that biometrics cannot be easily replicated or stolen, making them a reliable method of securing mobile apps.

Why Use Biometric Authentication in Your Flutter App?

1. Enhanced Security:

• Unmatched accuracy: Biometric authentication systems have a very low false acceptance rate, making it highly secure compared to other methods like passwords.
• Hard to replicate: Unlike passwords or PIN codes, which can be stolen or guessed, biometric data is unique to each individual, making it nearly impossible to impersonate.

2. Convenience:

• Quick and seamless: Biometric authentication is much faster than typing in a password, reducing friction for users.
• No need to remember passwords: Users no longer need to remember multiple passwords or PIN codes, making the experience more user-friendly.

3. Improved User Experience:

• Easy access: With the ability to authenticate using facial recognition or a fingerprint scan, users can access the app in seconds, improving overall satisfaction.
• Modern technology: Biometric authentication provides a sleek, modern touch that aligns with users’ expectations for convenience and cutting-edge tech.

4. Compliance and Privacy:

• Biometric authentication enhances privacy and meets the growing demand for secure methods to access sensitive data, which is particularly important for industries such as banking, healthcare, and government services.

How Flutter & local_auth Package Enable Biometric Authentication

Flutter, being a cross-platform framework, allows you to write code once and run it on both Android and iOS devices. When it comes to biometric authentication, the Flutter ecosystem provides excellent tools to streamline integration.

The key package that enables biometric authentication in Flutter is local_auth. This plugin supports fingerprint scanning, face recognition, and other biometric methods that are supported by both Android and iOS devices. Whether you’re developing an app for smartphones, tablets, or even wearables, the local_auth package can help implement secure biometric authentication with minimal effort.

Here’s why the local_auth the package is so effective:

1. Cross-Platform Support:

• The local_auth the package works seamlessly across both Android and iOS platforms. It abstracts platform-specific implementations, making it easy for developers to use biometric authentication without worrying about the complexities of each platform’s native APIs.

2. Comprehensive Biometric Authentication:

• The plugin supports various forms of biometric data on both platforms. On Android, it works with fingerprint recognition, and on iOS, it supports both Touch ID and Face ID, making it flexible for different devices and scenarios.

3. Device Compatibility:

• The local_auth package detects whether the device has biometric authentication capabilities, such as a fingerprint scanner or a face recognition system. It then makes sure that the appropriate authentication method is used based on the device’s capabilities.

4. Security and Privacy:

• The plugin integrates with secure hardware on the device, such as the Secure Enclave on iPhones or Trusted Execution Environment (TEE) on Android devices. This means that biometric data is never stored on the device or in the cloud, and only authentication tokens are passed between the app and the device.

5. Simple API:

• local_auth provides an intuitive API that allows developers to easily check for biometric availability, prompt for authentication, and handle success or failure cases—all without needing to write complex platform-specific code.

Prerequisites

Before getting started, ensure you have:

• Flutter installed
• An Android or iOS device with biometric authentication support
• A Flutter project setup

Let’s walk through how to integrate biometric authentication in your Flutter app.

Steps to Follow 

Step 1: Add Dependencies

Add the local_auth package to your pubspec.yaml

dependencies:
  flutter:
    sdk: flutter
  local_auth: ^2.1.6

Run:

flutter pub get

Step 2: Configure Android & iOS Permissions

Android

Modify android/app/src/main/AndroidManifest.xml:

<manifest>
    <uses-permission android:name="android.permission.USE_BIOMETRIC" />
    <uses-permission android:name="android.permission.USE_FINGERPRINT" />
    <uses-feature android:name="android.hardware.fingerprint" android:required="false"/>

    <application>
        <meta-data
            android:name="androidx.biometric.AuthenticatorType"
            android:value="BIOMETRIC_STRONG | DEVICE_CREDENTIAL" />
    </application>
</manifest>

iOS

Modify ios/Runner/Info.plist:

<key>NSFaceIDUsageDescription</key>
<string>We need access to Face ID for authentication</string>

Step 3: Implement Biometric Authentication

Create a new Dart file biometric_auth.dart:

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

class BiometricAuth {
  final LocalAuthentication auth = LocalAuthentication();

  Future<bool> isBiometricAvailable() async {
    return await auth.canCheckBiometrics || await auth.isDeviceSupported();
  }

  Future<bool> authenticateUser() async {
    try {
      return await auth.authenticate(
        localizedReason: 'Authenticate to access the app',
        options: const AuthenticationOptions(
          stickyAuth: true,
          biometricOnly: true,
        ),
      );
    } catch (e) {
      print("Error: $e");
      return false;
    }
  }
}

Step 4: Integrate Authentication in UI

Modify main.dart:

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

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

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

class LoginScreen extends StatefulWidget {
  @override
  _LoginScreenState createState() => _LoginScreenState();
}

class _LoginScreenState extends State<LoginScreen> {
  final BiometricAuth biometricAuth = BiometricAuth();

  void _loginWithBiometrics() async {
    bool isAuthenticated = await biometricAuth.authenticateUser();
    if (isAuthenticated) {
      Navigator.push(
        context,
        MaterialPageRoute(builder: (context) => HomeScreen()),
      );
    } else {
      ScaffoldMessenger.of(context).showSnackBar(
        SnackBar(content: Text("Authentication failed")),
      );
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Login")),
      body: Center(
        child: ElevatedButton(
          onPressed: _loginWithBiometrics,
          child: Text("Login with Biometrics"),
        ),
      ),
    );
  }
}

class HomeScreen extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Home")),
      body: Center(child: Text("Welcome to Home Screen!")),
    );
  }
}

Step 5: Test the Application

Run the app on a real device:

flutter run

If everything is set up correctly, you should be able to authenticate using face or fingerprint recognition.

Benefits of Biometric Authentication

• Enhanced Security: Biometrics are harder to forge compared to passwords.
• Convenience: Users can log in quickly without remembering passwords.
• User Experience: Reduces friction in authentication, making the app more user-friendly.
• Device-Level Protection: Uses built-in security mechanisms of the device.

Drawbacks of Biometric Authentication

• Device Dependency: Not all devices support biometrics.
• Privacy Concerns: Storing biometric data raises security and privacy risks.
• False Positives/Negatives: Recognition systems are not 100% accurate.
• Physical Restrictions: Injuries or facial obstructions can prevent authentication.

Enhancing Security in Biometric Authentication

To make biometric login even more secure, consider implementing the following best practices:

• Multi-Factor Authentication (MFA): Combine biometrics with a secondary factor like a PIN or OTP.
• Secure Storage: Store authentication tokens securely using Flutter Secure Storage or Encrypted Shared Preferences.
• Liveness Detection: Ensure that face unlock cannot be fooled by photos or videos.
• Biometric Strength Check: Use only strong biometric methods (e.g., Face ID, high-quality fingerprint sensors).
• Session Timeout: Implement automatic logout after inactivity.
• Server-Side Verification: For critical actions, use backend validation to verify the user’s identity.

Best Practices for Biometric Authentication

1. Fallback Mechanism: Always provide an alternative authentication method in case biometrics fail (e.g., PIN or password).
2. Security: Never store biometric data directly. Let the OS handle biometric verification, and only store tokens or authentication results.
3. User Experience: Make sure the authentication process is clear and the user is informed of what they need to do (e.g., “Place your finger on the sensor”).

Conclusion

Biometric authentication provides an easy-to-use, secure, and fast method to verify users in your Flutter app. By leveraging the local_auth package, you can integrate both fingerprint and face recognition in a few simple steps. Not only will this improve your app’s security, but it will also create a frictionless user experience.

With the growing importance of privacy and security, adopting biometric authentication in your Flutter app is a great way to keep your users’ data safe and provide them with the convenience they expect.

❤ ❤ Thanks for reading this article ❤❤

If I got something wrong? Let me know in the comments. I would love to improve.

Clap 👏 If this article helps you.

References:

Unlocking Secure Authentication: A Guide to Adding Biometric Authentication to Flutter Apps
Learn how to integrate biometric authentication into your Flutter app, enhancing user experience and security. Discover…30dayscoding.com

How to Integrate Device Fingerprinting Into Your Flutter Application
Secure your app with device fingerprinting to block threats. Integrate it into Flutter using Fingerprint’s SDKs.fingerprint.com

From Our Parent Company Aeologic

Aeologic Technologies is a leading AI-driven digital transformation company in India, helping businesses unlock growth with AI automation, IoT solutions, and custom web & mobile app development. We also specialize in AIDC solutions and technical manpower augmentation, offering end-to-end support from strategy and design to deployment and optimization.

Trusted across industries like manufacturing, healthcare, logistics, BFSI, and smart cities, Aeologic combines innovation with deep industry expertise to deliver future-ready solutions.

Feel free to connect with us:
And read more articles from FlutterDevs.com.

FlutterDevs team of Flutter developers to build high-quality and functionally-rich apps. Hire a Flutter developer for your cross-platform Flutter mobile app project on an hourly or full-time basis as per your requirement! For any flutter-related queries, you can connect with us on Facebook, GitHub, Twitter, and LinkedIn.

We welcome feedback and hope that you share what you’re working on using #FlutterDevs. We truly enjoy seeing how you use Flutter to build beautiful, interactive web experiences.

GraphQL can fetch only the data that is needed, GraphQL has become extremely popular in modern app development. It can improve your app’s efficiency and performance when used in conjunction with Flutter, a leading cross-platform development framework.

This article will explore GraphQL With HTTP In Flutter. We will learn how to execute a demo program and how to implement graphql with HTTP using the HTTP package in your Flutter applications.

For Http:

http | Dart package
A composable, multi-platform, Future-based API for HTTP requests.pub.dev

If you’re looking for the best Flutter app development company for your mobile application then feel free to contact us at — support@flutterdevs.com.

Table Of Contents::

What is GraphQL?

Implementation

GraphQL Operations

GraphQL Query with HTTP

GraphQL Mutations

Error Handling

Conclusion

What is GraphQL?:

GraphQL is an open-source query language developed by Facebook. By allowing clients to request only the data they require, GraphQL provides a more dynamic and effective method of interacting with APIs than REST APIs. Applications become more effective as a result of this reduction in data over- or under-fetching.

Implementation:

Step 1: Add the dependencies

Add dependencies to pubspec — yaml file.

dependencies:
  flutter:
    sdk: flutter
  http: ^1.3.0

Step 2: Import

import 'package:http/http.dart';

Step 3: Run flutter packages get in the root directory of your app.

GraphQL Operations:

There are two main operations GraphQL works:

• Query: Retrieve data.
• Mutation: Change data.

Every operation is organized as a query that resembles JSON, but it defines the required data using a particular syntax.

GraphQL Query with HTTP:

Here’s how to put this into implementing Flutter:

import 'dart:convert';
import 'package:http/http.dart' as http;

Future<void> fetchUsers() async {
  const String graphqlEndpoint = 'https://www.example.com/graphql';
  const String query = '''
  query {
    users {
      id
      name
      email
    }
  }
  ''';

  final response = await http.post(
    Uri.parse(graphqlEndpoint),
    headers: {'Content-Type': 'application/json'},
    body: jsonEncode({'query': query}),
  );

  if (response.statusCode == 200) {
    final data = jsonDecode(response.body);
    print(data['data']['users']);
  } else {
    throw Exception('Failed to fetch users');
  }
}

GraphQL Mutations:

You can change the data on the server through mutations. To create a new user, for instance:

Future<void> createUser(String name, String email) async {
  const String graphqlEndpoint = 'https://example.com/graphql';
  const String mutation = '''
  mutation(\$name: String!, \$email: String!) {
    createUser(input: { name: \$name, email: \$email }) {
      id
      name
      email
    }
  }
  ''';

  final variables = {'name': name, 'email': email};

  final response = await http.post(
    Uri.parse(graphqlEndpoint),
    headers: {'Content-Type': 'application/json'},
    body: jsonEncode({'query': mutation, 'variables': variables}),
  );

  if (response.statusCode == 200) {
    final data = jsonDecode(response.body);
    print(data['data']['createUser']); // Access the created user data
  } else {
    throw Exception('Failed to create user');
  }
}

Error Handling:

An error field is frequently included in GraphQL response. To deal with mistakes:

final responseBody = jsonDecode(response.body);
if (responseBody['errors'] != null) {
print('GraphQL Error: ${responseBody['errors']}');
} else {
print('Data: ${responseBody['data']}');
}

Conclusion:

In the article, I have explained GraphQL With HTTP in a flutter; you can modify this code according to your choice. This was a small introduction to GraphQL With HTTP In Flutter On User Interaction from my side, and it’s working using Flutter.

I hope this blog will provide you with sufficient information on Trying the GraphQL With HTTP in your Flutter projects. We will show you what the Introduction is. Make a demo program for working on GraphQL With HTTP using the HTTP package in your Flutter applications. So please try it.

❤ ❤ Thanks for reading this article ❤❤

If I got something wrong? Let me know in the comments. I would love to improve.

Clap 👏 If this article helps you.

From Our Parent Company Aeologic

Aeologic Technologies is a leading AI-driven digital transformation company in India, helping businesses unlock growth with AI automation, IoT solutions, and custom web & mobile app development. We also specialize in AIDC solutions and technical manpower augmentation, offering end-to-end support from strategy and design to deployment and optimization.

Trusted across industries like manufacturing, healthcare, logistics, BFSI, and smart cities, Aeologic combines innovation with deep industry expertise to deliver future-ready solutions.

Feel free to connect with us:
And read more articles from FlutterDevs.com.

FlutterDevs team of Flutter developers to build high-quality and functionally-rich apps. Hire a Flutter developer for your cross-platform Flutter mobile app project on an hourly or full-time basis as per your requirement! For any flutter-related queries, you can connect with us on Facebook, GitHub, Twitter, and LinkedIn.

We welcome feedback and hope that you share what you’re working on using #FlutterDevs. We truly enjoy seeing how you use Flutter to build beautiful, interactive web experiences.

Related: Implement GraphQL with Flutter