Issue
In my application I can log in (using firebase auth) on both iOS, android and web. When I try reading from Firestore database using a streambuilder, then it only works in iOS and android. In the web-part it goes straight to the else-clause of snaps.HasData.
My index.html-file (firebaseConfig removed obviously):
<body>
<script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-functions.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-messaging.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-storage.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.3.0/firebase-remote-config.js"></script>
<script>
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
var firebaseConfig = {
apiKey: "",
authDomain: "",
databaseURL: "",
projectId: "",
storageBucket: "",
messagingSenderId: "",
appId: "",
measurementId: ""
};
// Initialize Firebase
firebase.initializeApp(firebaseConfig);
firebase.analytics();
</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('flutter-first-frame', function () {
navigator.serviceWorker.register('flutter_service_worker.js');
});
}
</script>
<script src="main.dart.js" type="application/javascript"></script>
</body>
My dashboard-screen when logged in. In my console i get the print "enters streambuilder" but not the print "snapshot has data":
return Scaffold(
key: _scaffoldKey,
appBar: PreferredSize(
preferredSize: Size.fromHeight(70.0),
child: AppBar(
title: Padding(
padding: const EdgeInsets.only(top: 10.0),
child: StreamBuilder<List<Users>>(
stream: database.users(),
builder: (context, snapshot) {
print("enters streambuilder");
if (snapshot.hasData) {
print("snapshot has data");
final users = snapshot.data;
if (users.isNotEmpty) {
print("users is not empty");
...
These are my pubspec.yaml dependencies:
environment:
sdk: ">=2.2.2 <3.0.0"
dependencies:
flutter:
sdk: flutter
flutter_localizations:
sdk: flutter
firebase_core_platform_interface: 4.0.0
firebase_storage_web: 1.0.0
firebase_auth_web: 1.0.0
firebase_core: 1.0.1
firebase_core_web: 1.0.1
firebase_storage: 8.0.0
firebase_messaging: 9.0.0
firebase_dynamic_links: ^0.5.0+11
firebase_auth: 1.0.0
cloud_firestore: 1.0.0
cloud_firestore_web: 1.0.1
...
Am I missing any dependencies? Cant figure out why I can’t read the data from firestore.
Ive double checked that the firebaseConfig settings are correctly setup with my project settings in firebase.
Solution
Found a solution here Stackoverflow: Flutter Web – Fetching Firestore collection
Apparently using version 8.3.0 was the problem. Use 7.14.4 instead
Answered By – jeffmayn
Answer Checked By – David Goodson (FlutterFixes Volunteer)