Flutter Web Firebase TypeError：dart.global.firebase.firestore 不是函数

Question

我正在尝试在我的 flutter web 项目中使用 Firebase。
但是应用程序无法使用此消息运行。

TypeError: dart.global.firebase.firestore is not a function
at Object.firestore$ [as firestore] 

我的index.html看起来像这样。

  <script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-app.js"></script>
  <script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-analytics.js"></script>

  <script>
    // Your web app's Firebase configuration
    var firebaseConfig = {
      apiKey: "MY_API_KEY",
      authDomain: "MY_AUTHDOMAIN",
      databaseURL: "MY_URL",
      projectId: "MY_ID",
      storageBucket: "MY_BUCKET",
      messagingSenderId: "MY_ID",
      appId: "MY_APPID",
      measurementId: "MY_ID"
    };
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
    firebase.analytics();
  </script>

有谁知道如何解决这个问题？
谢谢！！

Answer 1

添加此行即可解决问题index.html。

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

Answer 2

我有同样的事情，要修复它，只需在底部的 index.html 中添加它：

...
<script src="https://www.gstatic.com/firebasejs/7.17.1/firebase-firestore.js"></script>
  <script src="main.dart.js" type="application/javascript"></script>
...

只要确保它在：

....
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
...

Answer 3

我认为您缺少的是 Firestore SDK 来解决这个问题，如果您要使用 CDN，请转到此 URL

可用的 Firebase JS SDK（来自 CDN）

然后添加您在案例中使用的任何库，它是 Firestore，所以它应该是这个：

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

把它加在你身体的顶部

Answer 4

在最新版本的 FlutterFire 中，我发现了这些问题并且无法解决。我在降级 FlutterFire 的依赖项时解决了这个问题。由于这些是测试版，我们将面临这些问题。希望在即将发布的 flutterfire 版本中，这些问题会得到解决。按着这些次序： -

1)在pubsec.yaml文件中添加这些依赖项。

  firebase_core: ^0.5.0
  firebase_auth: ^0.18.0+1
  cloud_firestore: ^0.14.3+1

2)然后 在index.html文件中添加这些脚本。

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

3)然后在main.dart.js 脚本之前添加这些脚本。

 <script>
  // Your web app's Firebase configuration
  // For Firebase JS SDK v7.20.0 and later, measurementId is optional
  var firebaseConfig = {
    apiKey: "your api key",
    authDomain: "app_name.firebaseapp.com",
    projectId: "app_name2",
    storageBucket: "app_name.appspot.com",
    messagingSenderId: "882321312y",
    appId: "1:1782944473493525:web:923488234",
    measurementId: "G-4dmfnsd"
  };
  // Initialize Firebase
  firebase.initializeApp(firebaseConfig);
  firebase.analytics();
  </script>

注意：- 此文件是将 WebApp 添加到 Firebase 控制台上现有 Flutter 项目时生成的文件。

Answer 5

您必须从 Firebase添加您需要的所有 CDN。不仅是示例中的那些。

如果你还没有这样做，你必须：

1. 转到您的 Firebase 控制台
2. 如果您没有项目设置 Web 应用程序（您创建的那个），则为您的项目创建一个新的 Web 应用程序
3. 选择 CDN 并将其复制并粘贴到index.html正文中，在<script>包含 main.dart.js的标签之前

如果您这样做了，但仍然无法正常工作，那是因为您需要为正在使用的其他服务添加 CDN。

就我而言，它们是firebase-auth.js和firebase -firestore.js。但是不要从这里的回复中复制它，因为它可能已经过时了。您可以复制包含当前版本的 firebase-app.js 的路径。我的<script src="https://www.gstatic.com/firebasejs/8.4.2/firebase-app.js">意思是我当前的版本是 8.4.2，这不是你的情况。