title: Taro.uploadFile(option)

sidebar_label: uploadFile

将本地资源上传到服务器。客户端发起一个 HTTPS POST 请求,其中 content-typemultipart/form-data。使用前请注意阅读相关说明

支持情况:uploadFile - 图1 uploadFile - 图2 uploadFile - 图3 uploadFile - 图4 uploadFile - 图5

参考文档

类型

  1. (option: Option) => UploadTaskPromise

参数

参数 类型
option Option

Option

参数 类型 必填 说明
url string 开发者服务器地址
filePath string 要上传文件资源的路径
name string 文件对应的 key,开发者在服务端可以通过这个 key 获取文件的二进制内容
header TaroGeneral.IAnyObject HTTP 请求 Header,Header 中不能设置 Referer
formData TaroGeneral.IAnyObject HTTP 请求中其他额外的 form data
timeout number 超时时间,单位为毫秒
fileName string 上传的文件名
API 支持度: h5
complete (res: TaroGeneral.CallbackResult) => void 接口调用结束的回调函数(调用成功、失败都会执行)
fail (res: TaroGeneral.CallbackResult) => void 接口调用失败的回调函数
success (result: SuccessCallbackResult) => void 接口调用成功的回调函数

SuccessCallbackResult

参数 类型 说明
data string 开发者服务器返回的数据
statusCode number 开发者服务器返回的 HTTP 状态码
errMsg string 调用结果

示例代码

示例 1

  1. Taro.chooseImage({
  2. success (res) {
  3. const tempFilePaths = res.tempFilePaths
  4. Taro.uploadFile({
  5. url: 'https://example.weixin.qq.com/upload', //仅为示例,非真实的接口地址
  6. filePath: tempFilePaths[0],
  7. name: 'file',
  8. formData: {
  9. 'user': 'test'
  10. },
  11. success (res){
  12. const data = res.data
  13. //do something
  14. }
  15. })
  16. }
  17. })

示例 2

  1. const uploadTask = Taro.uploadFile({
  2. url: 'https://example.weixin.qq.com/upload', //仅为示例,非真实的接口地址
  3. filePath: tempFilePaths[0],
  4. name: 'file',
  5. formData:{
  6. 'user': 'test'
  7. },
  8. success: function (res){
  9. var data = res.data
  10. //do something
  11. }
  12. })
  13. uploadTask.progress((res) => {
  14. console.log('上传进度', res.progress)
  15. console.log('已经上传的数据长度', res.totalBytesSent)
  16. console.log('预期需要上传的数据总长度', res.totalBytesExpectedToSend)
  17. })
  18. uploadTask.abort() // 取消上传任务