小程序学习日记-微信6-用数据存储做一个简单的后端数据缓存

微信的数据存储功能分析

存储

每个微信小程序都可以有自己的本地缓存，可以通过 wx.setStorage/wx.setStorageSync、wx.getStorage/wx.getStorageSync、wx.clearStorage/wx.clearStorageSync，wx.removeStorage/wx.removeStorageSync对本地缓存进行读写和清理。

微信数据存储提供的能力：异步获取本地缓存数据、同步获取本地缓存数据

合理使用微信缓存，能大大减少对服务端的压力。

隔离策略

同一个微信用户，同一个小程序 storage 上限为 10MB。storage 以用户维度隔离，同一台设备上，A 用户无法读取到 B 用户的数据；不同小程序之间也无法互相读写数据。

根据数据隔离策略，决定了在单个客户端无法存储大量数据【例如客户照片、视频等】。但是实际上很多客户10MB对于大多数应用来说，已经足够了。

清理策略

本地缓存的清理时机跟代码包一样，只有在代码包被清理的时候本地缓存才会被清理。

根据清理策略说明：缓存实际上是是临时性的，只能作为一个临时数据，不应该存储持久性的数据。

小功能实现

目标

缓存从后端获取的数据，以bilibili的番剧列表为例【当然域名需要在微信公众平台配置，肯定不会过审，所以这里请求用模拟的】。😄

每个进入B站的用户都会获取主页的番剧列表。而番剧列表是不会随意变动的。假设是在微信小程序里。我们完全可以通过微信提供的缓存能力。对数据进行缓存，每日更新一次或者多次，减轻服务端压力。

实现

服务端：模拟bilibili的服务端返回。

客户端：一个简单按钮，通过控制台日志展示效果。

js代码方法：

/**
  * 获取B站番剧列表
  */
  getBilibiliList: function(){
    const that = this;
    // 控制台展示当前缓存数据内容
    wx.getStorageInfo({
      success (res) {
        console.log("Local:"+res.keys)
        console.log(res.currentSize)
        console.log(res.limitSize)
      }
    });
    var res = wx.getStorageInfoSync();
    console.log("Sync:"+res.keys);
    console.log("Sync:"+res.currentSize);
    console.log("Sync:"+res.limitSize);
    
    var finalText;
    var key = "bilibilListText";
    
    // 获取缓存数据
    wx.getStorage({
      key: key,
      success (res) {
        console.log('获取本地缓存成功：'+res.data);
        finalText = "缓存中获取的数据："+res.data;
        wx.removeStorageSync(key);
      },
      fail (res){
        // 此处省略从后端获取数据
        finalText = "\n Re：从零开始的异世界生活";
        console.log('获取本地缓存失败：'+key+":"+res.data);
        try {
          wx.setStorageSync(key, finalText);
        } catch (e) {
          console.log(e);
         }
      },
      complete(){
        that.setData({"bilibilListText" : finalText});
      }
    });
  }