收藏
回答

通过chooseImage选择图片然后uploadFile上传的问题

问题模块
API和组件

已经选择图片,并且打印出来图片临时路径,但是,通过uploadFile上传的时候,有的图片能上传到服务器成功,有的上传不成功。

再问:chooseImage有图片格式的限制吗?

再问:chooseImage有图片大小限制吗?



上代码:

// 添加图片
    upPicbind:function(e){
        var that = this;
        wx.chooseImage({
            count: 1,
            sizeType: ['original'], // 可以指定是原图还是压缩图,默认二者都有
            sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
            success: function(res) {
                // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片
                var tempFilePaths = res.tempFilePaths;
                console.log(tempFilePaths);
                var addInfo = that.data.addInfo;
                var index = e.currentTarget.dataset.index;
                // 上传图片调用
                upload(that, tempFilePaths,index,e);
            }
        });
    },
 
// 上传图片
function upload(page, path,index, e) {
    wx.showToast({
        icon: "loading",
        title: "正在上传"
    }),
    wx.uploadFile({
        url: 这里是URL,
        filePath: path[0],
        name: 'uploadedfile',
        header: { "Content-Type": "multipart/form-data" },
        formData: {},
        success: function (res) {
            console.log(res);
            if (res.statusCode != 200) {
                wx.showModal({
                    title: '提示',
                    content: '上传失败',
                    showCancel: false
                })
                return;
            }else{
                var addInfo = page.data.addInfo;
                var dic = addInfo[index];
                dic.pic = path[0];
                dic.uppic = true;
                dic.uppicbind = false;
                page.setData({
                    addInfo: addInfo
                })
 
                //处理一下返回的json数据得到服务器返回的图片地址
                var pic_url = JSON.parse(res.data).data.pic_url;
                var uppicDic = page.data.uppicDic;
                // //把服务器返回的图片路径按照服务器格式pic_1,pic_2插入
                uppicDic['pic_' + [index + 1]] = pic_url;
                page.setData({
                    uppicDic: uppicDic
                })
            }
        },
        fail: function (e) {
            wx.showModal({
                title: '提示',
                content: '上传失败',
                showCancel: false
            })
        },
        complete: function () {
            wx.hideToast();  //隐藏Toast
        }
    })
}


最后一次编辑于  2017-12-25  (未经腾讯允许,不得转载)
回答关注问题邀请回答
收藏

1 个回答

  • 仙森ღ₅₂₀¹³¹⁴
    仙森ღ₅₂₀¹³¹⁴
    2017-12-25

      uploadFile: function(successCb, index) {

        var that = this;

        wx.chooseImage({

          count: 1, // 默认9

          sizeType: ['compressed'], // 可以指定是原图还是压缩图,默认二者都有

          sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有

          success: function(res) {

            // 返回选定照片的本地文件路径列表,tempFilePath可以作为img标签的src属性显示图片

            var tempFilePaths = res.tempFilePaths;

            that.uploadImgFile(that, tempFilePaths, successCb, index)

          }

        })

      },

      uploadImgFile: function(page, path, successCb, index) {

        wx.showLoading({

          title: '上传中...',

          mask: true

        })

        wx.uploadFile({

          url: ‘接口地址',

          filePath: path[0],

          name: 'image',

          header: {

            "chartset": "utf-8",

            "content-type": "multipart/form-data"

          },

          formData: {

            'token': this.globalData.userInfo.token

          },

          success: function(res) {

            if (res.statusCode !== 200) {

              wx.showModal({

                title: '提示',

                content: '上传失败,请稍后重试',

                showCancel: false

              })

              return

            } else {

              let data = JSON.parse(res.data)

              try {

                let data = JSON.parse(res.data)

                if (data.code === 0) {

                  console.log(index)

                  successCb && successCb(data.data, index)

                } else {

                  wx.showModal({

                    title: '提示',

                    content: res.msg || '上传失败,请稍后重试',

                    showCancel: false

                  })

                  return

                }

              } catch (err) {

                wx.showModal({

                  title: '提示',

                  content: '上传失败,请稍后重试',

                  showCancel: false

                })

                return

              }

            }

          },

          fail: function(e) {

            wx.showModal({

              title: '提示',

              content: '上传失败,请稍后重试',

              showCancel: false

            })

          },

          complete: function() {

            wx.hideLoading()

          }

        })

      },


    2017-12-25
    赞同
    回复