JavaScript'te Çevrimdışı Özellikleri Etkinleştirme

Uygulamanızın ağ bağlantısı geçici olarak kopsa bile Firebase uygulamaları, çalışmaya devam eder. Mevcut durumu izlemek ve yerel durumu sunucu durumuyla senkronize etmek için çeşitli araçlar sağlıyoruz. Bu araçlardan söz ediyoruz.

Varlığı Yönetme

Gerçek zamanlı uygulamalarda istemcilerin ne zaman bağlanıp bağlantıyı ne zaman kestiğini algılamak genellikle yararlıdır. Örneğin, istemcisinin bağlantısı kesildiğinde bir kullanıcıyı "çevrimdışı" olarak işaretlemek isteyebilirsiniz.

Firebase Veritabanı istemcileri, bir istemci Firebase Veritabanı sunucularıyla olan bağlantıyı kestiğinde veritabanına yazmak için kullanabileceğiniz basit temel öğeler sunar. Bu güncellemeler, istemcinin bağlantısının kesilmesinden bağımsız olarak gerçekleşir. Bu nedenle, bağlantı kesilse veya istemci çökse bile verileri temizleme konusunda bu güncellemelere güvenebilirsiniz. Ayarlama, güncelleme ve kaldırma dahil tüm yazma işlemleri, bağlantı kesildikten sonra gerçekleştirilebilir.

Bağlantı kesildikten sonra onDisconnect temel öğesini kullanarak veri yazmayla ilgili basit bir örneği burada bulabilirsiniz:

Web

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

const db = getDatabase();
const presenceRef = ref(db, "disconnectmessage");
// Write a string when this client loses connection
onDisconnect(presenceRef).set("I disconnected!");
rtdb_ondisconnect_simple.js

Web

var presenceRef = firebase.database().ref("disconnectmessage");
// Write a string when this client loses connection
presenceRef.onDisconnect().set("I disconnected!");
offline.js

OnBağlantıyı Kesmenin İşleyiş Şekli

Oluşturduğunuz onDisconnect() işlemleri Firebase Realtime Database sunucusunda bulunur. Sunucu, kullanıcının istenen yazma etkinliğini gerçekleştirebildiğinden emin olmak için güvenliği kontrol eder ve geçersizse uygulamanızı bilgilendirir. Ardından sunucu bağlantıyı izler. Herhangi bir noktada bağlantı zaman aşımına uğrarsa veya Realtime Database istemcisi tarafından etkin bir şekilde kapatılırsa sunucu, işlemin hâlâ geçerli olduğundan emin olmak için güvenliği ikinci kez kontrol eder ve ardından etkinliği çağırır.

Uygulamanız, onDisconnect öğesinin doğru şekilde eklendiğinden emin olmak için yazma işleminde geri çağırma işlevini kullanabilir:

Web

onDisconnect(presenceRef).remove().catch((err) => {
  if (err) {
    console.error("could not establish onDisconnect event", err);
  }
});
rtdb_ondisconnect_callback.js

Web

presenceRef.onDisconnect().remove((err) => {
  if (err) {
    console.error("could not establish onDisconnect event", err);
  }
});
offline.js

onDisconnect etkinlikleri .cancel() çağrısı yapılarak da iptal edilebilir:

Web

const onDisconnectRef = onDisconnect(presenceRef);
onDisconnectRef.set("I disconnected");
// some time later when we change our minds
onDisconnectRef.cancel();
rtdb_ondisconnect_cancel.js

Web

var onDisconnectRef = presenceRef.onDisconnect();
onDisconnectRef.set("I disconnected");
// some time later when we change our minds
onDisconnectRef.cancel();
offline.js

Bağlantı Durumunu Algılama

Uygulamanızın, çevrimiçi veya çevrimdışı olduğunu bilmesi, varlığıyla ilgili birçok özellik için yararlıdır. Firebase Realtime Database, /.info/connected istemcisinin bağlantı durumu her değiştiğinde güncellenen /.info/connected adresinde özel bir konum sağlar. Aşağıda bir örnek verilmiştir:

Web

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

const db = getDatabase();
const connectedRef = ref(db, ".info/connected");
onValue(connectedRef, (snap) => {
  if (snap.val() === true) {
    console.log("connected");
  } else {
    console.log("not connected");
  }
});
rtdb_detect_connection_state.js

Web

var connectedRef = firebase.database().ref(".info/connected");
connectedRef.on("value", (snap) => {
  if (snap.val() === true) {
    console.log("connected");
  } else {
    console.log("not connected");
  }
});
offline.js

/.info/connected, istemcinin durumuna bağlı olduğu için Realtime Database istemcileri arasında senkronize edilmeyen bir boole değeridir. Diğer bir deyişle, bir istemci /.info/connected değerini yanlış olarak okursa bu, ayrı bir istemcinin de yanlış okuduğu anlamına gelmez.

Gecikmeyle Başa Çıkma

Sunucu Zaman Damgaları

