Flutter Web端Firebase Auth登录状态无法持久化问题求助

问题核心 #

调试会话结束（关闭Chrome或停止VSCode调试）后，Firebase Auth的用户登录状态无法保留，重启调试后回到未登录状态。这是因为调试模式下Chrome默认会清除临时会话的存储数据，而Firebase Auth在Web端依赖浏览器的本地存储保存用户凭证。

解决办法 #

1. 开启Chrome控制台的"保留日志"功能 #

• 打开Chrome开发者工具（按F12）
• 切换到Console标签页
• 勾选页面底部的Preserve log选项
• 之后关闭调试窗口再重启，浏览器会保留存储的登录凭证

2. 显式设置Firebase Auth持久化策略 #

默认情况下Firebase Auth使用本地持久化，但调试环境可能存在差异，显式设置可以确保生效：
在初始化Firebase后、监听authStateChanges之前，添加以下代码：

await FirebaseAuth.instance.setPersistence(Persistence.LOCAL);

3. 使用正式构建测试 #

调试模式的Chrome会话特性会导致存储丢失，建议构建正式版本测试：

• 执行命令：flutter build web
• 用本地服务器部署构建产物（比如python -m http.server 8080）
• 在普通Chrome窗口打开测试，登录状态会正常持久化

修正后的完整示例代码 #

import 'package:flutter/material.dart';
import 'package:firebase_core/firebase_core.dart';
import 'package:firebase_auth/firebase_auth.dart';

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

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

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

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

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  @override
  void initState() {
    super.initState();
    Future.sync(() async {
      await Firebase.initializeApp(
        options: const FirebaseOptions(
          // 填入你的Firebase配置信息
        ),
      );
      // 显式设置本地持久化
      await FirebaseAuth.instance.setPersistence(Persistence.LOCAL);
      FirebaseAuth.instance.authStateChanges().listen((user) {
        user == null ? print("signed out") : print("signed in");
      });
    });
  }

  @override
  Widget build(BuildContext context) {
    return Center(
      child: ElevatedButton(
        onPressed: () async {
          try {
            await FirebaseAuth.instance.signInWithEmailAndPassword(
              email: "qwer1234@gmail.com", 
              password: "qwer1234"
            );
          } catch (e) {
            print("登录失败：$e");
          }
        },
        child: const Text('Sign In'),
      )
    );
  }
}

额外注意点 #

• 确保Firebase Web应用的配置参数（apiKey、authDomain等）完全正确
• 不要用Chrome无痕窗口测试登录持久化，无痕模式会自动清除所有存储数据
• 登录操作要加上await并捕获异常，避免异步操作未完成就结束会话

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