# 上传文件

将本地资源上传至对象存储空间,如果上传至同一路径则是覆盖写

本文档适用于微信小程序中使用,如果你不是微信小程序,请移步适合的文档

# 请求参数

字段 说明 数据类型 默认值 必填
cloudPath 云存储路径,命名限制见文件名命名限制 String -
filePath 要上传文件资源的路径 String -
config 配置 Object -
success 成功回调
fail 失败回调
complete 结束回调

# config 对象定义

字段 说明 数据类型
env 使用的环境 ID,填写后忽略 init 指定的环境 String

# success 返回参数

字段 说明 数据类型
fileID 文件 ID String
statusCode 服务器返回的 HTTP 状态码 Number
errMsg 错误信息,格式 uploadFile:ok String

# fail 返回参数

字段 说明 数据类型
errCode 错误码 Number
errMsg 错误信息,格式 uploadFile:fail msg String

# 返回值

如果请求参数中带有 success/fail/complete 回调中的任一个,则会返回一个 UploadTask 对象,通过 UploadTask 对象可监听上传进度变化事件,以及取消上传任务。

# 使用示例

# 1. Callback 风格

wx.cloud.uploadFile({
  cloudPath: 'example.png', // 对象存储路径,根路径直接填文件名,文件夹例子 test/文件名,不要 / 开头
  filePath: 'wxfile://test', // 微信本地文件,通过选择图片,聊天文件等接口获取
  config: {
    env: 'werun-id' // 需要替换成自己的微信云托管环境ID
  }
  success: res => {
    console.log(res.fileID)
  },
  fail: err => {
    console.error(err)
  }
})

# 2. Promise 风格

wx.cloud.uploadFile({
  cloudPath: 'example.png', // 对象存储路径,根路径直接填文件名,文件夹例子 test/文件名,不要 / 开头
  filePath: 'wxfile://test', // 微信本地文件,通过选择图片,聊天文件等接口获取
  config: {
    env: 'werun-id' // 需要替换成自己的微信云托管环境ID
  }
}).then(res => {
  console.log(res.fileID)
}).catch(error => {
  console.error(err)
})

# 3. 完整示例

在小程序的任何一个页面js替换如下代码,环境ID需要替换成自己的

将在页面载入时弹出图片选择框,选择图片后自动上传,默认上传到对象存储的 test 文件夹下,命名 test.png

封装的上传函数中 onCall 方法参数,可以接收到文件上传进度的回调,可以随时返回 false 中断上传任务,返回其他或者不返回则正常上传。

Page({
  async onLoad() {
    const that = this
    await wx.chooseImage({
      count: 1,
      async success(res){
        console.log(res.tempFilePaths)
        const result = await that.uploadFile(res.tempFilePaths[0], 'test/test.png', function(res){
          console.log(`上传进度:${res.progress}%,已上传${res.totalBytesSent}B,共${res.totalBytesExpectedToSend}B`)
          // if(res.progress > 50){ // 测试文件上传一半就终止上传
          //   return false
          // }
        })
        console.log(result)
      }
    })
  },
  /**
   * 上传文件到微信云托管对象存储
   * @param {*} file 微信本地文件,通过选择图片,聊天文件等接口获取
   * @param {*} path 对象存储路径,根路径直接填文件名,文件夹例子 test/文件名,不要 / 开头
   * @param {*} onCall 上传回调,文件上传过程监听,返回false时会中断上传
   */
  uploadFile(file, path, onCall = () => {}) {
    return new Promise((resolve, reject) => {
      const task = wx.cloud.uploadFile({
        cloudPath: path,
        filePath: file,
        config: {
          env: 'werun-id' // 需要替换成自己的微信云托管环境ID
        },
        success: res => resolve(res.fileID),
        fail: e => {
          const info = e.toString()
          if (info.indexOf('abort') != -1) {
            reject(new Error('【文件上传失败】中断上传'))
          } else {
            reject(new Error('【文件上传失败】网络或其他错误'))
          }
        }
      })
      task.onProgressUpdate((res) => {
        if (onCall(res) == false) {
          task.abort()
        }
      })
    })
  }
})

# 资源复用

如果是资源复用,需要先进行初始化,初始化过程是异步,需要在业务中加以处理

在小程序app.js中粘贴如下代码,记得修改相关的信息,封装upload可以参考上面例子,唯一不同点就是wx.cloud替换,其他基本一致

App({
  logger:require('./log.js'),
  async onLaunch() {
    const c1 = new wx.cloud.Cloud({
      resourceAppid: 'wx886699112233', // 环境所属的账号appid
      resourceEnv: 'prod-weruntest', // 微信云托管的环境ID
    })
    await c1.init()
    this.cloud = c1 // 在页面js中,可以使用getApp().cloud
    this.cloud.uploadFile({
      cloudPath: 'example.png', // 对象存储路径,根路径直接填文件名,文件夹例子 test/文件名,不要 / 开头
      filePath: 'wxfile://test', // 微信本地文件,通过选择图片,聊天文件等接口获取
      success: res => {
        console.log(res.fileID)
      },
      fail: err => {
        console.error(err)
      }
    })
  }
})
点击咨询小助手