Firebase Realtime Database sunucuları, sunucuda oluşturulan zaman damgaları Bu özellik, onDisconnect ile birlikte kullanıldığında, Realtime Database istemcisinin bağlantısının kesildiği zamanı güvenilir bir şekilde not etmenin kolay bir yolunu sunar:

Web

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

const db = getDatabase();
const userLastOnlineRef = ref(db, "users/joe/lastOnline");
onDisconnect(userLastOnlineRef).set(serverTimestamp());
rtdb_set_server_timestamp.js

Web

var userLastOnlineRef = firebase.database().ref("users/joe/lastOnline");
userLastOnlineRef.onDisconnect().set(firebase.database.ServerValue.TIMESTAMP);
offline.js

Saat Sapma

firebase.database.ServerValue.TIMESTAMP çok daha doğru sonuç verir ve çoğu okuma/yazma işlemi için tercih edilir. Bununla birlikte, bazen Firebase Realtime Database sunucularına göre istemcinin saat sapmasını tahmin etmek yararlı olabilir. Firebase Realtime Database istemcinin sunucu süresini tahmin etmek amacıyla bildirilen yerel süreye (milisaniye cinsinden dönem süresi) eklediği değeri milisaniye cinsinden elde etmek için /.info/serverTimeOffset konumuna bir geri çağırma ekleyebilirsiniz. Bu ofsetin doğruluğunun ağ gecikmesinden etkilenebileceğini ve bu nedenle, temel olarak saat zamanındaki büyük (> 1 saniye) tutarsızlıkları tespit etmek için yararlı olduğunu unutmayın.

Web

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

const db = getDatabase();
const offsetRef = ref(db, ".info/serverTimeOffset");
onValue(offsetRef, (snap) => {
  const offset = snap.val();
  const estimatedServerTimeMs = new Date().getTime() + offset;
});
rtdb_estimate_clock_skew.js

Web

var offsetRef = firebase.database().ref(".info/serverTimeOffset");
offsetRef.on("value", (snap) => {
  var offset = snap.val();
  var estimatedServerTimeMs = new Date().getTime() + offset;
});
offline.js

Örnek Mevcutluk Uygulaması

Bağlantıyı kesme işlemlerini bağlantı durumu izleme ve sunucu zaman damgalarıyla birleştirerek bir kullanıcı varlığı sistemi oluşturabilirsiniz. Bu sistemde her kullanıcı, Realtime Database istemcisinin online olup olmadığını belirtmek için verileri bir veritabanı konumunda depolar. İstemciler, internete bağlandıklarında bu konumu doğru olarak, bağlantıyı kestiklerinde ise bir zaman damgası olarak ayarlar. Bu zaman damgası, söz konusu kullanıcının en son ne zaman çevrimiçi olduğunu gösterir.

İstemcinin ağ bağlantısı, her iki komut da sunucuya gönderilmeden önce kaybedildiğinde yarış koşullarının oluşmasını önlemek için uygulamanızın, kullanıcı çevrimiçi olarak işaretlenmeden önce bağlantıyı kesme işlemlerini sıraya alması gerektiğini unutmayın.

Basit bir kullanıcı varlığı sistemi aşağıda verilmiştir:

Web

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

// Since I can connect from multiple devices or browser tabs, we store each connection instance separately
// any time that connectionsRef's value is null (i.e. has no children) I am offline
const db = getDatabase();
const myConnectionsRef = ref(db, 'users/joe/connections');

// stores the timestamp of my last disconnect (the last time I was seen online)
const lastOnlineRef = ref(db, 'users/joe/lastOnline');

const connectedRef = ref(db, '.info/connected');
onValue(connectedRef, (snap) => {
  if (snap.val() === true) {
    // We're connected (or reconnected)! Do anything here that should happen only if online (or on reconnect)
    const con = push(myConnectionsRef);

    // When I disconnect, remove this device
    onDisconnect(con).remove();

    // Add this device to my connections list
    // this value could contain info about the device or a timestamp too
    set(con, true);

    // When I disconnect, update the last time I was seen online
    onDisconnect(lastOnlineRef).set(serverTimestamp());
  }
});
rtdb_sample_presence_app.js

Web

// Since I can connect from multiple devices or browser tabs, we store each connection instance separately
// any time that connectionsRef's value is null (i.e. has no children) I am offline
var myConnectionsRef = firebase.database().ref('users/joe/connections');

// stores the timestamp of my last disconnect (the last time I was seen online)
var lastOnlineRef = firebase.database().ref('users/joe/lastOnline');

var connectedRef = firebase.database().ref('.info/connected');
connectedRef.on('value', (snap) => {
  if (snap.val() === true) {
    // We're connected (or reconnected)! Do anything here that should happen only if online (or on reconnect)
    var con = myConnectionsRef.push();

    // When I disconnect, remove this device
    con.onDisconnect().remove();

    // Add this device to my connections list
    // this value could contain info about the device or a timestamp too
    con.set(true);

    // When I disconnect, update the last time I was seen online
    lastOnlineRef.onDisconnect().set(firebase.database.ServerValue.TIMESTAMP);
  }
});
offline.js