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

Varlığı Yönetme

Gerçek zamanlı uygulamalarda, istemcilerin ne zaman bağlanıp kesildiğini tespit etmek genellikle kullanışlı olur. Ö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 bağlantısı kesildiğ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 gibi 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:

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

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

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

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

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

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

Evde olmayla ilgili birçok özellik için uygulamanızın ne zaman çevrimiçi mi yoksa çevrimdışı mı olduğunu bilmesi faydalı olur. Firebase Realtime Database, /.info/connected adresinde özel bir konum sağlar. Bu konum, Firebase Realtime Database istemcisinin bağlantı durumu her değiştiğinde güncellenir. Bir örnek verelim:

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

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, değer istemcinin durumuna bağlı olduğundan Realtime Database istemcileri arasında senkronize edilmeyen bir boole değeridir. Diğer bir deyişle, bir istemci /.info/connected öğesini false olarak okursa bu, ayrı bir istemcinin de false olarak okuyacağını garanti etmez.

İşleme Gecikmesi

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

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

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

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

Örnek Varlık Uygulaması

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

Her iki komut da sunucuya gönderilmeden önce istemcinin ağ bağlantısının kesilmesi durumunda, olabilecek yarış koşullarını önlemek için uygulamanızın, bağlantı kesme işlemlerini kullanıcı online olarak işaretlenmeden önce sıraya koyması gerektiğini unutmayın.

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

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

// 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