解决方案

Uniapp教程|App/uni-app离线本地存储方案

作者:仙宝云 | 发布时间:2021-05-27 15:53:17 | 阅读:363

5+App的离线存储

HTML5+的离线当地存储有如下多种方案:

HTML5规范方案:cookie、localstorage、sessionstorage、websql、indexedDB

HTML5Plus扩展方案:plus.navigator.setCookie、plus.storage、plus.io、plus.sqllite

  • cookie(规范h5方案)
    体量最小,可以设置过期工夫不能跨域
  • localstorage(规范h5方案)
    适合key、value键值对的存储,数据量一般不跨越5M是常用的轻量数据存储方案不能跨域
  • sessionstorage(规范h5方案)
    也是键值对,特色是关闭App就消失了,也不能逾越webview,一般不用于持久化数据保留
  • websql(规范h5方案)
    是手机端关系型数据库,各种手机都支撑留意iOS8、9的wkWebview不撑持websql如果如果在iOS8、9上运用websql,恳求运用uiwebview内核
  • indexedDB(规范h5方案)
    是HTML5里最新的数据存储标准,但不是基于SQL,而是基于对象
    indexedDB性能更高,全是异步处理,学习难度偏大。最主要的是目前手机端支持度不行Android4.4以上和iOS8以上才撑持indexedDB
  • plus.navigator.setCookie
    与HTML5的规范cookie相比,plus的扩展重要是为了跨域所谓跨越,就是本地HTML页面和服务器HTML页面共享cookie数据,或者说本地页面的js可以操作服务器页面发生的cookie如果没有逾越需求,不需要利用plus扩大留意iOS8以后的wkWebview不撑持setcookie
  • plus.storage
    plus.storage也是键值对数据存储它是把OS给原生App利用的键值对存储数据库封装一层给JS运用
  • plus.storage没有理论上的大小限制也是持久化的,不会被当作缓存清理。
    plus.storage相比于localstorage 还有一个特性是但是跨域当一个存储数据,需要被当地和来自服务器的页面同时读写不时,就波及跨域题目此时HTML5的localstorage不能满足需求,只能应用plus.storage
    plus.storage操作如果比localstorage缓缓几十毫秒,尤其是在循环里调用plus api会面放大这种慢吞吞
    有网友封装了一个框架,针对key-value数据,在localstorage超越5m经常自动切换到plus.storage,参考http://ask.dcloud.net.cn/article/552虽然这么做听起来有点复杂,但我们对这种追求性能极致的开发者非常赞美
  • plus.io
    plus.io是文件读写,虽然也可以通过读写txt等文件存储数据,但并不如专业的storage和websql便利
    plus.io更多的是用于图片等多媒体文件的当地保留
    比如图文列表的离线使用,一般有2种做法:

    • 图片下载不经过img的src,而是plus.dowload下载的,先下载图片,存好门路后,然后img的src动态指定文件途径
    • 图片运用img的src下载,然后用canvas把img存成图片文件下次不联网,img的scr直接指向当地文件
  • plus.sqllite
    plus.sqllite是对原生的sqllite的封装。它也是一种可以通过sql在当地增删改动查数据库的方案
    有点近似websql,但相对于websql而言,sqllite的利益是:

    • 可以预置根底数据库,直接打包到app里
    • 当手机空间不足不时,websql可能会被清理,而sqllite不会
      plus.storage没有理论上的大小限定

有人问三方清理工具清理渣滓会不会造成某些数据丢失,这个可能性是存在的,但几率并不高,取决于清理软件会不会剖析你的存储数据里哪些是可以排除的渣滓数据除了OS的清理工具外,一般没有root权限的清理工具是拿不到除了plus.io外的你的app的存储数据的
但ios上体系存储空间很少的时分,体系会面清理 cookie、localstorage、sessionstorage、websql、indexedDB 的数据,此时运用plus.storage、plus.sqllite更安全

uni-app存储

uni-app的存储方案比5+app如果少,因为cookie、localstorage、sessionstorage、websql、indexedDB只有h5端撑持,其他端都不撑持
uni.storage的键值对存储,这个是全端支撑的
uni-app的Storage在不同端的实现不同,uni.storage在app侧,映照为plus.storage;h5侧映照为localstorage;各个小程序平台映照为其自带的storage键值对存储:

  • H5端为localStorage,浏览器限定5M大小,是缓存概念,可能会被清理
  • App端为原生的plus.storage,不管大小限制,不是缓存,持久化
  • 各个小程序端为其自带的storage api,数据存储生命周期跟小程序本身同等,即便除用户主动删除或跨越必定工夫被自动清理,否则数据都一直可用
  • 微信小程序单个 key 同意存储的最大数据长度为 1MB,所有数据存储上限为 10MB。

智慧商业服务商仙宝云欢迎您!

请加微信: 18962171986 (宋经理)

在线咨询