Web'deki Veri Listeleriyle Çalışın

Koleksiyonlar ile düzeninizi koruyun İçeriği tercihlerinize göre kaydedin ve kategorilere ayırın.

Bir veritabanı referansı alın

Veritabanından veri okumak veya yazmak için bir firebase.database.Reference örneğine ihtiyacınız vardır:

Web version 9

import { getDatabase } from "firebase/database";

const database = getDatabase();

Web version 8

var database = firebase.database();

Listeleri okuma ve yazma

Veri listesine ekle

Çok kullanıcılı uygulamalarda bir listeye veri eklemek için push() yöntemini kullanın. push() yöntemi, belirtilen Firebase referansına her yeni bir alt öğe eklendiğinde benzersiz bir anahtar oluşturur. Listedeki her yeni öğe için bu otomatik oluşturulan anahtarları kullanarak, birkaç istemci, yazma çakışmaları olmadan aynı anda aynı konuma alt öğeler ekleyebilir. push() tarafından oluşturulan benzersiz anahtar bir zaman damgasını temel alır, bu nedenle liste öğeleri otomatik olarak kronolojik olarak sıralanır.

Çocuğun otomatik olarak oluşturulan anahtarının değerini almak veya alt öğe için veri ayarlamak için push() yöntemi tarafından döndürülen yeni verilere başvuruyu kullanabilirsiniz. Bir push() başvurusunun .key özelliği, otomatik olarak oluşturulan anahtarı içerir.

Veri yapınızı düzleştirmeyi basitleştirmek için bu otomatik oluşturulan anahtarları kullanabilirsiniz. Daha fazla bilgi için veri yayma örneğine bakın.

Örneğin, bir sosyal uygulamadaki gönderiler listesine yeni bir gönderi eklemek için push() kullanılabilir:

Web version 9

import { getDatabase, ref, push, set } from "firebase/database";

// Create a new post reference with an auto-generated id
const db = getDatabase();
const postListRef = ref(db, 'posts');
const newPostRef = push(postListRef);
set(newPostRef, {
    // ...
});

Web version 8

// Create a new post reference with an auto-generated id
var postListRef = firebase.database().ref('posts');
var newPostRef = postListRef.push();
newPostRef.set({
    // ...
});

Çocuk olaylarını dinleyin

Alt olaylar, push() yöntemiyle eklenen yeni bir alt öğe veya update() yöntemi aracılığıyla güncellenen bir alt öğe gibi bir işlemden bir düğümün alt öğelerinin başına gelen belirli işlemlere yanıt olarak tetiklenir.

Etkinlik Tipik kullanım
child_added Öğe listelerini alın veya bir öğe listesine eklemeleri dinleyin. Bu olay, mevcut her alt öğe için bir kez tetiklenir ve ardından belirtilen yola her yeni bir alt öğe eklendiğinde yeniden tetiklenir. Dinleyiciye, yeni çocuğun verilerini içeren bir anlık görüntü iletilir.
child_changed Listedeki öğelerdeki değişiklikleri dinleyin. Bu olay, bir alt düğüm her değiştirildiğinde tetiklenir. Bu, alt düğümün alt öğelerinde yapılan tüm değişiklikleri içerir. Olay dinleyicisine iletilen anlık görüntü, alt öğe için güncellenmiş verileri içerir.
child_removed Listeden kaldırılan öğeleri dinleyin. Bu olay, hemen bir alt öğe kaldırıldığında tetiklenir. Geri arama bloğuna geçirilen anlık görüntü, kaldırılan alt öğenin verilerini içerir.
child_moved Sıralı bir listedeki öğelerin sırasına ilişkin değişiklikleri dinleyin. child_moved olayları her zaman öğenin sırasının değişmesine neden olan child_changed olayını takip eder (geçerli sıralama yönteminize göre).

Bunların her biri birlikte, bir veritabanındaki belirli bir düğümde yapılan değişiklikleri dinlemek için yararlı olabilir. Örneğin, bir sosyal blog uygulaması, aşağıda gösterildiği gibi, bir gönderinin yorumlarındaki etkinliği izlemek için bu yöntemleri birlikte kullanabilir:

