1. 程式人生 > >微信小程式上傳API介面wx.uploadFile的坑

微信小程式上傳API介面wx.uploadFile的坑

小程式的坑比較多,原因在於小程式開發文件相當的不全,所以開發小程式是比較痛苦的,但也正是因為坑多,技術卻一步一步的往上升了...不知道該笑還是該哭。

進入正題:wx.uploadFile的坑

坑一:返回的資料格式不是JSON格式(需要自己用JSON.parse()轉化格式);

坑二:返回的資料值用點運算子有時獲取不到(只能通過物件的屬性名獲取obj['name'])

程式碼詳解:

handleData: function (token, audioFile) {
    let that = this;
    let url = 'https://www.xxx.com/......';//此處換上你的介面地址
    wx.uploadFile({
      url: url,
      filePath: audioFile,
      name: 'audioFile',//這裡是上傳音訊檔案型別,按照需求填寫
      header: {
        "Content-Type": "multipart/form-data",
        'accept': 'application/json',
      },
      formData: {
        'token': token,  //其他額外的formdata,按需求來
      },
      success: function (res) {
        //坑一:與wx.request不同,wx.uploadFile返回的是[字串],需要自己轉為JSON格式
        //如果不轉換,直接用點運算子是獲取不到後臺返回的值的
        let datas = JSON.parse(res.data)
        let status = datas.status;
        let msg = datas.msg;
        //坑二:一般來說,轉化之後的資料是能用點運算子獲取的,但是如果大的物件裡又包含超級多的物件,也就是物件層層巢狀,有十個巢狀之多,那麼用點運算子有時候會出現獲取不到值的情況。那麼這時需要通過物件的屬性名獲取到值,也是要這樣寫:let id = datas['attr1']['attr2']['attr3']...['attr10']['id'];才能獲取到
        if (status == "2") {
          //codes go here
          setTimeout(function () {
            //呼叫儲存音訊檔案到本地
            that.saveRecordingFile(audioFile)
          }, 500)
        } else {
          wx.showToast({
            title: '上傳失敗,請重試!',
          })
          return;
        }
      },
      fail: function (res) {
        wx.showModal({
          title: '提示',
          content: '上傳失敗,請重試!',
        })
        return;
      },
    })
  },

  saveRecordingFile: function (audioFile) {
    let that = this;
    wx.saveFile({
      tempFilePath: audioFile,
      success: function (res) {
        let savedFilePath = res.savedFilePath;
        that.setData({
          savedFilePath: savedFilePath
        })
      }
    })
  },