Backbone.dualStorage 使用教程

1. 项目介绍

Backbone.dualStorage 是一个为 Backbone.js 设计的同步适配器，它可以将数据保存在本地 localStorage 数据库中，同时作为远程模型的缓存。当客户端离线时，用户仍然可以创建、更新和删除记录，这些更改将在客户端重新上线时同步到服务器。

2. 项目快速启动

首先，确保您已经包含了 Backbone.js 文件。然后，将 Backbone.dualStorage.js 文件包含到您的项目中：

<script type="text/javascript" src="backbone.js"></script>
<script type="text/javascript" src="backbone.dualstorage.js"></script>

创建您的模型和集合：

SomeCollection = Backbone.Collection.extend({
  // 可以设置 remote 或 local 属性来控制同步行为
  remote: true, // 从不缓存，完全跳过 dualStorage
  local: true   // 总是本地存储，从不远程保存
});

// 创建一个模型实例
var model = new SomeCollection({name: "example"});

3. 应用案例和最佳实践

离线数据同步

当客户端离线时，您仍然可以进行数据操作：

// 客户端在线，加载数据
people.fetch(); // 从服务器加载数据并保存到 localStorage

// 客户端离线，执行数据操作
people.create({name: "Turing"}); // 创建新记录
people.models[0].save({age: 41}); // 更新记录
people.models[1].destroy(); // 删除记录

// 客户端重新上线，同步更改
people.syncDirtyAndDestroyed(); // 将更改发送到服务器并更新 localStorage

检测离线状态

Backbone.dualStorage 会将 Ajax 状态码为 0 的情况视为离线。您可以自定义其他状态码来检测离线状态：

Backbone.DualStorage.offlineStatusCodes = function(xhr) {
  var codes = [];
  if (xhr.status === 503) { // 例如，服务器不可用
    codes.push(503);
  }
  return codes;
};

数据解析

如果需要自定义从远程服务器解析数据的方式，可以使用 parseBeforeLocalSave 方法：

var MyModel = Backbone.Model.extend({
  parseBeforeLocalSave: function(response) {
    // 解析远程数据
    return parsedData;
  }
});

4. 典型生态项目

由于 Backbone.dualStorage 是为 Backbone.js 设计的，因此它适用于任何使用 Backbone.js 构建的项目，特别是那些需要离线功能的项目。在开源生态中，可以找到许多集成了 Backbone.dualStorage 的项目，它们为 Backbone.js 提供了增强的离线数据同步能力。