首页 科技正文

allbetapp下载:小程序-图片/文件内陆缓存,削减CDN流量消耗

admin 科技 2020-06-11 41 0

写在前面

小程序网络图片读取:

  1. 在读取OSS图片CDN分发时流量大量消耗,导致资金用度增添。
  2. 网络图片比较大时,图片加载缓慢。

为了只管削减上面两个问题,所以对已读的图片举行缓存处置,削减多次接见不必要的流量消耗。

小程序的文件系统

文件主要分为两大类:

  • 代码包文件:代码包文件指的是在项目目录中添加的文件。
  • 内陆文件:通过挪用接口内陆发生,或通过网络下载下来,存储到内陆的文件。

其中内陆文件又分为三种:

  1. 内陆暂且文件:暂且发生,随时会被接纳的文件。不限制存储巨细。
  2. 内陆缓存文件:小程序通过接口把内陆暂且文件缓存后发生的文件,不能自定义目录和文件名。跟内陆用户文件共计,通俗小程序最多可存储 10MB,游戏类目的小程序最多可存储 50MB。
  3. 内陆用户文件:小程序通过接口把内陆暂且文件缓存后发生的文件,允许自定义目录和文件名。跟内陆缓存文件共计,通俗小程序最多可存储 10MB,游戏类目的小程序最多可存储 50MB。

而我们要使用的文件缓存方式就是 内陆暂且文件

实现原理

图片缓存流程:

  1. 将要图片/文件通过wx.downloadFile(Object object)下载到内陆,成为内陆暂且文件。
  2. 使用小程序的Storage纪录网络地址内陆地址,做映射。
  3. 使用时,在Storage读取映射表。若是存在内陆文件,并通过FileSystemManager.accessSync(string path)判断文件存在,则读取内陆地址;不存在,删除该映射。

注重

  • 图片缓存只针对多次接见的图片,请按照实际情况挪用。若是接见一次的也做,CDN流量消耗反倒翻倍,得不偿失。
  • 小程序缓存最大10M。为防止将缓存写满,小程序初始化时,若是跨越1000条,清空缓存纪录,重新开始。
  • 1000条。该数不是牢固数字,请凭据自己的实际情况自定。若是你自己就会往Storage放数据,请自行判断需要若干条,不要导致其他数据无法存入,影响其他功效正常使用。
  • 为什么不用LRU最近使用删除?没必要。1000自己是个虚数,留存1~2M做其他代码备用,而文件异步保留,自己会导致有很多多少文件无法检测到,若是通过循环去判断最近时间,太花费性能,还不如进入小程序时,直接清空,从头开始。小程序自己是轻量级的,一段时间清空一次即可。

代码

const fileSystem = wx.getFileSystemManager()

const getStorageImage = (web_image) => {
  let webImages = wx.getStorageSync('webImages') || []
  let webImage = webImages.find(y => y.web_path === web_image)
  if (webImage) {
    try {
      fileSystem.accessSync(webImage.local_path)
      return webImage.local_path
    } catch(e) { 
      let webImageIdx = webImages.findIndex(y => y.web_path === web_image)
      webImages.splice(webImageIdx, 1)
      wx.setStorageSync('webImages', webImages)
    }
  } else {
    wx.downloadFile({
      url: web_image,
      success (res) {
        if (res.statusCode === 200) {
          let filePath = res.tempFilePath
          let webImageStorage = wx.getStorageSync('webImages') || []
          let storage = {
            web_path: web_image,
            local_path: filePath,
            last_time: Date.parse(new Date()),
          }
          webImageStorage.push(storage)
          wx.setStorageSync('webImages', webImageStorage)
        }
      }
    })
  }
  return web_image
}

module.exports = {
  getStorageImage
}

写在后面

本文参照博客

  • https://juejin.im/post/5b42d3ede51d4519277b6ce3

(幽蛰 写于 2020.06.10)

,

欧博会员开户

欢迎进入欧博会员开户(Allbet Game):www.aLLbetgame.us,欧博官网是欧博集团的官方网站。欧博官网开放Allbet注册、Allbe代理、Allbet电脑客户端、Allbet手机版下载等业务。

版权声明

本文仅代表作者观点,
不代表本站AllbetGaming的立场。
本文系作者授权发表,未经许可,不得转载。

评论