uniapp中根据图片路径(网络或本地路径)转换为base64

uniapp中根据图片路径(网络或本地路径)转换为base64

javascript 复制代码
/**
 * 图片地址转换为base64格式图片
 * @param {string} url 图片地址 可网络地址、本地相对路径
 * @param {string} type base64图片类型 默认png
 */
function urlToBase64(url, type = 'png') {
  let promises

  // 网络地址 或者h5端本地相对路径 可使用request方式
  promises = new Promise((resolve, reject) => {
    uni.request({
      url: url,
      method: 'GET',
      responseType: 'arraybuffer',
      success: (res) => {
        const base64 = `data:image/${type};base64,${uni.arrayBufferToBase64(res.data)}`
        resolve(base64);
      },
      fail: (err) => {
        reject(err);
      },
    })
  })

  // #ifdef APP
  if (!url.startsWith('http')) {
    // app真机本地相对路径
    promises = new Promise((resolve, reject) => {
      uni.compressImage({
        src: url,
        quality: 100, // 图片质量压缩0~100,100表示图片质量保持原样
        success: (res) => {
          const tempUrl = res.tempFilePath // 使用compressImage获取到安卓本地路径file:///...
          plus.io.resolveLocalFileSystemURL(tempUrl, (entry) => {
            entry.file((e) => {
              let fileReader = new plus.io.FileReader();
              fileReader.onload = (r) => {
                resolve(r.target.result)
              }
              fileReader.readAsDataURL(e)
            })
          })
        },
        fail: (err) => {
          reject(err);
        },
      })
    })
  }
  // #endif

  return promises
}
相关推荐
Mr -老鬼1 小时前
移动端跨平台适配技术框架:从发展到展望
android·ios·小程序·uni-app
一颗小青松4 小时前
uniapp app端显示天气详情
uni-app
Swift社区18 小时前
H5 与 ArkTS 通信的完整设计模型
uni-app·harmonyos
小溪彼岸21 小时前
uni-app小白从0开发一款鸿蒙Next应用到上线
uni-app·harmonyos
一颗小青松1 天前
uniapp app端使用uniCloud的unipush
uni-app
cngm1101 天前
uniapp+springboot后端跨域以及webview中cookie调试
spring boot·后端·uni-app
iOS阿玮2 天前
“死了么”App荣登付费榜第一名!
uni-app·app·apple
wendycwb2 天前
uni-app 在真机中canvas绘制的元素悬浮,内容不随父组件滚动问题
uni-app
frontend_frank2 天前
脱离 Electron autoUpdater:uni-app跨端更新:Windows+Android统一实现方案
android·前端·javascript·electron·uni-app
三天不学习2 天前
UniApp三端实时通信实战:SignalR在H5、APP、小程序的差异与实现
微信小程序·uni-app·signalr