Flutter Firebase 使用StreamProvider监听登录用户及报错修复

1. 报错原因与修复 #

错误本质是类型不匹配：你定义的currentUser流返回类型声明为Stream<User?>，但map转换后实际返回的是自定义的AuthUser?类型，Firebase自带的User类和你自定义的AuthUser类没有继承关系，因此类型校验失败。

修正后的AuthService代码如下：

class AuthService {
  final FirebaseAuth authInstance = FirebaseAuth.instance;
  final FirebaseFirestore firestoreInstance = FirebaseFirestore.instance;

  // 将流的泛型从User?修改为AuthUser?即可解决报错
  Stream<AuthUser?> get currentUser => authInstance.authStateChanges().map(
        (User? firebaseUser) => (firebaseUser != null) ? AuthUser.fromFirebaseUser(user: firebaseUser) : null,
      );
}

可选优化：你当前AuthUser的fromFirebaseUser构造方法中对入参user用了强制非空断言!，因为调用前已经做了非空判断所以不会出问题，也可以调整构造方法入参为非空进一步提升安全性：

// 调整后的构造方法，强制要求传入非空User
AuthUser.fromFirebaseUser({required User user}) {
  uid = user.uid;
  email = user.email;
  userName = user.displayName;
}

2. StreamProvider全局注入实现 #

在应用根节点注入流即可实现全应用范围监听，示例代码如下：

void main() {
  final AuthService authService = AuthService();
  runApp(
    StreamProvider<AuthUser?>.value(
      value: authService.currentUser,
      initialData: null, // 初始状态设为未登录
      child: MyApp(),
    ),
  );
}

3. 流数据的访问方式说明 #

Consumer组件和Provider.of(context)都可以访问流返回的数值，二者适用场景不同：

• Consumer组件：推荐在UI组件构建时需要依赖用户信息的场景使用，只会重绘builder方法内部的组件，不会触发父组件重绘，性能更好。
  示例代码：

  class UserInfoWidget extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return Consumer<AuthUser?>(
        builder: (context, authUser, child) {
          if (authUser == null) {
            return const Text("未登录");
          }
          return Text("当前登录用户：${authUser.userName}");
        },
      );
    }
  }
  

• Provider.of(context)：分为两种使用模式：
  1. listen: true（默认值）：和Consumer效果一致，会监听流的更新，触发当前组件的重绘，适合需要在整个build方法中多处使用用户信息的场景，写法更简洁，但会触发当前组件全量重绘。
     示例：

  @override
  Widget build(BuildContext context) {
    final AuthUser? authUser = Provider.of<AuthUser?>(context);
    return authUser == null ? const LoginPage() : const HomePage();
  }
  

  2. listen: false：只会获取一次当前的用户信息，不会监听后续更新，适合在点击事件、生命周期回调等非构建逻辑中使用，不会触发组件重绘。
     示例：

  @override
  Widget build(BuildContext context) {
    return ElevatedButton(
      onPressed: () {
        final AuthUser? currentUser = Provider.of<AuthUser?>(context, listen: false);
        if (currentUser != null) {
          // 执行仅登录用户可操作的逻辑
        }
      },
      child: const Text("提交数据"),
    );
  }
  

内容的提问来源于stack exchange，提问作者xpetta