Use Firebase Realtime Database in Flutter Web App

Question

I'm a beginner in Flutter and I want to connect my Flutter Web App to Firbase Realtime Database . My goal is to add some sample data inside the database when I click a button.

At this moment I have added inside the web/index.html file the following

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

<script>
    var firebaseConfig = {
      apiKey: "...",
      authDomain: "...",
      databaseURL: "...",
      projectId: "...",
      storageBucket: "...",
      messagingSenderId: "...",
      appId: "...",
      measurementId: "...",
    };
    // Initialize Firebase
    firebase.initializeApp(firebaseConfig);
    firebase.analytics();
</script>

In my pubspec.yaml file I have added the following dependencies:

firebase: ^7.3.2
firebase_core: ^0.5.2
firebase_database: ^4.3.0

My main.dart file contains a simple main() function like below

void main() {
  runApp(MyApp());
}

And the MyApp() stateless widget.

Do I have to use the .initializeApp() and pass inside it the project's constraints (apiKey, authDomain etc.)?

Can someone give me some hints because i have no idea what to do, i'm pretty much confused at this moment.

Thank you for your time

Answer 1

If you look at the platform support table on firebase.flutter.dev , you'll see that the FlutterFire libraries don't support accessing Realtime Database in web apps yet. Work to add support is under way, but there's no estimate on when it will be released.

For the moment, if you want to use the Firebase Realtime Database in a Flutter web app, you'll have to use the firebase-dart library .