Web version 9

import { getDatabase, ref, onChildAdded, onChildChanged, onChildRemoved } from "firebase/database";

const db = getDatabase();
const commentsRef = ref(db, 'post-comments/' + postId);
onChildAdded(commentsRef, (data) => {
  addCommentElement(postElement, data.key, data.val().text, data.val().author);
});

onChildChanged(commentsRef, (data) => {
  setCommentValues(postElement, data.key, data.val().text, data.val().author);
});

onChildRemoved(commentsRef, (data) => {
  deleteComment(postElement, data.key);
});

Web version 8

var commentsRef = firebase.database().ref('post-comments/' + postId);
commentsRef.on('child_added', (data) => {
  addCommentElement(postElement, data.key, data.val().text, data.val().author);
});

commentsRef.on('child_changed', (data) => {
  setCommentValues(postElement, data.key, data.val().text, data.val().author);
});

commentsRef.on('child_removed', (data) => {
  deleteComment(postElement, data.key);
});

Değer olaylarını dinleyin

Alt olayları dinlemek, veri listelerini okumanın önerilen yolu olsa da, bir liste referansındaki değer olaylarını dinlemenin yararlı olduğu durumlar vardır.

Bir veri listesine bir value gözlemcisi eklemek, tüm veri listesini tek bir anlık görüntü olarak döndürür ve daha sonra tek tek çocuklara erişmek için döngüye girebilirsiniz.

Sorgu için yalnızca tek bir eşleşme olsa bile, anlık görüntü yine bir listedir; sadece tek bir öğe içerir. Öğeye erişmek için sonucun üzerinden geçmeniz gerekir:

Web version 9

import { getDatabase, ref, onValue } from "firebase/database";

const db = getDatabase();
const dbRef = ref(db, '/a/b/c');

onValue(dbRef, (snapshot) => {
  snapshot.forEach((childSnapshot) => {
    const childKey = childSnapshot.key;
    const childData = childSnapshot.val();
    // ...
  });
}, {
  onlyOnce: true
});

Web version 8

ref.once('value', (snapshot) => {
  snapshot.forEach((childSnapshot) => {
    var childKey = childSnapshot.key;
    var childData = childSnapshot.val();
    // ...
  });
});

Bu model, ek alt eklenen olayları dinlemek yerine, bir listenin tüm alt öğelerini tek bir işlemde almak istediğinizde yararlı olabilir.

Verileri sıralama ve filtreleme

Anahtara, değere veya bir alt öğenin değerine göre sıralanmış verileri almak için Realtime Database Query sınıfını kullanabilirsiniz. Ayrıca, sıralanan sonucu belirli sayıda sonuca veya bir dizi anahtar veya değere göre filtreleyebilirsiniz.

Verileri sırala

Sıralanmış verileri almak için, sonuçların nasıl sıralandığını belirlemek için sıralama yöntemlerinden birini belirterek başlayın:

Yöntem kullanım
orderByChild() Sonuçları belirtilen bir alt anahtarın veya iç içe geçmiş alt yolun değerine göre sıralayın.
orderByKey() Sonuçları alt anahtarlara göre sıralayın.
orderByValue() Sonuçları alt değerlere göre sıralayın.

Bir seferde yalnızca bir sipariş yöntemi kullanabilirsiniz. Aynı sorguda bir sipariş yönteminin birden çok kez çağrılması bir hata verir.

Aşağıdaki örnek, yıldız sayısına göre sıralanmış bir kullanıcının en iyi gönderilerinin listesini nasıl alabileceğinizi gösterir:

Web version 9

import { getDatabase, ref, query, orderByChild } from "firebase/database";
import { getAuth } from "firebase/auth";

const db = getDatabase();
const auth = getAuth();

const myUserId = auth.currentUser.uid;
const topUserPostsRef = query(ref(db, 'user-posts/' + myUserId), orderByChild('starCount'));

Web version 8

