微信小程式-拍照或選擇圖片並上傳檔案

奮鬥年輕人發表於2017-07-28

http://blog.csdn.net/zhaoyazhi2129/article/details/53926507

呼叫拍照API:https://mp.weixin.qq.com/debug/wxadoc/dev/api/media-picture.html?t=20161222#wxchooseimageobject

上傳檔案API:https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-file.html

主要js程式碼:

 choice: function () {
    var that = this
    wx.chooseImage({
      count: 1, // 預設9
      sizeType: ['original', 'compressed'], // 可以指定是原圖還是壓縮圖,預設二者都有
      sourceType: ['album', 'camera'], // 可以指定來源是相簿還是相機,預設二者都有
      success: function (res) {
        // 返回選定照片的本地檔案路徑列表,tempFilePath可以作為img標籤的src屬性顯示圖片
        var tempFilePaths = res.tempFilePaths
        that.setData({
          textHidden: true,
          image_photo: tempFilePaths,
          photoHidden: false
        })
      }
    })
  },
  uploadPhoto: function () {
    var that = this
    let param = util.json2Form({
      tel: '18600346580',
      orderSn: that.data.orderSn,
      parkingPhoto: that.data.image_photo,
    });
    wx.uploadFile({
      url: 'https://testapi.****.com/v4.0.0/uploadParkingPhoto', //僅為示例
      filePath: that.data.image_photo[0],
      name: 'parkingPhoto',
      formData: {
        'tel': '***********',
        'orderSn': that.data.orderSn,
      },
      success: function (res) {
        var obj = JSON.parse(res.data);;
        console.log(obj.result)
        console.log(obj.msg)
        var resule = obj.result;
        var msg = obj.msg;
        if (resule == 'false') {
          wx.showToast({
            title: msg,
            icon: 'success',
            duration: 2000
          })
        } else {
          wx.navigateBack({
            delta: 1,
            success: function (res) {
              wx.showToast({
                title: msg,
                icon: 'success',
                duration: 2000
              })
            },

          })
        }
      }
    })

  }

Tip:

1.呼叫wx.chooseImage() 自動彈出選擇視窗,不用呼叫操作選單wx.showActionSheet(),否則重複

如圖

2. 上傳檔案的時候filePath必須是陣列,當你單張的時候需要使用陣列,若只有一張要用[0]

3. 最需要注意的是,success返回資料是String型別,我們需要將String型別轉換成Object

js字串轉換成obj

用js 是有三種方法的

  1. js自帶的eval函式,其中需要新增小括號eval('('+str+')');
  2. JSON.parse(str)
  3. $.parseJSON( jsonstr )

但是在微信小程式中,我們只能用JSON.parse(str),其他的都不可以


相關文章