Vue 前端分片上传文件到 阿里 oss

vue前端切片上传文件到阿里oss

准备工作

1.前端直接上传文件到oss，需要在oss 做跨域配置

通过浏览器直接访问OSS时，CORS配置规则要求如下

• 来源：设置精准域名（例如www.aliyun.com）或带有通配符星号（*）的域名（例如*.aliyun.com）。
• 允许Methods：请根据实际使用场景，选择不同的Methods。例如分片上传时，设置为PUT；删除文件时，设置为DELETE。
• 允许Headers：设置为*。
• 暴露Headers：设置为ETag、x-oss-request-id和x-oss-version-id。

2. 使用npm安装SDK开发包

npm install ali-oss

3. 在vue中引用并使用

async upload () {

    const client = new OSS({
        region: 'oss-cn-hangzhou', // 根据那你的Bucket地点来填写
        accessKeyId: 'access