首页 > 解决方案 > FirebaseError:Firebase:未创建 Firebase App '[DEFAULT]' - 启用 Web Flutter 时调用 Firebase App.initializeApp() (app/no-app)

问题描述

我已经使用 firebase 来处理我的项目。但是当我想构建网络时不起作用

第一步:我跑

flutter config --enable-web

第二步:我跑

flutter run -d chrome   

并在出现以下错误后

TypeError: Cannot read property 'app' of undefined
at Object.app$ [as app] (http://localhost:63143/packages/firebase_core_web/src/interop/core.dart.lib.js:48:101)
at new cloud_firestore_web.FirebaseFirestoreWeb.new
(http://localhost:63143/packages/cloud_firestore_web/src/write_batch_web.dart.lib.js:873:64)
at Function.registerWith (http://localhost:63143/packages/cloud_firestore_web/src/write_batch_web.dart.lib.js:755:73)
at Object.registerPlugins (http://localhost:63143/packages/doxaspc/generated_plugin_registrant.dart.lib.js:34:46)
at main (http://localhost:63143/web_entrypoint.dart.lib.js:44:35)
at main.next (<anonymous>)
at runBody (http://localhost:63143/dart_sdk.js:39052:34)
at Object._async [as async] (http://localhost:63143/dart_sdk.js:39083:7)
at main$ (http://localhost:63143/web_entrypoint.dart.lib.js:43:18)
at http://localhost:63143/main_module.bootstrap.js:19:10
at Array.forEach (<anonymous>)
at window.$dartRunMain (http://localhost:63143/main_module.bootstrap.js:18:32)
at <anonymous>:1:8
at Object.runMain (http://localhost:63143/dwds/src/injected/client.js:8656:21)
at http://localhost:63143/dwds/src/injected/client.js:22068:19
at _wrapJsFunctionForAsync_closure.$protected (http://localhost:63143/dwds/src/injected/client.js:3830:15)
at _wrapJsFunctionForAsync_closure.call$2 (http://localhost:63143/dwds/src/injected/client.js:10905:12)
at Object._asyncStartSync (http://localhost:63143/dwds/src/injected/client.js:3794:20)
...

我的文件 index.html

<!DOCTYPE html>
<html>
<head>
<base href="/">
<meta charset="UTF-8">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<meta name="description" content="A new Flutter project.">
<!-- iOS meta tags & icons -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="doxaspc">
<link rel="apple-touch-icon" href="icons/Icon-192.png">
<!-- Favicon -->
<link rel="icon" type="image/png" href="favicon.png"/>
<link rel="manifest" href="manifest.json">
</head>
<body>
    <!-- Firebase Setup -->
<script src="https://www.gstatic.com/firebasejs/8.8.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.8.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.8.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.8.0/firebase-firestore.js"></script>
<script>
  var firebaseConfig = {
    apiKey: "AIzaSyD3kioPzFSkD6xXndI9fkguKhj0Qadb304",
    authDomain: "fir-d71eb.firebaseapp.com",
    projectId: "fir-d71eb",
    storageBucket: "fir-d71eb.appspot.com",
    messagingSenderId: "983518157786",
    appId: "1:983518157786:web:b8db1e8f8806292de97ee3",
    measurementId: "G-Z2Q69GT9WB"
  };
  firebase.initializeApp(firebaseConfig);
</script>
<script>
  if ('serviceWorker' in navigator) {
    window.addEventListener('flutter-first-frame', function () {
      navigator.serviceWorker.register('flutter_service_worker.js');
    });
  }
</script>
<script src="main.dart.js" type="application/javascript"></script>
</body>
</html> 

我想从我的项目应用程序中启用网络,但我不知道我错过了一步?请告诉我怎么做?请帮我

标签: firebaseflutterapidartweb

解决方案


如果您将 Flutter Web 与 Firebase 一起使用,请确保您已将 SDK 安装在您的 body 标签中./web/index.html

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

此外,请确保您也firebase.initializeApp(...)使用配置参数调用index.html

<script>
    // Your web app's Firebase configuration
    // For Firebase JS SDK v7.20.0 and later, measurementId is optional
    var firebaseConfig = {
      apiKey: "AIz...",
      authDomain: "...",
      databaseURL: "https://<project-name>.firebaseio.com",
      projectId: "...",
      storageBucket: "<project-name>.appspot.com",
      messagingSenderId: "...",
      appId: "...",
      measurementId: "..."
    };
    firebase.initializeApp(firebaseConfig);
    firebase.analytics();
  </script>

最后配置firebase

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp();
  runApp(MyApp());
}

推荐阅读