localForage:离线存储的改进版本

wmui 发布于2019-08-20 11:57 / 1183人阅读

摘要：获取数据并使用回调函数移除对应的键清除所有键。对数据库中的每一个键值对调用回调函数，回调函数的参数分别是键值键索引迭代次数基于。

前言

最近在看IDB，IDB是一种对象数据库存储方式，查询数据有游标法、事务法、索引法，使用的API很多，比较难记。

localForage是一个改善web-app离线数据存储的JavaScript库，核心在于使用一个和localStorage类似的API，比较简单好记。而且存储的数据类型不只是字符串，可以是数值、对象、布尔值、数组，但是undefined除外。默认情况下，依次优先采用使用IDB、WebSQL、localStorage进行后台存储。
使用localForage只需要在页面包含js文档即可，下载链接：
https://github.com/localForag...
该项目的具体GITHUB地址

API

1）setItem(key, value, successCallback)：创建一个键，参数是键名、键值、回调函数，回调函数的参数是对应的键值。

// Unlike localStorage, you can store non-strings.
localforage.setItem("my array", [1, 2, "three"]).then(function(value) {
    // This will output `1`.
    console.log(value[0]);
}).catch(function(err) {
    // This code runs if there were any errors
    console.log(err);
});

2）getItem(key, successCallback):获取数据并使用回调函数

localforage.getItem("somekey", function(err, value) {
    // Run this code once the value has been
    // loaded from the offline store.
    console.log(value);
});

3）removeItem(key, successCallback)：移除对应的键

localforage.removeItem("somekey").then(function() {
    // Run this code once the key has been removed.
    console.log("Key is cleared!");
}).catch(function(err) {
    // This code runs if there were any errors
    console.log(err);
});

4）clear(successCallback)：清除所有键。

localforage.clear().then(function() {
    // Run this code once the database has been entirely deleted.
    console.log("Database is now empty.");
}).catch(function(err) {
    // This code runs if there were any errors
    console.log(err);
});

5）length(successCallback)：获得离线存储的总的键数。

localforage.length().then(function(numberOfKeys) {
    // Outputs the length of the database.
    console.log(numberOfKeys);
}).catch(function(err) {
    // This code runs if there were any errors
    console.log(err);
});

6）key(keyIndex, successCallback)：根据键索引得到键值。
7）keys(successCallback)：得到所有的键索引。
8）iterate(iteratorCallback, successCallback)：对数据库中的每一个键值对调用回调函数，回调函数的参数分别是键值、键索引、迭代次数（基于1）。

// The same code, but using ES6 Promises.
localforage.iterate(function(value, key, iterationNumber) {
    // Resulting key/value pair -- this callback
    // will be executed for every item in the
    // database.
    console.log([key, value]);
}).then(function() {
    console.log("Iteration has completed");
}).catch(function(err) {
    // This code runs if there were any errors
    console.log(err);
});

或许并不一定要迭代所有的键值对，此时只要返回一个非undefined类型值，就可以提前结束迭代，这个返回值会作为successCallback的参数。这个方法有点问题，返回的值不太对：



  
    Listing 2.1

前面提到，localForage在默认情况下会优先采用使用IDB、WebSQL、localStorage进行后台存储，但是可以通过setDriver()进行后台设置，如果设置的机制在当前浏览器并不支持，则还是按照默认选择。
setDriver(driverName)/setDriver([driverName, nextDriverName]):设置后台支持机制，参数是localforage.INDEXEDDB、localforage.WEBSQL、localforage.LOCALSTORAGE。

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/80721.html

localForage:离线存储的改进版本

摘要：获取数据并使用回调函数移除对应的键清除所有键。对数据库中的每一个键值对调用回调函数，回调函数的参数分别是键值键索引迭代次数基于。前言最近在看IDB，IDB是一种对象数据库存储方式，查询数据有游标法、事务法、索引法，使用的API很多，比较难记。 localForage是一个改善web-app离线数据存储的JavaScript库，核心在于使用一个和localStorage类似的API，...

wind3110991 2019-08-01 15:53 评论0 收藏0
【译】渐进式 Web App 的离线存储

摘要：离线存储数据的建议对寻址资源，使用这是的一部分。在到达储量限制之前，两种存储机制都会一直进行存储。则没有对存储量做出限制，只是在之后会弹出提醒。是异步的基于回调函数，但它同样不支持。也是异步的基于回调函数，在和中可以工作虽然使用的是同步。拖拖拉拉好久，终于把个人博客整出来了。鸣谢 @pinggod。厚着脸安利一下，地址是 http://www.wemlion.com/。欢迎访问，欢...

Joyven 2019-08-21 14:19 评论0 收藏0
【译】渐进式 Web App 的离线存储

摘要：离线存储数据的建议对寻址资源，使用这是的一部分。在到达储量限制之前，两种存储机制都会一直进行存储。则没有对存储量做出限制，只是在之后会弹出提醒。是异步的基于回调函数，但它同样不支持。也是异步的基于回调函数，在和中可以工作虽然使用的是同步。拖拖拉拉好久，终于把个人博客整出来了。鸣谢 @pinggod。厚着脸安利一下，地址是 http://www.wemlion.com/。欢迎访问，欢...

Charlie_Jade 2019-08-06 13:16 评论0 收藏0
浏览器端数据库存储方案的整理 -- indexDB 和 localStorage

摘要：简介离线存储，提供强大的封装专业封装给封装类似类似接口如果你熟悉那一定会用使用类似的接口操作基于的浏览器端数据库基于的浏览器端数据库小型数据库，浏览器端基于风格的接口，让它非常可爱查看原文有些安全性不太重要的数据，我不想花大力气搞一台服务器，再安装mysql或者 monogdb，再写点rest接口。这也太麻烦了，浏览器里本来就有很好用的数据库。你为什么不尝试一下呢？ 1. 客户端存...

NusterCache 2019-08-26 11:57 评论0 收藏0
浏览器端数据库存储方案的整理 -- indexDB 和 localStorage

摘要：简介离线存储，提供强大的封装专业封装给封装类似类似接口如果你熟悉那一定会用使用类似的接口操作基于的浏览器端数据库基于的浏览器端数据库小型数据库，浏览器端基于风格的接口，让它非常可爱查看原文有些安全性不太重要的数据，我不想花大力气搞一台服务器，再安装mysql或者 monogdb，再写点rest接口。这也太麻烦了，浏览器里本来就有很好用的数据库。你为什么不尝试一下呢？ 1. 客户端存...

wudengzan 2019-06-26 17:40 评论0 收藏0