Getting data from Flutter Firebase Realtime Database when onChildAdded

Question

I will first say that I am a firmware developer trying to make a web interface for a personal project. My question might be basic as this is my first web interface with a database. I have searched quite a bit on how to achieve what I am trying to do without success, so I suspect I am not approaching this the right way, but here it is:

Basically I have a device pushing data to a firebase realtime database:

the push function generates an unique Id for me automatically which is nice...

Now In my flutter interface, I want to display the latest entry on a widget so I am using the onChildAdded functionnality of flutterfire:

ref.onChildAdded.listen((DatabaseEvent event) {
      print(event.snapshot.key);
      print(event.snapshot.value);
});

My first issue is that this function is triggered for all the child at first before waiting for new ones which is unnecessary and could be a problem when I begin to have a lot of data. Is there a way to simply get the latest sample and still get an event when one is added? (I still want to keep the old data to be able to make charts with them)

My second problem is the format of the received data:

{
  -Mx2PCeptLf2REP1YFH0: {
     "picture_url": "", 
     "time_stamp": "2022-02-28 21:56:58.502005", 
     "temperature": 27.71, 
     "relative_humidity": 42.77, 
     "eco2": 691, 
     "tvoc": 198, 
     "luminosity": 4193, 
     "vpd": 1.71
   }
}

before using the put method, I didn't have the automatically generated ID so I was able to cast this as a Map<String, dynamic> and use the data like this in my widget:

Text(snapshot.data!["temperature"].toString())

but now the added nesting with the generated id is giving me a headache as I can't seem to figure out how to simply get the data.

So if anyone could help me to always get the single latest data when subscribing to a collection and how to access that data within my State of my StatefulWidget that would be much appreciated!

Answer 1

My first issue is that this function is triggered for all the child at first before waiting for new ones which is unnecessary and could be a problem when I begin to have a lot of data.

The Firebase Realtime Database synchronizes the state of the path/query that you listen to. So it doesn't just fire an event on onChildAdded for new data, but also for any existing data that you request. There is (intentionally) no way to change that behavior.

So your options here are limited:

• You can remove the data that your application has processed, so that it doesn't get passed to the clients again. That means you essentially implement a message-passing mechanism on top of Firebase's data-synchronization semantics.

• You can use a query to only request a certain subset of the child nodes at a path. For example, if you remember the latest key that you've received, you can get data from there on with ref.orderByKey().startAt("-Mx2LastKeyYouAlreadySaw") .

Since this comes up regularly, I recommend also checking:

• How can I setup Firebase to observe only new data?

• How to get only updated data Firebase

• How to fetch only latest specific data from Firebase?

• and more from these search results

My second problem is the format of the received data:

The screenshot of your database shows two keys, each of which has a single string value. The contents of that value may be JSON, but the way they are stored is just a single string.

If you want to get a single property from the JSON, you either have to:

• Decode the string back into JSON with jsonDecode .
• Fix the problem at the source by storing the data as proper JSON, rather than as a string.