Flutter Web无法从Firestore Database加载数据，如何解决？

尝试用Flutter Web从Firestore获取数据，初始代码如下：

try {
    print("via!");
    QuerySnapshot qs = await FirebaseFirestore.instance
        .collection('muscle_groups')
        .get();
    print(qs.docs.length);
    print("fine");
} catch (e) {
    print("Errore durante la query: $e");
}

控制台始终打印0，无报错。

修改为使用集合组查询并强制从服务器获取数据后：

var x = await FirebaseFirestore.instance
        .collectionGroup("muscle_groups")
        .get(const GetOptions(source: Source.server));

出现以下错误：

Failed to get documents from server. (However, these documents may exist in the local cache. Run again without setting source to "server" to retrieve the cached documents.)

已确认：Web端执行flutterfire configure --project=prova-63b29无报错，应用及Firebase初始化代码已正确配置。

• 验证Firestore数据与权限

  1. 登录Firebase控制台，确认muscle_groups根集合（或子集合，若用collectionGroup）确实存在且包含有效文档。
  2. 检查Firestore安全规则：Web端默认规则可能限制未认证用户读取，开发阶段可临时设置测试规则（上线前务必修改为严格规则）：

     rules_version = '2';
     service cloud.firestore {
       match /databases/{database}/documents {
         match /{document=**} {
           allow read, write: if true;
         }
       }
     }
     

• 调整查询逻辑

  1. 若muscle_groups是根集合，使用原collection查询但不强制指定数据源，让Firestore自动优先同步服务器数据，失败则 fallback 到缓存：

     try {
       QuerySnapshot qs = await FirebaseFirestore.instance
           .collection('muscle_groups')
           .get();
       print("文档数量: ${qs.docs.length}");
       // 遍历打印文档内容，确认是否有数据
       for (var doc in qs.docs) {
         print("文档ID: ${doc.id}, 数据: ${doc.data()}");
       }
     } catch (e) {
       print("查询错误: $e");
     }
     

  2. 若确实需要使用collectionGroup查询，必须在Firebase控制台创建对应的集合组索引：
     • 进入Firestore控制台 → 索引 → 复合索引 → 添加索引
     • 集合ID填写muscle_groups，选择至少一个字段（如__name__）设置为升序，保存后等待索引生效（通常需1-5分钟）。

• 确认Firebase初始化正确性
  确保main函数中Firebase初始化代码正确执行，可添加初始化状态打印：

  void main() async {
    WidgetsFlutterBinding.ensureInitialized();
    await Firebase.initializeApp(
      options: DefaultFirebaseOptions.currentPlatform,
    ).then((_) {
      print("Firebase初始化完成");
    });
    runApp(const MyApp());
  }
  

• 排查Web端网络问题
  检查浏览器网络连接是否正常，是否有防火墙、代理拦截Firebase请求。本地开发无需额外配置CORS，若使用自定义域名，需在Firebase控制台配置对应CORS规则。

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