[发明专利]一种基于localStorage的Web前端数据本地存储和访问方法

权利要求书

1.一种基于localStorage的Web前端数据本地存储方法，其特征在于，包括以下步骤：

步骤1、根据缓存数据类型将浏览器为localStorage分配的存储空间划分为多个存储区域；

步骤2、设计新的数据存储模式，将数据存储模式从key-value模式转变为areaName-JSONObj模式；

areaName-JSONObj模式包含areaName和JSONObj两部分，areaName表示区域名；JSONObj表示JSON对象数据；JSONObj采用key-obj的形式表示，每个key对应一个obj，即对象，对象包含两个属性：1)value：存储的数据内容；2)expTime：数据存储的终止时间；

步骤3、设计新的localStorage接口LS，将其包装为JS插件在系统中使用，将从磁盘中读取数据转换为从内存对象中读取数据。

2.根据权利要求1所述的基于localStorage的Web前端数据本地存储方法，其特征在于，，所述步骤1中，将浏览器为localStorage分配的存储空间划分为四个存储区域，如表1所示：

表1 本地存储区域划分表

区域名说明JC_LS存储JS、CSS、HTML等文件Img_LS存储静态图片资源Db_LS存储从数据库中读取的数据Pub_LS存储公共数据

3.根据权利要求1所述的基于localStorage的Web前端数据本地存储方法，其特征在于，所述步骤3中，新的localStorage接口LS提供的方法如表2所示：

表2 LS提供的方法

4.根据权利要求1所述的基于localStorage的Web前端数据本地存储方法，其特征在于，针对存储空间写满错误，设置写入预防机制：localStorage写入数据时，计算空间是否已写满或者写入该数据导致空间写满，若是，则基于LRU算法清除“无用数据”，腾出空间。

5.根据权利要求1所述的基于localStorage的Web前端数据本地存储方法，其特征在于，针对存储空间写满错误，设置错误监控机制：对QuotaExceededError错误进行监听，一旦捕捉到该错误，则基于LRU算法清除“无用数据”，腾出空间。

6.根据权利要求4或5所述的基于localStorage的Web前端数据本地存储方法，其特征在于，LRU算法的实现步骤为：

S1、在每个存储区域里设置一个order项，即在localStorage中存储一条key值为“order”、value值为数组的数据，用来存储每条数据的key值，该数组以数据的使用时间从小到大进行排序；

S2、存储新数据时，将其对应的key值添加到该存储区域的order项的数组的最末端；

S3、访问或者更新数据时，则将该数据对应的key值移动到数组的最末端；

S4、需要释放存储空间时，根据数组首端的key值删除对应数据。