WidgetsFlutterBinding.ensureInitialized or Firebase initialize app is not called on Flutter web

Question

每当我启动我的 Flutter Web 应用程序时，我都会收到一条错误消息，告诉我 firebase.initializeapp 尚未被调用，但是代码在 android 上运行良好。

Answer 1

The New Flutter As Platform

PS: The Old way is Below

With the new support of Flutter as a platform on firebase. Everything is actually set up by firebase itself. just follow the steps and the connection will be done.

1. Create a Firebase Project.
2. Create a flutter project.
3. Install Firebase CLI with code curl -sL https://firebase.tools | bash curl -sL https://firebase.tools | bash
4. log in to the Firebase account by CLI Firebase login .
5. Activate the Firebase CLI dart pub global activate flutterfire_cli
6. Configure your project flutterfire configure --project-name
7. Select the Platform that you want when it asks.
8. And init the firebase in main.dart like follow

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  runApp(const MyApp());
}

---

The Old Way, where we have to create separate platform-specific connections.

After setting the project on the firebase side, which I presume you have already done. You will have to configure the web part. like follows

Navigate to the root directory of your web build and open index.html. web->index.html

and the following code above the main.dart.js script tag check for lates code

    <!-- ADD THIS BEFORE YOUR main.dart.js SCRIPT -->

    <!-- The core Firebase JS SDK (always required for using any Firebase service) -->
    <script src="https://www.gstatic.com/firebasejs/9.9.0//firebase-app.js"></script>
    <!-- Firebase Auth SDK -->
    <script src="https://www.gstatic.com/firebasejs/9.9.0//firebase-auth.js"></script>
    <script>
      // Your web app's Firebase configuration
      var firebaseConfig = {
        apiKey: '...',
        authDomain: '...',
        databaseURL: '...',
        projectId: '...',
        storageBucket: '...',
        messagingSenderId: '...',
        appId: '...',
      }
      // Initialize Firebase
      firebase.initializeApp(firebaseConfig)
    </script>
    <!-- END OF FIREBASE INIT CODE -->

You will get the firebase config details from the settings of the web app in the firebase project. You can copy that from there.