- 综合排序
- 最热优先
- 最新优先
- 来自专栏前端Q
对不起 localStorage，现在我爱上 localForage了！
But.....关于 indexedDB 的介绍就到此为止，详细使用在此不再赘述，因为本篇文章我重点想介绍的是 localForage！ 什么是 localForage localForage 是基于 indexedDB 封装的库，通过它我们可以简化 IndexedDB 的使用。 但是你也不必太过担心，因为 localforage 已经帮你消除了这个心智负担，它有一个优雅降级策略，若浏览器不支持 IndexedDB 或 WebSQL，则使用 localStorage。 localForage 的使用 下载 import localforage from 'localforage' 创建一个 indexedDB const myIndexedDB = localforage.createInstance // store/indexedDB.ts import { defineStore } from 'pinia' import localforage from 'localforage' export
1.2K20编辑于 2023-10-18 - 来自专栏编程时光
📚现代化浏览器本地存储解决方案以及落地实践
原理 存储后端的自动选择 localforage在底层使用了异步存储API来存储数据。它会自动检测浏览器支持的存储后端，并选择最适合的后端。 而在获取数据时，localforage会自动将存储的序列化数据反序列化为JavaScript原生数据类型。 存储容量限制 需要注意的是，虽然localforage可以提供比Cookie更大的存储容量，但不同的浏览器和存储后端对于本地存储的容量限制是有差异的。 每当输入框的值发生变化时，setData会更新组件状态并且自动将数据存储到localforage中。而在组件初始化时，会尝试从localforage中获取之前存储的数据，并且作为初始状态。 import { useCallback, useEffect, useRef, useState } from 'react'; import localforage from 'localforage
70110编辑于 2023-07-27 - 来自专栏前端自习课
【Web技术】1924- 非常好用的本地存储方案
那就是 localforage github地址[1] localforage localForage 是一个 JavaScript 库，只需要通过简单类似 localStorage API 的异步存储来改进你的 的基础用法 安装 # 通过 npm 安装： npm install localforage 复制代码 // 直接引用 <script src="<em>localforage</em>.js"></script> <script >console.log('localforage is: ', localforage);</script> 复制代码 获取存储 getItem(key, successCallback) 从仓库中获取 localforage.clear() 将会删除离线仓库中的所有值。谨慎使用此方法。 用上了localforage一开始我也以为可以完全满足万恶的产品了，然而。。。
66610编辑于 2024-01-14 - 来自专栏趣学前端
突破 localStorage 局限：localForage 在新零售缓存策略中的性能突围
为了突破这些局限，localForage 应运而生。localForage 是一个简单易用的 JavaScript 库，它为前端本地存储提供了更强大、更灵活的解决方案。 1、localForage1.1 LocalForage 概述LocalForage 是一个简单易用的 JavaScript 库，主要用于在 Web 应用程序中进行本地数据存储。 1.2 localForage 基本用法1.2.1 安装可以通过 npm 或直接引入脚本的方式来使用 localForage。 /1.10.0/localforage.min.js"></script>1.2.2 架构解析localForage 主要由核心模块、存储驱动模块和工具模块组成。 localForage 在新零售缓存策略中的应用，首先介绍了 localForage 的基本概念，包括其跨浏览器支持、异步操作和优雅的降级策略。
52510编辑于 2025-05-29 - 来自专栏前端技术江湖
前端最能打的本地存储方案
那就是 localforage localforage localForage 是一个 JavaScript 库，只需要通过简单类似 localStorage API 的异步存储来改进你的 Web 应用程序的离线体验 的基础用法 安装 # 通过 npm 安装： npm install localforage 复制代码 // 直接引用 <script src="<em>localforage</em>.js"></script> <script >console.log('localforage is: ', localforage);</script> 复制代码 获取存储 getItem(key, successCallback) 从仓库中获取 localforage.clear() 将会删除离线仓库中的所有值。谨慎使用此方法。 用上了localforage一开始我也以为可以完全满足万恶的产品了，然而。。。
87610编辑于 2023-09-25 - 来自专栏全栈修仙之路
Ionic 开发之 Ionic Storage 详解
更多的选项，请参阅 localForage 配置文档：https://github.com/localForage/localForage#configuration 注意：任何自定义配置将与默认配置合并 from 'localforage'; import CordovaSQLiteDriver from 'localforage-cordovasqlitedriver'; export class return LocalForage.WEBSQL; case 'localstorage': return LocalForage.LOCALSTORAGE; } }); } // https://github.com/localForage/localForage/blob/master/src/localforage.js const DefaultDrivers 它只是对 localForage 的 API 进行简单的封装，实际的存储功能还是交由 localForage 来完成，感兴趣的小伙伴可以研究一下。
4.6K10发布于 2019-11-06 - 来自专栏code秘密花园
前端最能打的本地存储方案
那就是 localforage github地址[1] localforage localForage 是一个 JavaScript 库，只需要通过简单类似 localStorage API 的异步存储来改进你的 的基础用法 安装 # 通过 npm 安装： npm install localforage 复制代码 // 直接引用 <script src="<em>localforage</em>.js"></script> <script >console.log('localforage is: ', localforage);</script> 复制代码 获取存储 getItem(key, successCallback) 从仓库中获取 localforage.clear() 将会删除离线仓库中的所有值。谨慎使用此方法。 用上了localforage一开始我也以为可以完全满足万恶的产品了，然而。。。
1.1K30编辑于 2023-09-11 - 来自专栏yetonwoo
探索 | 我只是想保存一个 Key！
这个库简化操作 localForage 具有两种方法，回调 API 和 Promise，你可以根据需求自行选择 这里是一个简单的示例： // sw.js self.importScripts("https ://registry.npmmirror.com/localforage/1.10.0/files/dist/localforage.js"); self.addEventListener("fetch ", (event) => { localforage.setItem("Information", "Token BBB-BBB-BBB").then(() => { localforage.getItem ("Information").then((e) => { console.log(e); }); }); }); 输出结果如下： 当然，localforage 还提供了无 Promise 版（同步函数），但是由于 Service Worker 基于 Promise 实现，所以 localforage 无法使用 localStorage 这类同步函数，因此，你获得的返回结果仍然为 Promise
39310编辑于 2024-05-04 - 来自专栏无限可能的程序开发
前端下载超大文件的完整方案
文档地址： localforage 下面展示 LocalForage 中使用 IndexedDB 存储引擎并结合 async/await 进行异步操作 const localforage = require ('localforage'); // 配置 LocalForage localforage.config({ driver: localforage.INDEXEDDB, // 使用 IndexedDB ('key', 'value'); console.log('数据保存成功'); // 获取数据 const value = await localforage.getItem 如果你有特殊的需求或者对性能有更高的要求，可以使用 localforage.close() 方法来关闭连接。 使用 LocalForage 来删除 IndexedDB 中的所有数据 import localforage from 'localforage'; // 使用 clear() 方法删除所有数据 localforage.clear
1.8K10编辑于 2024-03-27 - 来自专栏教案生成平台
【教案生成平台】实战教程五：系统优化与工程化实践
本地存储升级：使用localforage替代localStorage。localStorage有5MB限制，存图片或大型PPTJSON容易溢出。IndexedDB则大得多。 展开代码语言：JavaScriptAI代码解释/*main.js中的全局配置*/importlocalforagefrom"localforage";localforage.config({name:"
12610编辑于 2026-01-25 - 来自专栏前端自习课
【拓展】分享 8 个做处理本地存储的 JS 库
‘names’, ‘James’); let name1 = barn.rpop(‘names’); // Amy let name2 = barn.rpop(‘names’); // James localForage https://github.com/localForage/localForage 这个简单而快速的库将通过IndexedDB或WebSQL使用异步存储来改善Web的脱机体验。 基本使用： localforage.setItem(‘name’, ‘Amy’, function(error, value) { // Do something }); localforage.getItem
2.5K10发布于 2020-11-04 - 来自专栏不换的随想乐园
Jotai 实战（上）
实现方案 store.ts 我们借助 localforage 来实现降级，但是内部我们做了最终降级，假设 IndexDB 、webSQL 、LocalStorage 都不支持，我们最终降级到 memory import { atomWithStorage } from 'jotai/utils'; import localforage from "localforage"; import to from 'await-to-js'; const localforageInstance = localforage.createInstance({ storeName: 'LocalPageStore
43310编辑于 2024-04-30 - 来自专栏码艺坊
Pinia 状态持久化：刷新页面数据不丢失的 3 种方案
使用localforage封装收起代码语言：BashAI代码解释npminstalllocalforage收起代码语言：TypeScriptAI代码解释//plugins/persist.tsimportlocalforagefrom'localforage'importtype {PiniaPluginContext}from'pinia'exportfunctionPersistPlugin({store}:PiniaPluginContext){localforage.getItem ~Dsubscribe((_mutation,state)=>{localforage.setItem(store. 、总结对比方案适用场景优点缺点手动存储小项目、简单数据灵活可控、无依赖代码繁琐pinia-plugin-persistedstate中小型项目、常规场景配置简单、功能强大依赖第三方IndexedDB(localforage
2.4K00编辑于 2025-09-14 - 来自专栏从零开始学 Web 前端
上传图片后如何不依赖后端回显？你可能需要indexedDB存储技术
search=indexedDB IndexedDB 封装库推荐 1、localForage （19K star） localForage是一个快速，简单的JavaScript存储库。 localForage通过使用简单的类似于localStorage的API使用异步存储（IndexedDB或WebSQL）来改善Web应用程序的离线体验。 localForage在不支持IndexedDB或WebSQL的浏览器中会自动使用localStorage。 Github地址：https://github.com/localForage/localForage 2、PouchDB（14.1K star） PouchDB是一个受Apache CouchDB启发的开源
2.6K20发布于 2021-11-10 - 来自专栏教案生成平台
【教案生成平台】实战教程三：打造智能 PPT 生成器 (AI + PptxGenJS)
核心技术点：结构化Prompt(要求AI返回JSON)pptxgenjs(浏览器端生成PPT)localforage(自动保存草稿)2.定义数据结构不同于教案的纯文本，PPT是高度结构化的。 使用localforage监听pptData的变化并自动存入IndexedDB。 展开代码语言：JavaScriptAI代码解释watch(pptData,(newVal)=>{localforage.setItem("current_ppt",newVal);},{deep:true
89510编辑于 2026-01-25 - 来自专栏全栈全栈
常用的前端JQ插件
/github.com/ustbhuangyi/storage store.js 本地存储localstorage的封装 https://github.com/jaywcjlove/store.js localForage https://github.com/localForage/localForage 数据 Mock Easy Mock https://github.com/easy-mock/easy-mock
2.6K30发布于 2020-08-17 - 来自专栏前端自习课
【Web技术】630- 前端存储除了 localStorage 还有啥
二、主流的数据库 2.1 localForage ❝? Offline storage, improved. Wraps IndexedDB, WebSQL, or localStorage using a simple but powerful API. https://github.com/localForage /localForage ❞ localForage 是一个快速简单的 JavaScript 存储库。 对于不支持 IndexedDB 或 WebSQL 的浏览器，localForage 会使用 localStorage 进行数据存储。 此外，localForage 还支持存储所有可以序列化为 JSON 的原生 JS 对象以及 ArrayBuffers，Blob 和 TypedArrays。
2.8K30发布于 2020-06-24 - 来自专栏前端自习课
【JS】1693- 重学 JavaScript API - Web Storage API
LocalForage[5] 一个基于 Web Storage API 的 JavaScript 库，提供更简单和统一的数据存储接口，并处理了一些兼容性和安全性问题。 [4] HTML5 Web Storage: Introduction and Examples: https://www.sitepoint.com/html5-web-storage [5] LocalForage : https://github.com/localForage/localForage 往期回顾 # 如何使用 TypeScript 开发 React 函数式组件？
1.2K40编辑于 2023-09-01 - 来自专栏全栈修仙之路
前端存储除了 localStorage 还有啥
二、主流的数据库 2.1 localForage ❝ Offline storage, improved. https://github.com/localForage/localForage ❞ localForage 是一个快速简单的 JavaScript 存储库。 对于不支持 IndexedDB 或 WebSQL 的浏览器，localForage 会使用 localStorage 进行数据存储。 此外，localForage 还支持存储所有可以序列化为 JSON 的原生 JS 对象以及 ArrayBuffers，Blob 和 TypedArrays。 localForage 主要支持的平台： IE 10（IE 8+ 使用 localStorage） Opera 15（Opera 10.5+ 使用 localStorage） Firefox 18 Safari
3.2K30发布于 2020-06-18 - 来自专栏phodal
将【Growth 技能树】作为一个 PWA 应用安装到桌面
技能树」的开发， GitHub: https://github.com/phodal/motree 技术栈: Ionic 1.x，用于开发混合应用及 UI 设计 Angular 1.x，用于做应用开发 Localforage
93070发布于 2018-01-29
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号