微信小程序持久化存储图片文件实现网络图片本地缓存

原创

已于 2024-04-12 18:39:04 修改 · 1.5k 阅读

标签

#微信小程序 #小程序 #uniapp #javascript

收录于

于 2024-04-12 18:34:10 首次发布

#关于项目中需要减轻服务器资源消耗问题，前端简单对图片做缓存处理#

export function getEncryption(key) {
  const encrypt = new Md5();
  encrypt.appendAsciiStr(key);
  return encrypt.end();
}

export function setCacheImages(href) {
  return new Promise((resolve, reject) => {
    // #ifdef MP-WEIXIN
    try {
      const realUrl = href.split("?")[0];

      const fileIdentifier = getEncryption(realUrl);

      const fileManager = uni.getFileSystemManager();

      // 读取缓存的所有文件
      const dir = fileManager.readdirSync(wx.env.USER_DATA_PATH);

      // 检查是否存在缓存文件
      const cachedFile = dir.find((item) => item.indexOf(fileIdentifier) > -1);

      if (cachedFile) {
        // 返回对应文件路径
        resolve(`${wx.env.USER_DATA_PATH}/${cachedFile}`);
      } else {
        downloadCanchFile(href, fileIdentifier)
          .then((response) => {
            resolve(response);
          })
          .catch(() => {
            // 下载失败可能是网络问题，返回原始图片链接
            rej