vue 上传图片到OSS

npm install ali-oss  安装
 uploadFile( imageDataUrl, field){//base64数据
            console.log('裁剪成功=====>');
            console.log('imageDataUrl :', imageDataUrl);
            console.log('field :', field);

            let OSS = require('ali-oss');
            let client = new OSS({
                region: 'oss-cn-beijing',
                accessKeyId: xxxxxx,
                accessKeySecret: 'xxxxxxxxxxx',
                bucket: 'yeqingyu-bucket'
            });
            const base64 = imageDataUrl.split(',').pop();//出去头部image/data
            const fileType = imageDataUrl.split(';').shift().split(':').pop();
            const blob = this.toBlob(base64, fileType);
            this.putBlob(client,blob);

     },
        //异步上传图片
       async  putBlob (client,blob) {
            try {
                var timestamp = (new Date()).getTime();
                let fileName  = 'mcdull/'+timestamp+'.png';
                let result = await client.put(fileName, blob);
                this.editItem.cover = result.url;
                 this.$refs.uploader.off();
                console.log(result);
            } catch (e) {
                console.log(e);
            }
         },

        toBlob(urlData,fileType) {
            let bytes = window.atob(urlData);
            let n = bytes.length;
            let u8arr = new Uint8Array(n);
            while (n--) {
                u8arr[n] = bytes.charCodeAt(n);
            }
            return new Blob([u8arr], { type: fileType });
        },

猜你喜欢

转载自blog.csdn.net/weixin_34195364/article/details/90787254