var myUserId = firebase.auth().currentUser.uid;
var topUserPostsRef = firebase.database().ref('user-posts/' + myUserId).orderByChild('starCount');

Bu, bir alt dinleyici ile birleştirildiğinde, istemciyi, her gönderinin aldığı yıldız sayısına göre sıralanmış, kullanıcı kimliğine göre veritabanındaki yoldan kullanıcının gönderileriyle senkronize eden bir sorgu tanımlar. ID'leri indeks anahtarları olarak kullanma tekniğine data fan out adı verilir, bununla ilgili daha fazla bilgiyi Veritabanınızı Yapın bölümünde okuyabilirsiniz.

orderByChild() yöntemine yapılan çağrı, sonuçların sıralanacağı alt anahtarı belirtir. Bu durumda, gönderiler ilgili "starCount" alt öğelerinin değerine göre sıralanır. Şuna benzeyen verileriniz varsa, sorgular iç içe geçmiş çocuklar tarafından da sipariş edilebilir:

"posts": {
  "ts-functions": {
    "metrics": {
      "views" : 1200000,
      "likes" : 251000,
      "shares": 1200,
    },
    "title" : "Why you should use TypeScript for writing Cloud Functions",
    "author": "Doug",
  },
  "android-arch-3": {
    "metrics": {
      "views" : 900000,
      "likes" : 117000,
      "shares": 144,
    },
    "title" : "Using Android Architecture Components with Firebase Realtime Database (Part 3)",
    "author": "Doug",
  }
},

Bu durumda, orderByChild() çağrımızda yuvalanmış alt öğeye göreli yolu belirterek, metrics anahtarının altında yuvalanmış değerlere göre liste öğelerimizi sıralayabiliriz.

Web version 9

import { getDatabase, ref, query, orderByChild } from "firebase/database";

const db = getDatabase();
const mostViewedPosts = query(ref(db, 'posts'), orderByChild('metrics/views'));

Web version 8

var mostViewedPosts = firebase.database().ref('posts').orderByChild('metrics/views');

Diğer veri türlerinin nasıl sıralandığı hakkında daha fazla bilgi için bkz. Sorgu verileri nasıl sıralanır .

Verileri filtreleme

Verileri filtrelemek için, bir sorgu oluştururken sınır veya aralık yöntemlerinden herhangi birini sıralama yöntemiyle birleştirebilirsiniz.

Yöntem kullanım
limitToFirst() Sıralı sonuç listesinin başından döndürülecek maksimum öğe sayısını ayarlar.
limitToLast() Sıralı sonuç listesinin sonundan döndürülecek maksimum öğe sayısını ayarlar.
startAt() Seçilen sıralama yöntemine bağlı olarak, belirtilen anahtar veya değere eşit veya daha büyük öğeleri döndürün.
startAfter() Seçilen sıralama yöntemine bağlı olarak belirtilen anahtar veya değerden daha büyük öğeleri döndürün.
endAt() Seçilen sıralama yöntemine bağlı olarak, belirtilen anahtar veya değere eşit veya daha küçük öğeleri döndürün.
endBefore() Seçilen sıralama yöntemine bağlı olarak, belirtilen anahtar veya değerden daha az öğeleri döndürün.
equalTo() Seçilen sıralama yöntemine bağlı olarak, belirtilen anahtara veya değere eşit öğeleri döndürün.

Sıralama yöntemlerinden farklı olarak, birden fazla limit veya aralık fonksiyonunu birleştirebilirsiniz. Örneğin, sonuçları belirli bir değer aralığıyla sınırlamak için startAt() ve endAt() yöntemlerini birleştirebilirsiniz.

Sonuç sayısını sınırlayın

Belirli bir olay için eşitlenecek maksimum çocuk sayısını ayarlamak için limitToFirst() ve limitToLast() yöntemlerini kullanabilirsiniz. Örneğin, 100'lük bir sınır ayarlamak için limitToFirst() 'i kullanırsanız, başlangıçta yalnızca en fazla 100 child_added olayı alırsınız. Firebase veritabanınızda depolanan 100'den az öğeniz varsa, her öğe için bir child_added olayı tetiklenir.

