Flutter身份验证插件flutter_auth_provider的使用

Flutter身份验证插件flutter_auth_provider的使用

flutter_auth_provider 是一个用于构建 Flutter 应用的身份验证管理器。它提供了简单且可扩展的方式来处理用户认证相关的逻辑。

开始使用

步骤

1. 添加依赖： 将 flutter_auth_provider 添加到你的 pubspec.yaml 文件中。

   dependencies:
     flutter_auth_provider: ^x.y.z
     flutter_secure_storage: ^x.y.z
   

2. 实现存储类： 实现 AuthStore 和 TokenStore 来处理用户数据和令牌的持久化。

3. 将存储类连接到视图： 使用 Provider 将存储类连接到应用的视图。

概念

1. 存储类（Stores）

存储类允许你实现自定义的数据持久化层，用于处理认证相关的数据。

• AuthStore：这是用户相关数据的存储。当你实现 AuthStore 时，你可以使用一个自定义的类型作为 User 的泛型。

• TokenStore：实现如何存储和刷新令牌。

示例实现：

import 'package:flutter_auth_provider/flutter_auth_provider.dart';
import 'package:flutter_secure_storage/flutter_secure_storage.dart';

class User {
  String userName;
  String role;

  const User({required this.role, required this.userName});
}

const String userNameKey = 'userName';
const String roleKey = 'role';
const String tokenKey = 'token';
const String refreshTokenKey = 'refreshToken';

class SecureStore implements AuthStore<User>, TokenStore {
  static SecureStore _instance = const SecureStore._();
  final FlutterSecureStorage _storage = const FlutterSecureStorage();

  const SecureStore._();

  factory SecureStore() => _instance;

  [@override](/user/override)
  Future<void> delete() async {
    await _storage.delete(key: userNameKey);
    await _storage.delete(key: roleKey);
  }

  [@override](/user/override)
  Future<User?> retrieve() async {
    final userName = await _storage.read(key: userNameKey);
    final role = await _storage.read(key: roleKey);
    if (userName != null && role != null) {
      return User(userName: userName, role: role);
    }
    return null;
  }

  [@override](/user/override)
  Future<void> save(User user) async {
    await _storage.write(key: userNameKey, value: user.userName);
    await _storage.write(key: roleKey, value: user.role);
  }

  [@override](/user/override)
  Future<void> clear() async {
    await _storage.delete(key: tokenKey);
    await _storage.delete(key: refreshTokenKey);
  }

  [@override](/user/override)
  Future<String?> getRefreshToken() async {
    return _storage.read(key: refreshTokenKey);
  }

  [@override](/user/override)
  Future<String?> getToken() async {
    return _storage.read(key: tokenKey);
  }

  [@override](/user/override)
  Future<void> saveTokens({required String token, String? refreshToken}) async {
    await _storage.write(key: tokenKey, value: token);
    if (refreshToken != null) {
      await _storage.write(key: refreshTokenKey, value: refreshToken);
    }
  }
}

2. 监听器（Listeners）

有两个监听器可以执行与认证事件相关的代码。

• LoginListener：当用户登录时调用。
• LogoutListener：当用户注销时调用。

示例：

class MyLoginListener extends LoginListener {
  [@override](/user/override)
  void onLoginSuccess(User user) {
    // 用户登录成功后的操作
  }

  [@override](/user/override)
  void onLoginFailure(AuthException exception) {
    // 用户登录失败后的操作
  }
}

完整示例

main.dart

import 'package:flutter/material.dart';
import 'package:flutter_auth_provider/flutter_auth_provider.dart';
import 'package:flutter_auth_provider_example/auth/secure_store.dart';
import 'package:flutter_auth_provider_example/auth/type_def.dart';
import 'package:flutter_auth_provider_example/auth/user.dart';
import 'package:flutter_auth_provider_example/auth_app.dart';
import 'package:flutter_auth_provider_example/unauth_app.dart';
import 'package:provider/provider.dart';

void main() {
  runApp(
    AuthProvider<User>(
      store: SecureStore(),
      child: const MyApp(),
    ),
  );
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  [@override](/user/override)
  Widget build(BuildContext context) {
    final bool isAuthenticated = context.watch<MyAuthManager>().isLoggedIn;
    if (isAuthenticated) {
      return const AuthenticatedApp();
    } else {
      return const UnAuthenticatedApp();
    }
  }
}