localforage.js是一个高效而强大的离线存储插件-BFW插件库

localforage.js是一个高效而强大的离线存储插件

localforage.js是一个高效而强大的离线存储插件。它封装了 IndexedDB、WebSQL、localStorage,并且提供了一个简化的类似 localStorage 的 API，如 get，set，remove，clear 和 length 等等 API

特点

支持回调的异步 API；

支持 IndexedDB，WebSQL 和 localStorage 三种存储模式（自动为你加载最佳的驱动程序）；

支持 BLOB 和任意类型的数据，让您可以存储图片，文件等等;

支持 ES6 Promises；

对 IndexedDB 和 WebSQL 的支持使您可以为您的 Web 应用程序存储更多的数据，要比 localStorage 5M 存储的多很多。其 API 的无阻塞性质使得您的应用程序更快，不会因为 Get/Set 调用而挂起主线程。

localforage的逻辑是这样的：优先使用IndexedDB存储数据，如果浏览器不支持，使用WebSQL，浏览器再不支持，使用localStorage。

快速引用

<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/localforage.min.js"></script>
<script>localforage.getItem('something', myCallback);</script>

如果在npm中，可以使用npm install localforage来安装

提供的方法

getItem(), setItem(), removeItem(), clear(), key(), keys() or length().

如果要指定数据的存储方式，可以在以上这些方法调用直接通过config设定数据存储方法，代码如下：

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'
});

完整代码

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" />
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/localforage.min.js"></script>
    <script type="text/javascript">
        localforage.setItem('name', 'bfw').then(() => {
          console.log('名字设置成功');
         
          localforage.getItem('name').then(value => {
            console.log('name', value)
          })
        })
    </script>
    <style>
    </style>
</head>

<body>

</body>

</html>

github地址：https://github.com/localForage/localForage