阿里云oss前端直传

105 阅读1分钟
onUpload(e) {
   // 创建一个键值对
  const param = new Form
  const files = e.file
  param.append('file', files, files.name);
  //创建一个上传对象
  var client = new OSS({
    //桶的地址
    region: this.$store.state.user.ossKey.region,
    //id
    accessKeyId: this.$store.state.user.ossKey.accessId,
    //密钥
    accessKeySecret: this.$store.state.user.ossKey.accessKey,
    //桶的名字
    bucket: this.$store.state.user.ossKey.bucket,
    //true协议https
    secure: false,
  });
  /* 另外的上传方式let result = await client.put(fileName, files) */
  // "udkp/new-version/" + this.time() + "/" + getFileTypeValue + "/" + new Date().getTime() + this.getFileExtension(files.name)这个自定义的路径,w为了方便大家看,删了原本封装的方法
    // 调用阿里上传
  client.multipartUpload("udkp/new-version/" + this.time() + "/" + getFileTypeValue + "/" + new Date().getTime() + this.getFileExtension(files.name), files, {
    headers: {
      'Content-Disposition': 'inline',
      'Content-Type': files.type
    },
    progress: (originalValue) => {
      //  获取阿里上传进度条
      this.percentageValue = Number(Math.floor(originalValue * 100));
    }
  }).then(result => {
    // 拿到上传后返回的
    var url = result.res.requestUrls[0].split("?")[0];

  })
}