Эта страница переведена с помощью Cloud Translation API.

Включение автономных возможностей в JavaScript

Приложения Firebase работают даже в случае временной потери сетевого соединения. В этом документе описаны несколько инструментов для мониторинга состояния и синхронизации локального состояния с состоянием сервера.

Управление присутствием

В приложениях, работающих в режиме реального времени, часто бывает полезно отслеживать подключение и отключение клиентов. Например, может потребоваться пометить пользователя как «оффлайн», когда его клиент отключается.

Клиенты Firebase Database предоставляют простые примитивы, которые можно использовать для записи в базу данных при отключении клиента от серверов Firebase Database. Эти обновления происходят независимо от того, происходит ли корректное отключение клиента или нет, поэтому вы можете рассчитывать на то, что они очистят данные даже в случае разрыва соединения или сбоя клиента. Все операции записи, включая установку, обновление и удаление, могут быть выполнены при отключении.

Вот простой пример записи данных при отключении с использованием примитива onDisconnect :

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

Как работает onDisconnect

При создании операции onDisconnect() , она выполняется на сервере Firebase Realtime Database . Сервер проверяет безопасность, чтобы убедиться, что пользователь может выполнить запрошенное событие записи, и сообщает вашему приложению, если оно недействительно. Затем сервер отслеживает соединение. Если в какой-либо момент соединение истекает по таймауту или активно закрывается клиентом Realtime Database , сервер проверяет безопасность во второй раз (чтобы убедиться, что операция по-прежнему действительна), а затем вызывает событие.

Ваше приложение может использовать функцию обратного вызова при операции записи, чтобы убедиться, что onDisconnect было установлено корректно:

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 также можно отменить, вызвав метод .cancel() :

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

Определение состояния соединения

Для многих функций, связанных с определением присутствия, вашему приложению полезно знать, находится ли оно в сети или нет. Firebase Realtime Database предоставляет специальный путь /.info/connected , который обновляется каждый раз, когда изменяется состояние подключения клиента Firebase Realtime Database . Вот пример:

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 является логическим значением, которое не синхронизируется между клиентами Realtime Database , поскольку зависит от состояния клиента. Другими словами, если один клиент считывает /.info/connected как false, это не гарантирует, что другой клиент также считывает это значение как false.

Обработка задержки

Временные метки сервера

Серверы Firebase Realtime Database предоставляют механизм для вставки временных меток, сгенерированных на сервере, в качестве данных. Эта функция в сочетании с onDisconnect обеспечивает простой и надежный способ фиксации времени отключения клиента Realtime Database :

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

Смещение тактовой частоты

Хотя firebase.database.ServerValue.TIMESTAMP гораздо точнее и предпочтительнее для большинства операций чтения/записи, иногда может быть полезно оценить расхождение во времени клиента относительно серверов Firebase Realtime Database . Вы можете добавить функцию обратного вызова к адресу /.info/serverTimeOffset , чтобы получить значение в миллисекундах, которое клиенты Firebase Realtime Database добавляют к локальному сообщаемому времени (время эпохи в миллисекундах) для оценки времени сервера. Обратите внимание, что точность этого смещения может зависеть от задержки сети, поэтому оно полезно в основном для обнаружения больших (> 1 секунды) расхождений во времени.

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

Пример приложения "Присутствие"

Сочетая операции отключения с мониторингом состояния соединения и метками времени сервера, можно создать систему определения присутствия пользователя. В этой системе каждый пользователь сохраняет данные в определенном месте базы данных, чтобы указать, находится ли клиент Realtime Database в сети. Клиенты устанавливают это местоположение в значение true, когда подключаются к сети, и метку времени, когда отключаются. Эта метка времени указывает время последнего подключения данного пользователя к сети.

Обратите внимание, что ваше приложение должно ставить операции отключения в очередь до того, как пользователь будет отмечен как находящийся в сети, чтобы избежать состояний гонки в случае потери сетевого соединения клиента до того, как обе команды будут отправлены на сервер.

Вот простая система определения присутствия пользователя:

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

Включение автономных возможностей в JavaScript Оптимизируйте свои подборки Сохраняйте и классифицируйте контент в соответствии со своими настройками.