小程序上传图片

226 阅读1分钟

1、走服务器

由于多处需要用,就单独写了个js

            const getImg = function(num) {
              return new Promise(function(resolve, reject) {
                wx.chooseImage({
                  count: num, // 默认9
                  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
                  sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
                  success: function(res) {
                    // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
                    const tempFilePaths = res.tempFilePaths
                    //上传
                    var arr=[];
                    var length = tempFilePaths.length;
                    for (var i = 0; i < length;i++){
                      wx.uploadFile({
                        url: '...', 
                        filePath: tempFilePaths[i],
                        name: 'files',
                        header: {
                          "Content-Type": "multipart/form-data"
                        },
                        formData: {
                          "files": tempFilePaths
                        },
                        success: function (res) {
                          // console.log(res)
                          --length;
                          let result = JSON.parse(res.data)
                          arr.push(result.data);
                          if(result.code != 200){
                            wx.showModal({
                              title: '温馨提示',
                              content: result.msg,
                            })
                          }
                        },
                        fail:function(e){
                          --length;
                          // console.log(e)
                        },
                        complete:function(res){
                          // console.log("complete---->" + length)
                          if (length == 0){
                            // console.log("---->"+arr)
                            resolve(arr)
                          }
                          // console.log(arr)
                        }
                      })
            
                     
                    }
                  }
                })
              })
            }
            
            module.exports = {
              getImg: getImg,
            }

2、走前端

            var uploadImage = require('upload/uploadFile.js');
            const getImg = function(num,token) {
              return new Promise(function(resolve, reject) {
                wx.chooseImage({
                  count: num, // 默认9
                  sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
                  sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
                  success: function(res) {
                    // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
                    const tempFilePaths = res.tempFilePaths
                    //上传
                    var arr=[];
                    var length = tempFilePaths.length;
                    for (var i = 0; i < length;i++){
                      //支持多图上传
                      for (var i = 0; i < res.tempFilePaths.length; i++) {
                        //显示消息提示框
                        wx.showLoading({
                          title: '上传中' + (i + 1) + '/' + res.tempFilePaths.length,
                          mask: true
                        })
                        //上传图片
                        //你的域名下的/cbb文件下的/当前年月日文件下的/图片.png
                        //图片路径可自行修改
                        uploadImage(res.tempFilePaths[i], 'image/',
                          function (result) {
                            --length;
                            arr.push(result)
                            if (length == 0) {
                              resolve(arr)
                            }
                            
                            console.log("======上传成功图片地址为:", result);
                            wx.hideLoading();
                          }, function (result) {
                            console.log("======上传失败======", result);
                            wx.hideLoading()
                          }
                        )
                      }
                    }
                  }
                })
              })
            }
            
            module.exports = {
              getImg: getImg,
            }

[uploadFile文件等都在](https://p1-jj.byteimg.com/tos-cn-i-t2oaga2asx/gold-user-assets/2019/7/15/16bf47ec62b12e50~tplv-t2oaga2asx-image.image)