zoukankan      html  css  js  c++  java
  • Vue 将本地图片上传到阿里云

    一、获取服务器通行证(即获取AccessKey和accessKeySecret)

        getAccess () {
            let that = this
            let url = '服务器地址'
            let params = {
              type: 'K'
            }
            // 第一步:获取AccessKey
            this.$api.send(url, params).then((response) => {
              if (response.status === 200) {
                that.accessKey = response.body.data.data.Credentials
                /* global OSS */
                that.client = new OSS.Wrapper({
                  region: 'oss-cn-shenzhen',
                  bucket: '阿里云bucket文件夹名',
                  accessKeyId: that.accessKey.AccessKeyId,
                  accessKeySecret: that.accessKey.AccessKeySecret,
                  stsToken: that.accessKey.SecurityToken
                })
                that.folder = response.body.data.data.folder;
                for (let i = 0; i < that.allList.length; i++) {
                  if (!that.allList[i].hasUpload) {//allList 需要上传的图片数组
    (function () { that.uploadItem(that.allList[i], i) })(i) } } } }) }

    二、上传到服务器

          uploadItem (file, index) {
            let that = this
            let progress = function (p) {
              return function (done) {
                done()
              }
            }
            // 命名规则:web+id+10位时间戳+随机4位数
            let storeAs = 'web' + that.$user.getAll().userId + Math.round(new Date().getTime() / 1000) + Math.ceil(Math.random() * 100000).toString() + '.' + file.name.split('.')[1]
            // 第二步:调用阿里云上传函数上传文件
            this.client.multipartUpload(this.folder + '/' + storeAs, file.obj, {
              progress: progress
            }).then(function (result) {
              alert(上传成功)
            }).catch(function (err) {
              console.log(err)
            })
          }
     this.getUnloadImg()
    

      

  • 相关阅读:
    XAF 如何在工具栏显示多参数
    XAF Study Recources
    常用工具
    Linux下Kill函数用法
    ipv6相关转换
    宣布回归
    微软夏令营
    APEX SDK阅后感
    寻求offer,开始记录我的征程
    衣服模拟结果
  • 原文地址:https://www.cnblogs.com/candy-Yao/p/9182571.html
Copyright © 2011-2022 走看看