上传阿里云更新版本

更新权威参考链接

 

安装:npm i ali-oss

封装一个class类,

使用方法:

1、引入

 2、初始化类

3、上传裁剪后的图片,cavas转base64,转为文件类型,传递给类方法

 封装class, js文件:

import axios from 'axios'
import urlConfig from '@/config/urlConfig'
import { Notify } from 'vant'
const OSS = require('ali-oss')
const urlApi = urlConfig.apiUrl
export default class AliossUploadClass {
  client = null
  dir = ''
  async getUploadUrl (file, type) {
    await this.getClient()
    let pathName = this.dir + this.getFileNameUUID() + '.' + type // 完整路径 自定义文件名(如exampleobject.documentPath/objName.txt)实现将数据上传到当前Bucket或Bucket中的指定目录。
    let result = await this.client.put(pathName, file)
    console.log(result.url) // 上传图片链接
    return result.url
  }
  async getStsToken () {
    let res = await axios.get(urlApi)
    if (res.data.code !== 0) {
      return Notify({ type: 'danger', message: res.msg || '请求失败!' })
    }
    return res
  }
  async getClient () {
    if (this.client) { // 已经存在client不再调用,携带过期时间信息
      return this.client
    }
    let res = await this.getStsToken()
    const result = res.data.data
    var refreshSTSTokenGap = 600000 // 默认毫秒
    var currentTime = new Date().getTime()
    var expirationTimestamp = new Date(result.expiration).getTime()
    if (expirationTimestamp > currentTime) { // 获取过期时间间隔,过期前一分钟刷新token
      let gap = expirationTimestamp - currentTime
      let minute = parseInt(gap / 60000) - 1
      refreshSTSTokenGap = minute * 60000
    }
    const client = new OSS({
      region: result.region,
      accessKeyId: result.accessKeyId,
      accessKeySecret: result.accessKeySecret,
      stsToken: result.stsToken,
      bucket: result.bucket,
      refreshSTSToken: async () => { // 向搭建的STS服务获取临时访问凭证。
        const res = await this.getStsToken()
        const result = res.data.data
        return {
          accessKeyId: result.accessKeyId,
          accessKeySecret: result.accessKeySecret,
          stsToken: result.stsToken
        }
      },
      refreshSTSTokenInterval: refreshSTSTokenGap //
    })
    this.client = client
    this.dir = result.basePath
    return this.client
  }
  getFileNameUUID () { // 生成随机文件名称 十六进制取整规则八位随机字符,加下划线连接时间戳
    function rx () {
      return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1)
    }
    return `${+new Date()}_${rx()}${rx()}`
  }
}

  

 

posted @ 2023-09-01 14:41  everseven  阅读(43)  评论(0)    收藏  举报