关于本地存储localForage

以前使用本地存储,首先会想到localstorage或者session storage,将要存储的数据转化成字符串后进行setItem操作,但是使用local storage 有几个问题:
1、它是同步的,不管数据多大,我们需要等待数据从磁盘读取和解析,这会减慢我们的应用程序的响应速度,如果放到移动设备上,可想而之。
2、仅支持字符串,如果是存对象还需要将对象JSON.stringify({name:”houyuewei”,age:20})下,用的时候再次转换,真是麻烦。
3、不能加密存储到硬盘上,增加了很多危险性。
4、永久存储,并且存储容量限制在10M

LocalForage就解决了上面的问题,Mozilla 开发了一个叫 localForage 的库 ,使得离线数据存储在任何浏览器都是一项容易的任务。localForage 是一个使用非常简单的 JavaScript 库的,提供了 get,set,remove,clear 和 length 等等 API,还具有以下特点:
支持回调的异步 API;
支持 IndexedDB,WebSQL 和 localStorage 三种存储模式;
支持 BLOB 和任意类型的数据,让您可以存储图片,文件等。
支持 ES6 Promises
支持angularjs,requires,embers等

安装
可以通过npm或者bower安装

npm install localforage

或者

bower install localforage

基本用法:

key/value
localforage.setItem('key', 'value', doSomethingElse);
对象
var obj = { value: "hello world" };
localforage.setItem('key', obj, function(err, result) { alert(result.value); });

回调
localforage.getItem('key', function(err, value) {
    if (err) {
        console.error('Oh noes!');
    } else {
        alert(value);
    }
});

存储 Blobs,TypedArray(具体的类型附在参考链接中),其他的js对象
为了支持这几种类型,需要做一个配置,如下:

localforage.config({
    driver      : localforage.WEBSQL, // Force WebSQL; same as using setDriver()
    name        : 'myApp',
    version     : 1.0,
    size        : 4980736, // Size of database, in bytes. WebSQL-only for now.
    storeName   : 'keyvaluepairs', // Should be alphanumeric, with underscores.
    description : 'some description'
});

参考链接:https://developer.mozilla.org/en-US/Apps/Build/Offline
https://github.com/mozilla/localForage#how-to-use-localforage
https://mozilla.github.io/localForage/#setitem
http://www.html5rocks.com/en/tutorials/offline/storage/
http://www.html5rocks.com/en/tutorials/offline/whats-offline/
https://www.nczonline.net/blog/2010/04/13/towards-more-secure-client-side-data-storage/

  • 6
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值