微信小程序上传一或多张图片

一.要点数组

1.选取图片
wx.chooseImage({
      sizeType: [],  // original 原图,compressed 压缩图,默认两者都有
      sourceType: [], // album 从相册选图,camera 使用相机,默认两者都有
      success: function (res) {
        console.log(res);
        var array = res.tempFilePaths, //图片的本地文件路径列表
      }
    })
2.上传图片
wx.uploadFile({
      url: '', //开发者服务器的 url
      filePath: '', // 要上传文件资源的路径 String类型!!!
      name: 'uploadFile',  // 文件对应的 key ,(后台接口规定的关于图片的请求参数)
      header: {
        'content-type': 'multipart/form-data'
      }, // 设置请求的 header
      formData: {  }, // HTTP 请求中其余额外的参数
      success: function (res) {
      },
      fail: function (res) {
      }
    })

二.代码示例服务器

// 点击上传图片
upShopLogo: function () {
    var that = this;
    wx.showActionSheet({
      itemList: ['从相册中选择', '拍照'],
      itemColor: "#f7982a",
      success: function (res) {
        if (!res.cancel) {
          if (res.tapIndex == 0) {
            that.chooseWxImageShop('album')   
          } else if (res.tapIndex == 1) {
            that.chooseWxImageShop('camera')
          }
        }
      }
    })
  },
  chooseWxImageShop: function (type) {
    var that = this;
    wx.chooseImage({
      sizeType: ['original', 'compressed'],
      sourceType: [type],
      success: function (res) {

/*上传单张
        that.data.orderDetail.shopImage = res.tempFilePaths[0],
        that.upload_file(API_URL + 'shop/shopIcon', res.tempFilePaths[0])
*/

 /*上传多张(遍历数组,一次传一张)
        for (var index in res.tempFilePaths) {
             that.upload_file(API_URL + 'shop/shopImage', res.tempFilePaths[index])
        }
*/
      }
    })
  },
upload_file: function (url, filePath) {
    var that = this;
    wx.uploadFile({
      url: url,
      filePath: filePath,
      name: 'uploadFile',
      header: {
        'content-type': 'multipart/form-data'
      }, // 设置请求的 header
      formData: { 'shopId': wx.getStorageSync('shopId') }, // HTTP 请求中其余额外的 form data
      success: function (res) {
        wx.showToast({
              title: "图片修改为功",
              icon: 'success',
              duration: 700
            })
      },
      fail: function (res) {
      }
    })
  },
相关文章
相关标签/搜索