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();

Okuma ve yazma listeleri

Bir veri listesine ekleme

Ç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 çocuk eklendiğinde benzersiz bir anahtar oluşturur. Listedeki her yeni öğe için otomatik olarak oluşturulan bu anahtarları kullanarak, birkaç istemci yazma çakışmaları olmadan aynı konuma aynı anda alt öğeler ekleyebilir. push() tarafından oluşturulan benzersiz anahtar, bir zaman damgasına dayalıdı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 çocuk için set verilerini almak için push() yöntemi tarafından döndürülen yeni verilere yapılan 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 etkinliklerini dinle

Alt olaylar, push() yöntemiyle eklenen yeni bir alt öğe veya update() yöntemiyle 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 yapılan eklemeleri dinleyin. Bu olay, mevcut her alt öğe için bir kez ve ardından belirtilen yola her yeni alt öğe eklendiğinde tekrar tetiklenir. Dinleyiciye, yeni çocuğun verilerini içeren bir anlık görüntü iletilir.
child_changed Listedeki öğelerde yapılan değişiklikleri dinleyin. Bu olay, bir alt düğüm değiştirildiğinde her zaman 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 iletilen anlık görüntü, kaldırılan alt öğenin verilerini içerir.
child_moved Sıralı bir listedeki öğelerin sırasındaki 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 (mevcut sıralama yönteminize göre).

Bunların her biri, bir veritabanındaki belirli bir düğümde yapılan değişiklikleri dinlemek için birlikte 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ı dinle

Alt olayları dinlemek, veri listelerini okumak için önerilen yol 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; bu, daha sonra tek tek çocuklara erişmek için geçiş yapabilirsiniz.

Sorgu için yalnızca tek bir eşleşme olduğunda bile, anlık görüntü yine de 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 kalıp, ek çocuk eklenen olayları dinlemek yerine bir listenin tüm alt öğelerini tek bir işlemde getirmek 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 Gerçek Zamanlı Veritabanı Query sınıfını kullanabilirsiniz. Ayrıca, sıralanan sonucu belirli sayıda sonuca veya bir anahtar veya değer aralığına göre filtreleyebilirsiniz.

Verileri sırala

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

Yöntem kullanım
orderByChild() Sonuçları belirtilen alt anahtar veya iç içe alt yol 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.

Aynı anda yalnızca bir sıralama yöntemi kullanabilirsiniz. Aynı sorguda bir order-by yöntemini birden çok kez çağırmak hata verir.

Aşağıdaki örnek, bir kullanıcının yıldız sayısına göre sıralanmış en iyi gönderilerinin bir 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 dinleyiciyle birleştirildiğinde, istemciyi, her gönderinin aldığı yıldız sayısına göre sıralanan kullanıcı kimliğine dayalı olarak veritabanındaki yoldan kullanıcının gönderileriyle senkronize eden bir sorgu tanımlar. Kimlikleri dizin anahtarı olarak kullanma tekniğine veri yayma denir, bu konuda daha fazla bilgiyi Database'inizi Yapılandırı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. Aşağıdaki gibi görünen verileriniz olması durumunda, sorgular iç içe alt öğeler tarafından da sıralanabilir:

"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ış çocuğa ilişkin göreli yolu belirterek, liste öğelerimizi metrics anahtarının altındaki değerlere göre 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 bir sıralama yöntemiyle birleştirebilirsiniz.

Yöntem kullanım
limitToFirst() Sıralı sonuç listesinin başından itibaren 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ğerden büyük veya ona eşit öğeleri döndürün.
startAfter() Seçilen sıralama yöntemine bağlı olarak, belirtilen anahtar veya değerden daha büyük öğeler döndürün.
endAt() Seçilen sıralama yöntemine bağlı olarak, belirtilen anahtar veya değerden küçük veya ona eşit öğeler döndürün.
endBefore() Seçilen sıralama yöntemine bağlı olarak, belirtilen anahtar veya değerden daha az öğe döndürün.
equalTo() Seçilen sıralama yöntemine bağlı olarak, belirtilen anahtar veya değere eşit öğeleri döndürün.

Sıralama yöntemlerinin aksine, birden çok limit veya aralık işlevini 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ırla

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() kullanırsanız, başlangıçta yalnızca 100'e kadar 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önderi listesini 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 bir sorguyu tanımlar, verileri fiilen senkronize etmek için ekli bir dinleyiciye sahip olması gerekir.

Anahtar veya değere göre filtreleme

Sorgular için rasgele 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 öğelerin bulunduğu öğeleri bulmak için yararlı olabilir.

Sorgu verileri nasıl sıralanır?

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

orderByChild

orderByChild() kullanılırken, belirtilen alt anahtarı içeren veriler şu şekilde sıralanır:

  1. Belirtilen alt anahtar için null değere sahip çocuklar önce gelir.
  2. Ardından, belirtilen alt anahtar için false değerine sahip alt öğeler gelir. Birden fazla alt öğe false değerine sahipse, bunlar sözlüksel olarak anahtara göre sıralanır.
  3. Ardından, belirtilen alt anahtar için true değerine sahip alt öğeler gelir. Birden fazla alt öğe true değerine sahipse, bunlar sözlüksel olarak anahtara göre 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üksel 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üksel olarak sıralanır.
  6. Nesneler en son gelir ve artan düzende anahtara göre sözlüksel olarak sıralanır.

orderByKey

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

  1. 32 bitlik bir tamsayı olarak ayrıştırılabilen bir anahtarı olan alt öğeler, artan düzende sıralanarak önce gelir.
  2. Sırada anahtarları dize değeri olan çocuklar gelir ve sözlüksel 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 alt anahtarın değeri yerine düğümün değerinin kullanılması dışında orderByChild() ile aynıdır.

Dinleyicileri ayırın

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

Tek bir dinleyiciyi off() işlevine parametre olarak ileterek kaldırabilirsiniz. Argümansız konumda off() çağrılması, o konumdaki tüm dinleyicileri kaldırır.

Bir üst dinleyicide off() çağrısı yapmak, alt düğümlerinde kayıtlı dinleyicileri otomatik olarak kaldırmaz; off() ayrıca geri aramayı kaldırmak için tüm alt dinleyicilerde çağrılmalıdır.

Sonraki adımlar