Flutter简化登录流程插件flutter_easy_login的使用

flutter_easy_login 是一个用于简化认证流程的UI插件。它提供了以下功能：

• 使用邮箱和密码进行登录。
• 使用邮箱、姓名和密码进行注册。
• 提供密码重置功能。
• 可以与Firebase或自定义的身份验证服务一起使用。

特性

使用方法

以下是使用 flutter_easy_login 插件的基本步骤：

初始化

1. 在 main() 方法中添加以下语句（位于开头）：

   WidgetsFlutterBinding.ensureInitialized();
   

2. 如果你使用的是Firebase，则需要初始化Firebase：

   await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
   

3. 然后在 runApp() 方法中创建 AuthenticationProvider 并传递 initializeLoginState() 方法：

   void main() async {
     WidgetsFlutterBinding.ensureInitialized();
     await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
     runApp(
       ChangeNotifierProvider<AuthenticationProvider>(
         create: (context) => AuthenticationProvider(
           FirebaseManageUsers.listenToFirebaseAuthStateChanges
         ),
         child: const MyApp(),
       ),
     );
   }
   

   注意：FirebaseManageUsers 是一个包含所有需要实现的Firebase身份验证功能的类。

4. 如果你不使用Firebase，则无需初始化Firebase，但需要在 AuthenticationProvider 构造函数中传递 initializeLoginState 方法，该方法检查登录状态并更新 AuthenticationProvider 的 authState 字段：

   void initializeLoginState(AuthenticationProvider authProvider){
     bool isLoggedIn = checkUserIsLoggedInOrNot();
     if(isLoggedIn){
       authProvider.authState = AuthState.loggedIn;
       authProvider.userName = userName; //可选
       authProvider.email = userEmail; //可选
       authProvider.notify();
     } else {
       authProvider.email = null; //可选
       authProvider.authState = AuthState.loggedOut;
       authProvider.notify();
     }
   }
   

   注意：checkUserIsLoggedInOrNot 函数用于检查用户是否已登录。

配置登录页面

在配置登录页面时，需要传递一些必要的参数：

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: LoginPage(
        appName: "My App",
        passwordRegex: r"^.{6,32}$",
        isUsingFirebaseAuth: true,
        child: const MyHomePage(),
      ),
    );
  }
}

• appName: 应用程序名称，在所有登录和注册页面中显示。
• passwordRegex: 密码必须符合的正则表达式模式。
• invalidPasswordMessage: 当密码不符合 passwordRegex 规定时显示的消息。
• passwordRequirements: 包含每条密码要求及其对应的错误消息的映射。
• isUsingFirebaseAuth: 告诉是否使用默认的Firebase身份验证方法。
• checkEmail: 检查邮箱是否已存在的方法。
• login: 登录方法。
• register: 注册方法。
• sendPasswordResetEmail: 发送密码重置邮件的方法。
• signOut: 登出方法。

示例代码

以下是一个完整的示例代码：

import 'package:flutter/material.dart';
import 'package:flutter_easy_login/flutter_easy_login.dart';
import 'package:flutter_easy_login/models/auth_provider.dart';
import 'package:provider/provider.dart';

String? userId;
String? userName;
String? userEmail;

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(options: DefaultFirebaseOptions.currentPlatform);
  runApp(
    MultiProvider(
      providers: [
        ChangeNotifierProvider<AuthenticationProvider>(
          create: (context) => AuthenticationProvider(
            FirebaseManageUsers.listenToFirebaseAuthStateChanges
          ),
        ),
      ],
      child: const MyApp(),
    ),
  );
}

void initializeLoginState(AuthenticationProvider authProvider) {
  bool isLoggedIn = checkUserIsLoggedInOrNot();
  if (isLoggedIn) {
    authProvider.authState = AuthState.loggedIn;
    authProvider.userName = userName; // 可选
    authProvider.email = userEmail; // 可选
    authProvider.notify();
  } else {
    authProvider.email = null; // 可选
    authProvider.authState = AuthState.loggedOut;
    authProvider.notify();
  }
}

bool checkUserIsLoggedInOrNot() {
  return userId != null;
}

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: LoginPage(
        appName: "My App",
        passwordRegex: r"^.{6,32}$",
        isUsingFirebaseAuth: true,
        child: const MyHomePage(),
      ),
    );
  }
}

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

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text("App Bar"),
      ),
      body: const Center(
        child: Text("MY APP"),
      ),
    );
  }
}

class AuthBackend {
  Future<bool> checkEmail(String email, AuthenticationProvider authProvider) async {
    bool isAccountExists = false;
    try {
      isAccountExists = await doesAnyAccountExistWithThisEmail(email);
    } on FirebaseAuthException catch (e) {
      authProvider.authExceptionType = AuthExceptions.typeOf[e.code];
    } catch (e) {
      printToConsole("Exception in FirebaseManageUsers.loginWithEmailPassword: ${e.toString()}");
      authProvider.authExceptionType = AuthExceptionType.unknown;
    }
    return isAccountExists;
  }

  Future<bool> loginWithEmailPassword(String email, String password, AuthenticationProvider authProvider) async {
    final matchedUsers = userDataBase.where((user) => user["email"] == email).toList();
    if (matchedUsers.isNotEmpty && matchedUsers[0]["password"] == password) {
      return true;
    } else {
      return false;
    }
  }

  Future<bool> registerWithEmailPasswordName(String email, String password, String name, AuthenticationProvider authProvider) async {
    userDataBase.add({
      "id": UniqueKey().toString(),
      "email": email,
      "name": name,
      "password": password,
    });
    return await checkEmail(email, authProvider);
  }

  Future<bool> sendPasswordResetEmail(String email, AuthenticationProvider authProvider) async {
    // 实现发送密码重置邮件
    return true;
  }

  Future<bool> updatePassword(String resetCode, String newPassword, AuthenticationProvider authProvider) async {
    // 实现重置密码逻辑
    final currentUserEmail = userEmail;
    final getUser = userDataBase.where((user) => user["email"] == currentUserEmail).toList();
    if (getUser.isNotEmpty) {
      getUser[0]["password"] = newPassword;
    }
    return true;
  }

  Future<void> signOut(AuthenticationProvider authProvider) async {
    userEmail = null;
    userName = null;
    userId = null;
    authProvider.userName = null;
    authProvider.email = null;
    authProvider.notify();
  }
}

List<Map<String, String>> userDataBase = [
  {
    "id": "user1",
    "email": "asdf@gmail.com",
    "name": "asdf",
    "password": "1234"
  },
  {
    "id": "user2",
    "email": "johny@gmail.com",
    "name": "johny",
    "password": "sdjflsfs"
  },
  {
    "id": "user3",
    "email": "honey@gmail.com",
    "name": "honey",
    "password": "sldkfjsldfsldij"
  },
];