Flutter web无法从firestore获取数据答案

【问题标题】：Flutter web unable to get data from firestoreFlutter web无法从firestore获取数据
【发布时间】：2023-03-15 08:39:01
【问题描述】：

我在从 Firestore 获取数据时遇到问题，代码如下：-

import 'package:cloud_firestore/cloud_firestore.dart';
import 'package:flutter/material.dart';
import 'package:machineweb/model/models.dart';



class ProductArgs {
  String crop;
  ProductArgs({this.crop});
}

class ShowProduct extends StatefulWidget {
  static String route = '\showproductroute';
  @override
  _ShowProductState createState() => _ShowProductState();
}

class _ShowProductState extends State<ShowProduct> {
  @override
  Widget build(BuildContext context) {
    double screenWidthSize = MediaQuery.of(context).size.width;
    double height = MediaQuery.of(context).size.height;
    ProductArgs args = ModalRoute.of(context).settings.arguments;

    FirebaseFirestore firestore = FirebaseFirestore.instance;

    List<DocumentSnapshot> products = []; // stores fetched products

    bool isLoading = false; // track if products fetching

    bool hasMore = true; // flag for more products available or not

    int documentLimit = 2; // documents to be fetched per request

    DocumentSnapshot
        lastDocument; // flag for last document from where next 10 records to be fetched

    ScrollController _scrollController = ScrollController();

    print(args.crop);

    getProducts() async {
      if (!hasMore) {
        print('No More Products');
        return;
      }
      if (isLoading) {
        return;
      }
      setState(() {
        isLoading = true;
      });
      QuerySnapshot querySnapshot;
      if (lastDocument == null) {
        querySnapshot = await firestore
            .collection('productData')
            .where('type', isEqualTo: args.crop)
            .limit(documentLimit)
            .get();
      } else {
        querySnapshot = await firestore
            .collection('productData')
            .where('type', isEqualTo: args.crop)
            .startAfterDocument(lastDocument)
            .limit(documentLimit)
            .get();
        print(1);
      }
      if (querySnapshot.docs.length < documentLimit) {
        hasMore = false;
      }
      lastDocument = querySnapshot.docs[querySnapshot.docs.length - 1];
      products.addAll(querySnapshot.docs);
      setState(
        () {
          isLoading = false;
        },
      );
    }

    _scrollController.addListener(
      () {
        double maxScroll = _scrollController.position.maxScrollExtent;
        double currentScroll = _scrollController.position.pixels;
        double delta = MediaQuery.of(context).size.height * 0.20;
        if (maxScroll - currentScroll <= delta) {
          getProducts();
        }
      },
    );

    int _crossAxisCount = 0;

    if (screenWidthSize > 720) {
      _crossAxisCount = 3;
    } else if (screenWidthSize > 520) {
      _crossAxisCount = 2;
    } else {
      _crossAxisCount = 1;
    }

    print(products.length.toString());

    return Container(
      child: Column(children: [
        Expanded(
          child: products.length == 0
              ? Center(
                  child: Text('No Data...'),
                )
              : ListView.builder(
                  controller: _scrollController,
                  itemCount: products.length,
                  itemBuilder: (context, index) {
                    return ListTile(
                      contentPadding: EdgeInsets.all(5),
                      title: Text(products[index].data()['name']),
                      subtitle: Text(products[index].data()['short_desc']),
                    );
                  },
                ),
        ),
        isLoading
            ? Container(
                width: MediaQuery.of(context).size.width,
                padding: EdgeInsets.all(5),
                color: Colors.yellowAccent,
                child: Text(
                  'Loading',
                  textAlign: TextAlign.center,
                  style: TextStyle(
                    fontWeight: FontWeight.bold,
                  ),
                ),
              )
            : Container()
      ]),
    );
  }
}

products.lenght 为零，即使 firestore 上有数据。

这是我的index.html:-

  <script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-auth.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-firestore.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-analytics.js"></script>
  <script src="https://www.gstatic.com/firebasejs/8.3.1/firebase-storage.js"></script>

甚至尝试将其更改为：-

<script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-storage.js"></script>

如何从 firestore 获取数据，我尝试使用其他包，即使没有用。

任何解决方案，有很多类似的问题，但不是通过问题解决？

【问题讨论】：

你初始化了firebase web吗？ firebase.flutter.dev/docs/installation/web
我可以写入数据，但无法读取它@SaurabhK.Sharma，是的，我已经对其进行了初始化。
请检查您的 Firestore 规则。并分享您阅读时遇到的错误。
没有错误，如果用户ID不为空，则允许读写。@SaurabhK.Sharma
快照错误如下。快照错误：[cloud_firestore/unknown] NoSuchMethodError：null 成员无效：'includeMetadataChanges' 如何解决此问题？谢谢。

标签： firebase flutter google-cloud-firestore flutter-web

【解决方案1】：

这可能是因为您忘记添加 Firestore 规则以允许从您的收藏中获取数据。我建议您检查获取快照是否出错。您可以通过添加到您的代码来做到这一点：

if (snapshot.hasError) { print(snapshot.error.toString()) }

【讨论】：

快照错误如下。快照错误：[cloud_firestore/unknown] NoSuchMethodError：null 成员无效：'includeMetadataChanges' 我该如何解决这个问题？
我可以通过在 index.html 中将 Firebase JS SDK 版本从 8.1 更新到 7.22.1 来解决我的问题。请参阅以下文章。谢谢。 stackoverflow.com/questions/65001207/…

【解决方案2】：

通过将index.html 中的所有版本更改为：-

  <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-firestore.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-analytics.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-storage.js"></script>

不仅仅是firebase-storage版本：-

<script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-storage.js"></script>

我知道我为此提出一个问题有点愚蠢，但是是的，现在它有效了。

【讨论】：