全新推出 Cloud Firestore(测试版):试用 Firebase 和 Google Cloud Platform 全新推出的规模可扩展且灵活的数据库。详细了解 Cloud Firestore

在 JavaScript 中启用离线功能

即使暂时失去网络连接,Firebase 应用仍可正常工作。我们提供了一些工具,用于监测在线状态并将本地状态与服务器状态进行同步,本文对此进行了介绍。

管理在线状态

在实时应用中,通常需要检测客户端建立连接和断开连接的状态变化。例如,当用户的客户端断开连接时,您可能需要将该用户标记为“离线”。

Firebase 数据库客户端提供了简单的基本方法,以便在某个客户端与 Firebase 数据库服务器断开连接时将数据写入数据库。这些更新的发生与客户端是否正常断开连接无关,因此,即使突然断开连接或客户端崩溃,您仍可以依靠此类更新来清理数据。所有写入操作(包括设置、更新和移除)均可以在断开连接时执行。

在下面这个简单的示例中,我们使用 onDisconnect 基本方法在断开连接时写入数据:

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

onDisconnect 的工作方式

当您建立 onDisconnect() 操作后,它会在 Firebase 实时数据库服务器上驻留。该服务器会检查安全性,确保用户可以执行所请求的写入事件,并在该操作无效时通知您的应用。然后,服务器会监控连接状况。如果在任何时间点连接超时,或实时数据库客户端主动关闭连接,则该服务器会第二次检查安全性(以确保操作仍有效),然后触发事件。

您的应用可以在写入操作中使用回调,以确保正确附加 onDisconnect

presenceRef.onDisconnect().remove(function(err) {
  if (err) {
    console.error('could not establish onDisconnect event', err);
  }
});

还可以调用 .cancel() 来取消 onDisconnect 事件:

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

检测连接状态

对于许多与在线状态相关的功能,让您的应用了解自己处于在线还是离线状态非常有用。Firebase 实时数据库提供了 /.info/connected 这个特殊位置,每当 Firebase 实时数据库客户端的连接状态发生变化时,该位置都会更新。示例如下:

var connectedRef = firebase.database().ref(".info/connected");
connectedRef.on("value", function(snap) {
  if (snap.val() === true) {
    alert("connected");
  } else {
    alert("not connected");
  }
});

/.info/connected 是一个不在各实时数据库客户端之间同步的布尔值,因为该值取决于客户端的状态。换句话说,一个客户端的 /.info/connected 值为 false,并不代表另一个客户端的这个值也是 false。

应对延迟

服务器时间戳

Firebase 实时数据库服务器提供一种机制,用于以数据形式插入服务器上生成的时间戳。这项功能与 onDisconnect 相结合,可让您轻松可靠地记录实时数据库客户端断开连接的时间:

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

时钟偏差

虽然 firebase.database.ServerValue.TIMESTAMP 对大多数读/写操作来说要准确得多也更合适,但有时也可用于估算客户端相较于 Firebase 实时数据库服务器的时钟偏差。您可以在 /.info/serverTimeOffset 这个位置附加回调函数来获取相应值(以毫秒为单位)。Firebase 实时数据库客户端会将这个值与本地报告的时间(以毫秒为单位的 Unix 时间)相加,来估算服务器时间。请注意,这个时间差的准确性可能会受到网络延迟的影响,因此,它主要用于发现较长(> 1 秒)的时钟时间差异。

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

在线状态应用示例

通过将断开连接操作与连接状态监控和服务器时间戳相结合,您可以建立一个用户在线状态系统。在这个系统中,每位用户都可以通过在数据库中的某个位置存储数据,来表明其实时数据库客户端是否在线。客户端在自己处于在线状态时将这个位置设为 true,并记录自己断开连接时的时间戳。这个时间戳即代表该用户上次在线的时间。

请注意,将用户标记为在线之前,您的应用应将断开连接操作放入队列,以免在因客户端网络连接中断而无法将两个命令同时发送到服务器的情况下,出现争用情况。

下方是一个简单的用户在线状态系统:

// 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', function(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);
  }
});

发送以下问题的反馈:

此网页
Firebase 实时数据库
需要帮助?请访问我们的支持页面