13、微信小程序：上传图片到服务器_微信小程序上传图片到服务器

1、上传图片到服务器，有两个步骤：

    1.1  拿到可上传的图片 wx.chooseImage

    1.2  将图片上传到服务器  wx.uploadFile

2、代码实现

<button bindtap="upload">点击上传</button>

<image src="{{imgPath}}" mode=""/>

 upload(){
        var _this=this
        wx.chooseImage({
            拿几张图片 count
            图片上传类型  sizeType
            图片来源   sourceType
            success(res){//获取成功  
 
            wx.uploadFile({
                临时图片路径 filePath
                服务器地址   url
                name
                timeout
                success(res){
                    let imgPath=baseUrl+JSON.parse(res2.data).data
                    _this.setData({
                        imgPath
                    })
                }
            })
            }     
        })
 }

// 上传图片到服务器
    upload() {
        var _this=this
        wx.chooseImage({
            count: 1,   //可上传的图片数量
            sizeType: ['original', 'compressed'],//上传图片类型：原图、压缩图
            sourceType: ['album', 'camera'], //图片来源：相册、照相机
            success(res) {
                // 成功，将图片上传到服务器
                console.log(res);
                // 拿取临时路径文件
                let filePath = res.tempFilePaths[0]
                /*  
                 控制台的 tempFilePaths: ["http://tmp/DTalF29Fe4wkc6221b571e512fe6b7a68b2926e81b51.jpg"]
                  即表示图片的临时路径
               */
                wx.uploadFile({
                    /* // 拿到临时图片路径后上传到服务器，服务器将返回一个公网地址，
                    届时在任意角落都将能访问到这张图片 */
                    filePath: filePath, //临时文件路径
                    url: baseUrl + "/api/test/user/upload",  //填写公司的服务器地址
                    name: 'file',   /* //非常重要！！！！是后台访问二进制数据的关键 
                    该 file 是对应接口，所需要传递的参数 */
                    timeout:5000,
                    success(res2){
                        console.log(res2);
                        // 需解析信息，拿到图片路径，因为本项目的 域名以 .com 结尾，所以需要“ / ”进行必要分隔
                        let imgPath=baseUrl+"/"+JSON.parse(res2.data).data //将二进制转换成字符串类型
                        _this.setData({
                            imgPath
                        })
 
                    }
                })
            }
        })
    },