微信小程序图片上传(单图or多图)

微信小程序中图片上传是个坑,不能转成base64和其他字段一起上传,只好退而求其次,在上传完字段后,再上传图片。普通上传就不说了,这里主要讲一下图片上传。

图片上传封装函数

微信自己有一个专门上传图片的api————uploadFile,然而这个接口只能单图上传,但是实际业务逻辑上,肯定会涉及到一些多图上传的情况,所以只好使用了一种递归循环的方式(如果大家有更好的,可以留言哦~)

function uploadimg(data, cb) {//单图or多张图片上传
  var that = this,
      i = data.i ? data.i : 0,//当前上传的哪张图片
      success = data.success ? data.success : 0,//上传成功的个数
      fail = data.fail ? data.fail : 0;//上传失败的个数
  wx.uploadFile({
    url: config.HTTP_BASE_URL+data.url,//上传图片的接口
    filePath: data.path[i],//图片本地路径
    name: 'image',//这里根据自己的实际情况改
    formData: data.param[i],//这里是上传图片时一起上传的数据
    header: {
      "Content-Type": "multipart/form-data"
    },
    success: (resp) => {
      console.log(resp);
      success++;//图片上传成功,图片上传成功的变量+1
    },
    fail: (res) => {
      fail++;//图片上传失败,图片上传失败的变量+1
    },
    complete: () => {
      i++;//这个图片执行完上传后,开始上传下一张
      if (i == data.path.length) {   //当图片传完时,停止调用
        typeof cb == "function" && cb(i);
      } else {//若图片还没有传完,则继续调用函数
        data.i = i;
        data.success = success;
        data.fail = fail;
        that.uploadimg(data, cb);
      }
    }
  });

你可能感兴趣的:(微信小程序图片上传(单图or多图))