// GetPolicy.js
const Base64 = require('js-base64');
function getPolicyEncode(policy) {
// 傳入表單上傳的policy字段,對(duì)policy進(jìn)行Base64編碼
const encodedPolicy = Base64.encode(JSON.stringify(policy));
return encodedPolicy;
}
export default getSignature;
// GetSignature.js
const Crypto = require('crypto-js');
const Base64 = require('js-base64');
function getSignature(policyEncoded, SecretKey){
// 利用SecretKey對(duì)Base64編碼后的policy結(jié)果進(jìn)行HMAC-SHA1簽名計(jì)算
const bytes = Crypto.HmacSHA1(policyEncoded, SecretKey);
// 對(duì)計(jì)算結(jié)果進(jìn)行Base64編碼,得到最終的簽名信息
const signature = Crypto.enc.Base64.stringify(bytes);
return signature;
}
export default getPolicyEncode;
// upload.vue
<template>
<uni-file-picker
v-model="showUrl.activityInform"
:limit="limit"
:auto-upload="false"
mode="list"
title="xxxx"
file-mediatype="all"
file-extname="png,jpg,jpeg,pdf"
@select="handleSelect($event, 'activityInform')"
>
</uni-file-picker>
</template>
data () {
return {
.... ,
showUrl: {
activityInform: [],
// .......
},
// 后端接口獲得
uploadOss: {
Bucket: "", // oss桶
Key: "", // 文件路徑
filePath: "", // oss 文件路徑
AWSAccessKeyId: "",
SecretKey: "",
},
}
}
methods: {
handleSelect(files, field){
if (!files.tempFiles.length) return;
const date = new Date();
const file = files.tempFiles[0]; // 獲取第一個(gè)文件信息
const timestamp = date.getTime();
const parts = file.name.split(".");
const name = parts.slice(0, parts.length - 1).join("."); // 獲取文件名(不包括后綴)
const extension = parts[parts.length - 1]; // 獲取后綴名
const fileName = `${name}_${timestamp}.${extension}`;
const { url, Bucket, filePath, SecretKey, AWSAccessKeyId } =
this.uploadOss;
const toISOString = new Date(Date.now() + 600000).toISOString();
const OSSPolicy = {
expiration: toISOString,
conditions: [
{ bucket: Bucket }, //
{ key: `${filePath}/${fileName}` },
],
};
const policyEncoded = getPolicyEncode(OSSPolicy); // 計(jì)算base64編碼后的policy
const signature = getSignature(policyEncoded, SecretKey); // 計(jì)算簽名
uni.uploadFile({
url,
filePath: file.path,
name: "file",
formData: {
// 從配置文件中獲取到的AccessKeyID信息、計(jì)算得到的編碼后policy及signature信息
AWSAccessKeyId,
policy: policyEncoded,
signature: signature,
key: `${filePath}/${fileName}`,
},
success: (res) => {
if (res.statusCode == 204) {
uni.showToast({ title: "上傳成功", icon: "success" });
this.showUrl[field].push({
extname: extension,
name: fileName,
url: `${filePath}/${fileName}`,
});
this.uploadUrl[field].push(`${filePath}/${fileName}`);
} else {
uni.showToast({ title: "上傳失敗", icon: "fail" });
}
},
fail: (e) => {
console.log(e, "e");
},
});
}
}
uni-app小程序,上傳文件到oss中
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。
相關(guān)閱讀更多精彩內(nèi)容
- uni-app 微信小程序 上傳圖片 文件 uni.uploadFile() 、 uni.chooseImage(...
- 1.創(chuàng)建一個(gè)base64.js 2.創(chuàng)建一個(gè)crypto.js 3.創(chuàng)建alioss.js
- 寫(xiě)在前面: 本篇致力于解決客戶端上傳文件,進(jìn)度到99%后長(zhǎng)時(shí)間卡頓問(wèn)題。傳統(tǒng)方案:調(diào)用服務(wù)端接口,將文件傳至服務(wù)端...
- 以下是幾個(gè)要點(diǎn): 1.阿里云提供直傳的方法有PutObject,以及PostObject(參見(jiàn)地址:https:/...
- Update3:配置文件。很多人不知道配置文件是啥樣的,我把那個(gè)文件也發(fā)上來(lái),按理說(shuō)很好推測(cè)配置文件的內(nèi)容。 co...