test: 阿里云oss

This commit is contained in:
jmal 2023-03-26 23:27:00 +08:00
parent cb6a2ff6e4
commit 8be43f922d
2 changed files with 38 additions and 35 deletions

12
src/api/aliyunoss.js Normal file
View File

@ -0,0 +1,12 @@
import request from '@/utils/request'
export default {
// 获取分享者信息
getAppToken: function(params) {
return request({
url: 'oss/aliyun/getAppToken',
method: 'get',
params
})
},
}

View File

@ -5,6 +5,8 @@
<script>
import OSS from "ali-oss"
import aliyunOSSApi from "@/api/aliyunoss";
export default {
name: "testoss",
data() {
@ -19,51 +21,40 @@ export default {
}
},
mounted() {
this.getAccessToken()
let that = this
document.getElementById('file').addEventListener('change', function (e) {
let file = e.target.files[0];
let storeAs = file.name;
console.log(file.name + ' => ' + storeAs);
// OSS.urllib是SDK内部封装的发送请求的逻辑,开发者可以使用任何发送请求的库向sts-server发送请求。
OSS.urllib.request(that.stsServerUrl, {method: 'GET'}, (err, response) => {
if (err) {
return alert(err);
}
try {
this.accessToken = JSON.parse(response);
} catch (e) {
return alert('parse sts response info error: ' + e.message);
}
let client = new OSS({
accessKeyId: this.accessToken.AccessKeyId,
accessKeySecret: this.accessToken.AccessKeySecret,
stsToken: this.accessToken.SecurityToken,
endpoint: 'oss-cn-guangzhou.aliyuncs.com',
bucket: 'jmalcloud',
internal: true,
cname: false,
secure: true,
refreshSTSToken: async () => this.refreshToken()
});
// storeAs可以自定义为文件名(例如file.txt)或目录(例如abc/test/file.txt)的形式,实现将文件上传至当前Bucket或Bucket下的指定目录。
// file可以自定义为File对象、Blob数据以及OSS Buffer。
client.multipartUpload(storeAs, file).then(function (result) {
console.log(result);
}).catch(function (err) {
console.log(err);
});
let client = new OSS({
accessKeyId: that.accessToken.AccessKeyId,
accessKeySecret: that.accessToken.AccessKeySecret,
stsToken: that.accessToken.SecurityToken,
endpoint: 'oss-cn-guangzhou.aliyuncs.com',
bucket: 'jmalcloud',
internal: true,
cname: false,
secure: true,
refreshSTSToken: async () => this.refreshToken()
});
// storeAs可以自定义为文件名(例如file.txt)或目录(例如abc/test/file.txt)的形式,实现将文件上传至当前Bucket或Bucket下的指定目录。
// file可以自定义为File对象、Blob数据以及OSS Buffer。
client.multipartUpload(storeAs, file).then(function (result) {
console.log(result);
}).catch(function (err) {
console.log(err);
});
});
},
methods: {
getAccessToken() {
aliyunOSSApi.getAppToken().then((res) => {
this.accessToken = res.data
})
},
async refreshToken() {
// 向您搭建的STS服务获取临时访问凭证。
const info = await fetch(this.stsServerUrl);
return {
accessKeyId: info.AccessKeyId,
accessKeySecret: info.AccessKeySecret,
stsToken: info.SecurityToken
}
this.getAccessToken()
}
}
}