首页/ 填坑/ 文章详情

微信小程序 API wx.uploadFile 官方示例:坑你没商量

微信小程序一经面世后,瞬间掀起一股学习小程序的热潮。落后就要挨打,前端也需要与时俱进。随着时间的推移,小程序成了必备技能点,时代倒逼着你前进。

新的事物出现伴随着机遇与挑战,学习新的技能总不会一帆风顺,然而官方挖坑,最为致命。客官们,来看看微信小程序 API wx.uploadFile 大型翻车现场。

微信小程序 wx.uploadFile 官方示例代码:

JSwx.chooseImage({
  success (res) {
    const tempFilePaths = res.tempFilePaths
    wx.uploadFile({
      url: 'https://example.weixin.qq.com/upload', //仅为示例,非真实的接口地址
      filePath: tempFilePaths[0],
      name: 'file',
      formData: {
        'user': 'test'
      },
      success (res){
        const data = res.data
        //do something
      }
    })
  }
})

用户参照官方代码选择文件上传,文件上传失败之后,没有任何的信息反馈,此时不用说萌新小白一脸懵B,有经验的也觉的莫名其妙。为了获取错误信息,需要额外添加 fail 对象函数。

JSwx.chooseImage({
  success (res) {
    const tempFilePaths = res.tempFilePaths
    wx.uploadFile({
      url: 'https://example.weixin.qq.com/upload', //仅为示例,非真实的接口地址
      filePath: tempFilePaths[0],
      name: 'file',
      formData: {
        'user': 'test'
      },
      success (res){
        const data = res.data
        //do something
      },
      fail(res) { 
          console.log(res); //输出错误的信息
      }
    })
  }
}) 

重新运行代码,获得如下错误信息:

JS{errMsg: "uploadFile:fail parameter error: parameter.filePath should be String instead of Object;"}

根据错误信息的提示,parameter.filePath 需要字符串类型的参数,不是 Object 对象参数。于是将tempFilePaths[0] 改成 JSON.stringify(tempFilePaths[0]) 强制转换成字符串。

JS{errMsg: "uploadFile:fail createUploadTask:fail file not found"}

上传文件还是上传失败,继续提示,文件没有找到。翻看微信小程序文档参数的 filePath 讲解。

filePath 要上传文件资源的路径 (本地路径)

filePath 参数要的是上传文件的路径,文件的路径,文件的路径!!! filePath 需要的参数应该是tempFilePaths[0].path参数。

JSwx.chooseImage({
  success (res) {
    const tempFilePaths = res.tempFilePaths
    wx.uploadFile({
      url: 'https://example.weixin.qq.com/upload', //仅为示例,非真实的接口地址
      filePath: tempFilePaths[0].path,
      name: 'file',
      formData: {
        'user': 'test'
      },
      success (res){
        const data = res.data
        //do something
      },
      fail(res) { 
          console.log(res); //输出错误的信息
      }
    })
  }
})

微信小程序文档写的清清楚楚,官方示例代码却使用错误的参数,这是为什么呢?在接触uni-app前,先入为主认为微信小程序是行业内的制定者。其实不然,DCloud才是这个行业的开创者,只是微信小程序名声过于响亮,误会了。

官方示例代码发生这么低级的错误,有可能微信小程序同学抄作业,无封不动照抄,事后换了wx的马甲,事情就这么简单。

参考资料:

uni-app的由来
uni-app uni.uploadFile 文档
微信小程序 wx.uploadFile 文档 

文章评论0 records

最新 最早

0

最新评论Latest comments

HentaiCatHentaiCat 2020-12-30 10:22
考科目二全程很紧张,考了三次才过,有次侧方入库直接pass,100分扣完,呜呜呜~
猫猫酱猫猫酱 2020-11-12 10:56
一入多肉深似海,说多都是泪
soulkunsoulkun 2020-11-05 15:54
IconFont的图标真的很好用!!!
无限链霉球菌无限链霉球菌 2020-11-03 11:41
药店,了解一下(`・ω・´)
HentaiCatHentaiCat 2020-11-02 15:28
(ಡωಡ)很实用,直接拿走...