wx.uploadFile-将本地资源上传到开发者服务器

将本地资源上传到开发者服务器,客户端发起一个 HTTPS POST 请求,其中 content-typemultipart/form-data

如页面通过 wx.chooseImage 等接口获取到一个本地资源的临时文件路径后,可通过此接口将本地资源上传到指定服务器。


OBJECT参数说明:

参数类型必填说明
urlString开发者服务器 url
filePathString要上传文件资源的路径
nameString文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容
headerObjectHTTP 请求 Header, header 中不能设置 Referer
formDataObjectHTTP 请求中其他额外的 form data
successFunction接口调用成功的回调函数
failFunction接口调用失败的回调函数
completeFunction接口调用结束的回调函数(调用成功、失败都会执行)


success返回参数说明:


参数类型说明
dataString开发者服务器返回的数据
statusCodeNumber开发者服务器返回的 HTTP 状态码



示例代码

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


返回值:

基础库 1.4.0 开始支持,低版本需做兼容处理

返回一个 uploadTask 对象,通过 uploadTask,可监听上传进度变化事件,以及取消上传任务。

uploadTask

uploadTask 对象的方法列表:

方法参数说明最低版本
onProgressUpdatecallback监听上传进度变化1.4.0
abort
中断上传任务1.4.0


onProgressUpdate 返回参数说明:

参数类型说明
progressNumber上传进度百分比
totalBytesSentNumber已经上传的数据长度,单位 Bytes
totalBytesExpectedToSendNumber预期需要上传的数据总长度,单位 Bytes


示例代码:

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

uploadTask.onProgressUpdate((res) => {
console.log('上传进度', res.progress)
console.log('已经上传的数据长度', res.totalBytesSent)
console.log('预期需要上传的数据总长度', res.totalBytesExpectedToSend)
})

uploadTask.abort() // 取消上传任务