Öğeler değiştikçe, sorguya giren öğeler için child_removed olayları ve sorgudan çıkan öğeler için child_added olayları alırsınız, böylece toplam sayı 100'de kalır.

Aşağıdaki örnek, örnek blog uygulamasının tüm kullanıcılar tarafından en son 100 gönderiyi içeren bir listeyi almak için bir sorguyu nasıl tanımladığını gösterir:

Web version 9

import { getDatabase, ref, query, limitToLast } from "firebase/database";

const db = getDatabase();
const recentPostsRef = query(ref(db, 'posts'), limitToLast(100));

Web version 8

var recentPostsRef = firebase.database().ref('posts').limitToLast(100);

Bu örnek yalnızca, bağlı bir dinleyiciye sahip olması gereken verileri gerçekten senkronize etmek için bir sorgu tanımlar.

Anahtar veya değere göre filtrele

Sorgular için isteğe bağlı başlangıç, bitiş ve denklik noktaları seçmek için startAt() , startAfter() , endAt() , endBefore() ve equalTo() kullanabilirsiniz. Bu, verileri sayfalandırmak veya belirli bir değere sahip alt öğeleri olan öğeleri bulmak için yararlı olabilir.

Sorgu verileri nasıl sıralanır?

Bu bölüm, verilerin Query sınıfındaki sıralama yöntemlerinin her birine göre nasıl sıralandığını açıklar.

orderByChild

orderByChild() kullanılırken, belirtilen alt anahtarı içeren veriler aşağıdaki gibi sıralanır:

  1. Belirtilen alt anahtar için null değeri olan çocuklar önce gelir.
  2. Ardından, belirtilen alt anahtar için false değeri olan çocuklar gelir. Birden çok alt öğe false değerine sahipse, bunlar anahtara göre sözlükbilimsel olarak sıralanır.
  3. Daha sonra belirtilen alt anahtar için true değerine sahip çocuklar gelir. Birden çok alt öğe true değerine sahipse, bunlar anahtara göre sözlükbilimsel olarak sıralanır.
  4. Sayısal değeri olan çocuklar, artan düzende sıralanır. Birden çok alt öğe, belirtilen alt düğüm için aynı sayısal değere sahipse, bunlar anahtara göre sıralanır.
  5. Dizeler sayılardan sonra gelir ve sözlükbilimsel olarak artan düzende sıralanır. Birden çok alt öğe, belirtilen alt düğüm için aynı değere sahipse, anahtara göre sözlükbilimsel olarak sıralanır.
  6. Nesneler en son gelir ve anahtara göre artan düzende sözlükbilimsel olarak sıralanır.

orderByKey

Verilerinizi sıralamak için orderByKey() kullanırken, veriler anahtara göre artan sırada döndürülür.

  1. 32-bit tamsayı olarak ayrıştırılabilen bir anahtarı olan çocuklar, artan düzende sıralanarak önce gelir.
  2. Anahtar olarak dize değerine sahip çocuklar, sözlükbilimsel olarak artan düzende sıralanır.

orderByValue

orderByValue() kullanılırken, çocuklar değerlerine göre sıralanır. Sıralama ölçütleri, belirtilen bir alt anahtarın değeri yerine düğümün değerinin kullanılması dışında orderByChild() ile aynıdır.

Dinleyicileri ayır

Firebase veritabanı referansınızdaki off() yöntemi çağrılarak geri aramalar kaldırılır.

off() öğesine parametre olarak ileterek tek bir dinleyiciyi kaldırabilirsiniz. Argümansız konumda off() öğesinin çağrılması, o konumdaki tüm dinleyicileri kaldırır.

Bir üst dinleyicide off() öğesinin çağrılması, alt düğümlerinde kayıtlı dinleyicileri otomatik olarak kaldırmaz; off() , geri aramayı kaldırmak için herhangi bir alt dinleyicide de çağrılmalıdır.

Sonraki adımlar