为什么Firebase的child_added事件页面加载就返回数据？如何仅监听新插入数据？

Firebase Realtime Database的child_added事件的默认触发逻辑为：首次绑定监听时，会先将匹配当前查询条件的所有已有数据逐条触发回调执行，完成初始数据同步后，后续再有符合条件的新数据写入时才会再次触发回调。你当前的查询逻辑为limitToLast(1)，因此页面加载完成后首次监听时，会自动返回当前数据库中符合条件的最后1条历史数据，属于正常的设计逻辑，并非代码错误。

如果仅需要监听绑定之后新增的数据，可以选择以下两种常用方案实现：

• 方案1：基于时间戳过滤（更精准，推荐使用）
  绑定监听时先记录当前的初始时间戳，查询时直接筛选timestamp大于初始时间的数据，从数据源层面过滤掉历史数据，代码示例如下：

const firebaseConfig = {
  // 你的配置项
};

firebase.initializeApp(firebaseConfig);
firebase.analytics();
// 记录监听初始化的时间戳
const initTime = Date.now();
// 查询时直接过滤出时间大于初始时间的数据
var ref = firebase.database().ref().orderByChild('timestamp').startAt(initTime);

ref.on('child_added', function(snapshot) {
   // 仅监听之后新增的数据会触发回调
   console.log(snapshot.val())
});

注意使用该方案时，写入新数据的timestamp字段推荐使用Firebase服务端时间戳firebase.database.ServerValue.TIMESTAMP，避免客户端时间不准导致过滤逻辑失效。

• 方案2：标记位跳过初始历史数据
  新增标记位区分初始加载阶段和后续监听阶段，初始加载阶段触发的child_added回调直接跳过，代码示例如下：

const firebaseConfig = {
  // 你的配置项
};

firebase.initializeApp(firebaseConfig);
firebase.analytics();
// 初始加载标记，默认开启
let isInitialLoad = true;
var ref = firebase.database().ref().orderByChild('timestamp').limitToLast(1);

ref.on('child_added', function(snapshot) {
   // 初始加载阶段直接跳过处理
   if (isInitialLoad) return;
   console.log(snapshot.val())
});
// value事件会在所有初始child_added触发完成后执行，此时关闭初始加载标记
ref.once('value', () => {
  isInitialLoad = false;
});

内容的提问来源于stack exchange，提问作者Kodingan Anak Muda