npm
npm install ali-oss
alioss.js
// var OSS = require('ali-oss');
import OSS from "ali-oss";
export function client() {var client = new OSS({endpoint: '', //填写Bucket所在地域,需填accessKeyId: '',//需填accessKeySecret: '',//需填bucket: '', // 填写Bucket名称。需填enable: true}) //后端提供数据return client
}
const headers = {// 指定该Object被下载时的网页缓存行为。// "Cache-Control": "no-cache",// 指定该Object被下载时的名称。// "Content-Disposition": "example.txt",// 指定该Object被下载时的内容编码格式。// "Content-Encoding": "utf-8",// 指定过期时间,单位为毫秒。// Expires: "1000",// 指定Object的存储类型。// "x-oss-storage-class": "Standard",// 指定Object的访问权限。'x-oss-object-acl': 'public-read',// 指定Object标签,可同时设置多个标签。// "x-oss-tagging": "Tag1=1&Tag2=2",// 指定初始化分片上传时是否覆盖同名Object。此处设置为true,表示禁止覆盖同名Object。// "x-oss-forbid-overwrite": "true",}
export {headers
}
ant vue二次封装的upload组件
{{tip}}![]()
因为ant vue的upload组件file-list是一个数组,并且需要name和uid与url,不然显示不出来,所以自定义name和uid即可
this.fileList = [{url:url,name:getFileNameUUID(), //getFileNameUUID()随机生成uuiduid:getFileNameUUID()}
]