微信小程序选择并上传图片

 
上传图片
API: wx.chooseImage() 和 wx.uploadFile()
wx.chooseImage({
  count: 1, // 默认9
  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
  sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
  success: function(res) {
    console.log(res.tempFiles); // 图片的本地文件列表,每一项是一个file对象
    // 结果: [{path: "http://tmp/wx0ffcd03a1dfdc451.o6zAJs7JDPzeAscW09c_BG24fpdU.6919dfcada671055948023075afd859a.jpg", size: 61034}, ...]
    console.log(res.tempFilePaths); // 图片的本地文件路径列表
    // 结果: ["http://tmp/wx0ffcd03a1dfdc451.o6zAJs7JDPzeAscW09c_BG24fpdU.6919dfcada671055948023075afd859a.jpg"]
    var tempFilePaths = res.tempFilePaths;
    wx.uploadFile({ 
      url: '/your_url/receive_file', // 图片上上传的地址,请求方式默认为POST且不可更改
      filePath: tempFilePaths[0], // 要上传的文件的路径,注:一次只能上传一个文件,若要上传多张图片,请使用递归
      name: 'file', // 文件对应的键名,后端可以通过这个key获取到文件的二进制内容
      formData:{
        'user_id': '123',
        'name': 'Jack',
        'age': 18
      },
      success: function(res){
        var data = res.data
        //do something
      }
    })
  }
})
如果需要上传多张图片,那么需要把wx.uploadFile()封装成一个函数,判断图片上传是否完成,如果没有完成,则一直调用这个函数,否则,图片上传完成。
 
posted @ 2018-01-21 13:41  狂奔的蜗牛1031  阅读(4096)  评论(0编辑  收藏  举报