Menu
Can anybody help me please? I try build a web application with Flutter, based on Google Firebase Auth and Cloud Firestore. The project on Android works fine, i can work with users and can get data from my Cloud Firestore database. I've maked a second app(webapp) do all the steps described in Firebase documentation (webapp is registred, hosted on Firebase), inserted all the dependencies in pubspec.yaml
dependencies:
flutter:
sdk: flutter
# The following adds the Cupertino Icons font to your application.
# Use with the CupertinoIcons class for iOS style icons.
cupertino_icons: ^0.1.3
firebase_core: ^0.4.4+3
firebase: ^7.3.0
firebase_auth: ^0.16.0
modified the index.html like so:
<body>
<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="/__/firebase/7.14.3/firebase-app.js"></script>
<!-- TODO: Add SDKs for Firebase products that you want to use
https://firebase.google.com/docs/web/setup#available-libraries -->
<script src="/__/firebase/7.14.3/firebase-analytics.js"></script>
<!-- Add Firebase products that you want to use -->
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.14.2/firebase-firestore.js"></script>
<!-- Initialize Firebase -->
<script src="/__/firebase/init.js"></script> <!-- This script installs service_worker.js to provide PWA functionality to
application. For more information, see:
https://developers.google.com/web/fundamentals/primers/service-workers -->
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', function () {
navigator.serviceWorker.register('flutter_service_worker.js');
});
}
</script>
<script>
var firebaseConfig = {
apiKey: "XXXXXXXXXX-6EL5qIBxWjurRQMcK3pf9W-o",
authDomain: "xxxxxxxx.firebaseapp.com",
databaseURL: "https://xxxxxxxx.firebaseio.com",
projectId: "xxxxxxxx",
storageBucket: "xxxxxxxx.appspot.com",
messagingSenderId: "xxxxxxxx6198",
appId: "1:xxxxxxxx16198:web:cde3457e8dc734d045d227",
measurementId: "X-XXXXXXXXXX"
};
firebase.initializeApp(firebaseConfig);
firebase.auth();
firebase.analytics();
</script>
<script src="main.dart.js" type="application/javascript"></script>
</body>
but when i try Sign-In or register, Android Studio throws this error message:
TypeError: Cannot read property 'app' of undefined
at Object.app$ [as app] (http://localhost:53262/packages/firebase/src/top_level.dart.lib.js:72:56)
at firebase_auth_web.FirebaseAuthWeb.new.[_getAuth] (http://localhost:53262/packages/firebase_auth_web/firebase_auth_web.dart.lib.js:42:27)
at firebase_auth_web.FirebaseAuthWeb.new.signInWithCredential (http://localhost:53262/packages/firebase_auth_web/firebase_auth_web.dart.lib.js:197:34)
at signInWithCredential.next (<anonymous>)
at runBody (http://localhost:53262/dart_sdk.js:43135:34)
at Object._async [as async] (http://localhost:53262/dart_sdk.js:43163:7)
at firebase_auth_web.FirebaseAuthWeb.new.signInWithCredential (http://localhost:53262/packages/firebase_auth_web/firebase_auth_web.dart.lib.js:196:20)
at firebase_auth.FirebaseAuth.__.signInWithCredential (http://localhost:53262/packages/firebase_auth/firebase_auth.dart.lib.js:324:90)
at signInWithCredential.next (<anonymous>)
What this exception means? What do i wrong? Thanks a lot for any help!
984
I had the same problem, wasted a lot of time on it.
The main reason for this problem atleast for me was with the cloud_firestore dependency. For me it turned out that it was just some issues with firebase security stuff because I was using a VPN to access internet, and chrome debug browser that ussually pops up doesn't allow to install an extension.
For me everything was fine but I was just being blocked from accessing some firebase stuff. To try if this is the case for you run flutter run -d chrome --release and copy the localhost url and paste it in the normal browser not the popup. If everything works fine then you had the same problem as me, if not then maybe you have a different issue then.
Hope this saves someone's time.
Remember your index.html file should be configured correctly, should also include every firebase dependency you have on pubspec.yaml.
Below is and example of a well configured index.html, just the body tag:
<body id="app-container">
// firebase-app.js should go first.
<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-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/7.20.0/firebase-firestore.js">. </script>
<script>
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
var firebaseConfig = {
apiKey: "xxxxxxxxxxxxx",
authDomain: "xxxxxx.firebaseapp.com",
databaseURL: "https://xxxxxx.firebaseio.com",
projectId: "xxxxx",
storageBucket: "xxxxx.appspot.com",
messagingSenderId: "xxxxxxx",
appId: "1:xxxxxxxxx:web:xxxxxxxxxx",
measurementId: "G-NYEW95QM"
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
firebase.analytics();
</script>
<script src="main.dart.js" type="application/javascript"></script>
</body>
And my pubspec.yaml file looks like this:
cupertino_icons: ^1.0.0
firebase_auth: ^0.18.2
cloud_firestore: ^0.14.2
provider: ^4.3.2+2
flutter_spinkit: ^4.1.2+1
simple_animations: ^2.2.3
firebase_core: ^0.5.1
intl: ^0.16.1
folding_cell: ^1.0.0
charts_flutter: ^0.9.0
flip_card: ^0.4.4
progress_dialog: ^1.2.4
image_picker_web: ^0.1.0+2
url_launcher: ^5.7.8
image: ^2.1.18
animator: ^2.0.1
timeago: ^2.0.28
uuid: ^2.2.2
font_awesome_flutter: ^8.10.0
bubble: ^1.1.9+1
google_fonts: ^1.1.1
You need fix dependencies.
dependencies:
flutter:
sdk: flutter
firebase_auth:
firebase_auth_web:
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
