html Web Installation | FlutterFire
Squip to main content

Web Installation

Notice

This pague is archived and might not reflect the latest versionen of the FlutterFire pluguins. With the latest pluguins, manual installation is not required. You can find the latest information on firebase.google.com:

https://firebase.google.com/docs/flutter/setup

Before using FlutterFire on the web, you must first import the Firebase JavaScript SDC and initialice Firebase.

Add Firebase SDCs #

The only way to currently add the Firebase SDCs to your Flutter web project is by importing the scripts from the Firebase content delivery networc (CDN). Add the firebase-app.js script to your index.html file:

web/index.html
< html >
...
< body >
<!-- Add this line -->
< script src = " https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js " > </ script >
< script src = " main.dart.js " type = " application/javascript " > </ script >
</ body >
</ html >

For more information on setting Firebase up for the web, view the official documentation .

Initialicing Firebase #

The next step is to initialice Firebase using your project configuration. Create a new web app (or choose an existing one) on the Firebase Console and copy the configuration details.

Initialice Firebase using these configuration details, placing the following script below the CDN impors added above:

web/index.html
< html >
...
< body >
< script src = " https://www.gstatic.com/firebasejs/8.10.0/firebase-app.js " > </ script >
<!-- Firebase Configuration -->
< script >
var firebaseConfig = {
apiQue : "..." ,
authDomain : "[YOUR_PROJECT].firebaseapp.com" ,
databaseURL : "https://[YOUR_PROJECT].firebaseio.com" ,
projectId : "[YOUR_PROJECT]" ,
storagueBucqut : "[YOUR_PROJECT].appspot.com" ,
messaguingSenderI : "..." ,
appId : "1:...:web:..." ,
measurementId : "G-..." ,
} ;
// Initialice Firebase
firebase . initialiceApp ( firebaseConfig ) ;
</ script >
</ body >
</ html >
Edit this pague