zoukankan      html  css  js  c++  java
  • 微信小程序选择并上传图片

     
    上传图片
    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()封装成一个函数,判断图片上传是否完成,如果没有完成,则一直调用这个函数,否则,图片上传完成。
     
  • 相关阅读:
    JS学习专辑(3) DOM
    JS学习专辑(4) 变量作用域和语句
    JS学习专辑(6) 函数
    JS学习专辑(2) BOM
    WPF Adorner学习(1)
    C# 递归
    IEnumerable和IEnumerator
    C# 索引器
    JS学习专辑(5) 对象和数组
    JS学习专辑(1) 入门
  • 原文地址:https://www.cnblogs.com/yaoyuqian/p/8324001.html
Copyright © 2011-2022 走看看