javascript - 移动 HTML5 应用程序本地存储

Question

快速概述我所拥有的以及与之相关的问题。我有一个 HTML5 应用程序，我将使用 PhoneGap 作为 native 应用程序运行。它是本地野外研究站的小型数据收集应用程序。

这个现场站的问题是它们很容易丢失信号来传输数据；因此我想将数据存储在设备上供以后使用(或将其发送到服务器)。

需要保存的数据如下:

*User Name (string)
*Transect Color (string)
*Transect Number (int)
*Transect Board (char)
*Salamander Name (string)
*Snount-Vent Length (int)
*Total Length (int)
*Centipedes (int)
*Red-Black Millipedes (int)
*Brown Round Millipedes (int)
*Brown Flat Millipedes (int)

应用程序本身将是一个独立的应用程序，所以我希望它有一种方法来保存数据。

结合使用 jQuery 和 HTML5，最好的方法是什么？我知道 Web SQL 已被弃用，但我相信这可能是我存储此数据的唯一方式。如果不是，在发送前动态存储 X 个条目的最佳方法是什么？

感谢您的帮助。

编辑:

当研究人员必须进行“全断面”时，这种情况如何...

研究人员必须从一个地方到另一个地方，直到完成每个样带的 20 次完整数据收集。这需要 20 个不同的位置，每个位置都有不同数量的火蜥蜴和小动物进入。

当 localstorage 只允许键值对时，您将如何存储更大的数据集以在最后卸载？

Answer 1

我非常喜欢包装 localStorage在迷你键值存储中:

window.storage = {
  store:localStorage,
  get: function( key ) {
    try {
      return JSON.parse(this.store[key]);
    } catch(e) {};
    return undefined;
  },
  set: function( key, value) {
    try {
      this.store[key] = JSON.stringify(value);
    } catch(e) {};
  }
}

这使您能够直接引用 window.storage。假设您将描述的字段封装在一个名为 row 的哈希中，您现在可以直接序列化:

storage.set('myrow', row);

由于存储在 row 中的数据将被序列化，因此您可以创建一个 document，其中包含比单个 SQL 行可能包含的信息更多的信息:

var document = {
  property: 'foo',
  nestedArray: [ 'foo', 'bar', 'baz' ],
  nestedObj: { 'key': 'foo', 'key2': 'foo' }
}

storage.set('transectID', document);

...你明白了。关键是您甚至可以通过 JSON.stringify 减少非常丰富的数据并以可恢复的形式保存。