vue+axios OSS上传阿里云

版权声明:如需转载请联系博主。 https://blog.csdn.net/DemoLw/article/details/82455428

Vue上传文件到阿里云总结:

html:

<input type="file" @change="upload"/>

js:

  import axios from 'axios';
  import OSS from 'ali-oss';


  upload(e){
        var _self = this;
        console.log(e.currentTarget.files[0]);
        var urlStr = _self.upLoadAvatarOss(e);
        console.log(urlStr);
      },
      async upLoadAvatarOss(e) {
        var file = e.currentTarget.files[0];
        var reader = new FileReader();
        reader.readAsArrayBuffer(file);
        return new Promise((resolve, reject) => {
          reader.onload = function (event) {
            const client = new OSS({
              region: '',
              accessKeyId: '',
              accessKeySecret: '',
              bucket: ''
            });
            const obj =new Date().getTime(); //时间戳
            const key = file.name.split('.').join(obj+'.');  //  路径+时间戳+后缀名
            var buffer = new OSS.Buffer(event.target.result);
            async function put() {
              try {
                let result = await client.put(key, buffer);
                console.log(result);
                let httpUrl = 'url/' + key;
                resolve(httpUrl)
              } catch (e) {
                reject(e);
                console.log(e);
              }
            }
            return put()
          }
        })
      },

猜你喜欢

转载自blog.csdn.net/DemoLw/article/details/82455428