提交 9e219e4a 编写于 作者: VK1688's avatar VK1688 提交者: Anne_LXM

修改云存储演示页面逻辑

上级 758f3d47
......@@ -5,12 +5,12 @@
<text>
各个小程序平台运行时,网络相关的 API 在使用前需要配置域名白名单。
</text>
<j-link text="参考" url="https://uniapp.dcloud.io/uniCloud/quickstart?id=%e5%b0%8f%e7%a8%8b%e5%ba%8f%e4%b8%ad%e4%bd%bf%e7%94%a8unicloud%e7%9a%84%e7%99%bd%e5%90%8d%e5%8d%95%e9%85%8d%e7%bd%ae"></j-link>
<j-link text="参考" url="https://uniapp.dcloud.net.cn/uniCloud/ext-storage/dev.html#%E5%B0%8F%E7%A8%8B%E5%BA%8F%E5%9F%9F%E5%90%8D%E7%99%BD%E5%90%8D%E5%8D%95"></j-link>
</view>
<view class="btn-list">
<button type="primary" plain @click="upload(false)">选择文件“后”上传</button>
<button type="primary" plain @click="chooseImage(false)">选择文件“后”上传</button>
<text class="tips">先调用uni.chooseImage选完文件/图片/视频后用uni.uploadFile方法上传</text>
<button type="primary" plain @click="upload(true)">上传并设为私有文件</button>
<button type="primary" plain @click="chooseImage(true)">上传并设为私有文件</button>
<text class="tips">上传完成后设置为私有文件</text>
<button type="primary" plain @click="getTempFileURL()" v-if="privateFileID">获取私有文件临时下载链接</button>
</view>
......@@ -26,7 +26,7 @@
},
mounted() {},
methods: {
upload(isPrivate) {
chooseImage(isPrivate) {
new Promise((resolve, reject) => {
uni.chooseImage({
count: 1,
......@@ -37,7 +37,8 @@
ext = res.tempFiles[0].name.split('.').pop()
const options = {
filePath: path,
cloudPath: Date.now() + '.' + ext
cloudPath: Date.now() + '.' + ext,
isPrivate
}
resolve(options)
// #endif
......@@ -61,7 +62,20 @@
reject(new Error('Fail_Cancel'))
}
})
}).then(async (options) => {
}).then((options) => {
this.uploadFile(options);
}).catch((err) => {
uni.hideLoading()
console.log(err);
if (err.message !== 'Fail_Cancel') {
uni.showModal({
content: `图片上传失败,错误信息为:${err.message}`,
showCancel: false
})
}
})
},
async uploadFile(options) {
uni.showLoading({
title: '文件上传中...'
})
......@@ -72,30 +86,18 @@
cloudPath: `test/${Date.now()}.jpg`, // 支持自定义目录
});
console.log('uploadFileOptionsRes: ', uploadFileOptionsRes)
return new Promise((resolve, reject) => {
const uploadTask = uni.uploadFile({
...uploadFileOptionsRes.uploadFileOptions, // 上传文件所需参数
filePath: options.filePath, // 本地文件路径
success: () => {
success: async () => {
const res = {
cloudPath: uploadFileOptionsRes.cloudPath, // 文件云端路径
fileID: uploadFileOptionsRes.fileID, // 文件ID
fileURL: uploadFileOptionsRes.fileURL, // 文件URL(如果是私有权限,则此URL是无法直接访问的)
};
resolve(res);
},
fail: (err) => {
reject(err);
}
});
// 监听上传进度
uploadTask.onProgressUpdate((res) => {
console.log("监听上传进度", res);
});
});
}).then(async res => {
// 上传成功后的逻辑
console.log(res);
if (isPrivate) {
if (options.isPrivate) {
// 设为私有文件
const uniCloudStorageExtCo = uniCloud.importObject("ext-storage-co", {
customUI: true
......@@ -109,9 +111,9 @@
content: '图片上传成功,fileID为:' + res.fileID,
showCancel: false
})
uni.hideLoading()
}).catch((err) => {
uni.hideLoading()
},
fail: (err) => {
// 上传失败后的逻辑
console.log(err);
if (err.message !== 'Fail_Cancel') {
uni.showModal({
......@@ -119,14 +121,22 @@
showCancel: false
})
}
})
},
async getTempFileURL(){
complete: () => {
uni.hideLoading()
}
});
// 监听上传进度
uploadTask.onProgressUpdate((res) => {
console.log("监听上传进度", res);
});
},
async getTempFileURL() {
const uniCloudStorageExtCo = uniCloud.importObject("ext-storage-co");
let res = await uniCloudStorageExtCo.getTempFileURL({
fileList: [ this.privateFileID ]
fileList: [this.privateFileID]
});
let tempFileURL = res[0].tempFileURL;
let tempFileURL = res.fileList[0].tempFileURL;
uni.showModal({
content: '图片临时下载链接为:' + tempFileURL,
showCancel: false
......
......@@ -8,7 +8,7 @@
<j-link text="参考" url="https://uniapp.dcloud.io/uniCloud/quickstart?id=%e5%b0%8f%e7%a8%8b%e5%ba%8f%e4%b8%ad%e4%bd%bf%e7%94%a8unicloud%e7%9a%84%e7%99%bd%e5%90%8d%e5%8d%95%e9%85%8d%e7%bd%ae"></j-link>
</view>
<view class="btn-list">
<button type="primary" plain @click="upload">选择文件“后”上传</button>
<button type="primary" plain @click="chooseImage">选择文件“后”上传</button>
<text class="tips">先调用uni.chooseImage选完文件/图片/视频后用uniCloud.uploadFile方法上传</text>
<button type="primary" plain @click="chooseAndUploadFile()">选择文件“并”上传</button>
<text class="tips">调用uniCloud.chooseAndUploadFile方法选择文件/图片/视频直接上传</text>
......@@ -29,7 +29,7 @@
})
uniCloud.chooseAndUploadFile({
type: 'image',
onChooseFile:(res)=> {
onChooseFile: (res) => {
console.log(res);
const processAll = []
for (let i = 0; i < res.tempFiles.length; i++) {
......@@ -96,7 +96,7 @@
// #endif
})
},
upload() {
chooseImage() {
new Promise((resolve, reject) => {
uni.chooseImage({
count: 1,
......@@ -132,24 +132,37 @@
}
})
}).then((options) => {
this.uploadFile(options);
}).catch((err) => {
uni.hideLoading()
console.log(err);
if (err.message !== 'Fail_Cancel') {
uni.showModal({
content: `图片上传失败,错误信息为:${err.message}`,
showCancel: false
})
}
})
},
uploadFile(options) {
uni.showLoading({
title: '文件上传中...'
})
return uniCloud.uploadFile({
uniCloud.uploadFile({
...options,
onUploadProgress(e) {
console.log(e)
}
})
}).then(res => {
uni.hideLoading()
},
success: (res) => {
// 上传成功后的逻辑
console.log(res);
uni.showModal({
content: '图片上传成功,fileID为:' + res.fileID,
showCancel: false
})
}).catch((err) => {
uni.hideLoading()
},
fail: (err) => {
// 上传失败后的逻辑
console.log(err);
if (err.message !== 'Fail_Cancel') {
uni.showModal({
......@@ -157,6 +170,10 @@
showCancel: false
})
}
},
complete: () => {
uni.hideLoading()
}
})
}
}
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册