From ec31e9ab4c1cb29999676791c9f43cd6c29a7836 Mon Sep 17 00:00:00 2001
From: VK <370725567@qq.com>
Date: Tue, 28 Nov 2023 15:03:53 +0800
Subject: [PATCH] =?UTF-8?q?=E6=96=B0=E5=A2=9E=E6=89=A9=E5=B1=95=E5=AD=98?=
 =?UTF-8?q?=E5=82=A8-=E4=B8=83=E7=89=9B=E4=BA=91=E7=9A=84=E6=BC=94?=
 =?UTF-8?q?=E7=A4=BA=E9=A1=B5=E9=9D=A2=EF=BC=88=E9=9C=80=E8=A6=81=E6=94=B9?=
 =?UTF-8?q?=E4=B8=8B=E8=87=AA=E5=AE=9A=E4=B9=89=E5=9F=9F=E5=90=8D=EF=BC=89?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 pages.json                                    |  14 ++
 pages/storage/ext-storage-qiniu.vue           | 168 +++++++++++++++
 pages/storage/space-storage.vue               | 195 ++++++++++++++++++
 pages/storage/storage.vue                     | 164 +--------------
 .../ext-storage-co/index.obj.js               |  64 ++++++
 .../ext-storage-co/package.json               |   7 +
 6 files changed, 456 insertions(+), 156 deletions(-)
 create mode 100644 pages/storage/ext-storage-qiniu.vue
 create mode 100644 pages/storage/space-storage.vue
 create mode 100644 uniCloud-aliyun/cloudfunctions/ext-storage-co/index.obj.js
 create mode 100644 uniCloud-aliyun/cloudfunctions/ext-storage-co/package.json

diff --git a/pages.json b/pages.json
index a5e596e..b6e8b1c 100644
--- a/pages.json
+++ b/pages.json
@@ -99,6 +99,20 @@
         "enablePullDownRefresh": false
       }
     },
+    {
+      "path": "pages/storage/space-storage",
+      "style": {
+        "navigationBarTitleText": "空间内置云存储",
+        "enablePullDownRefresh": false
+      }
+    },
+    {
+      "path": "pages/storage/ext-storage-qiniu",
+      "style": {
+        "navigationBarTitleText": "扩展存储-七牛云",
+        "enablePullDownRefresh": false
+      }
+    },
     {
       "path": "pages/schema2code/schema2code",
       "style": {
diff --git a/pages/storage/ext-storage-qiniu.vue b/pages/storage/ext-storage-qiniu.vue
new file mode 100644
index 0000000..4b280d8
--- /dev/null
+++ b/pages/storage/ext-storage-qiniu.vue
@@ -0,0 +1,168 @@
+<template>
+	<view class="content">
+		<view class="title">直接上传文件到扩展存储-七牛云</view>
+		<view class="tips">
+			<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>
+		</view>
+		<view class="btn-list">
+			<button type="primary" plain @click="upload(false)">选择文件“后”上传</button>
+			<text class="tips">先调用uni.chooseImage选完文件/图片/视频后用uni.uploadFile方法上传</text>
+			<button type="primary" plain @click="upload(true)">上传并设为私有文件</button>
+			<text class="tips">上传完成后设置为私有文件</text>
+			<button type="primary" plain @click="getTempFileURL()" v-if="privateFileID">获取私有文件临时下载链接</button>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				privateFileID: ""
+			}
+		},
+		mounted() {},
+		methods: {
+			upload(isPrivate) {
+				new Promise((resolve, reject) => {
+					uni.chooseImage({
+						count: 1,
+						success: res => {
+							const path = res.tempFilePaths[0]
+							let ext
+							// #ifdef H5
+							ext = res.tempFiles[0].name.split('.').pop()
+							const options = {
+								filePath: path,
+								cloudPath: Date.now() + '.' + ext
+							}
+							resolve(options)
+							// #endif
+							// #ifndef H5
+							uni.getImageInfo({
+								src: path,
+								success(info) {
+									const options = {
+										filePath: path,
+										cloudPath: Date.now() + '.' + info.type.toLowerCase()
+									}
+									resolve(options)
+								},
+								fail(err) {
+									reject(new Error(err.errMsg || '未能获取图片类型'))
+								}
+							})
+							// #endif
+						},
+						fail: () => {
+							reject(new Error('Fail_Cancel'))
+						}
+					})
+				}).then(async (options) => {
+					uni.showLoading({
+						title: '文件上传中...'
+					})
+					const uniCloudStorageExtCo = uniCloud.importObject("ext-storage-co", {
+						customUI: true
+					});
+					const uploadFileOptionsRes = await uniCloudStorageExtCo.getUploadFileOptions({
+						cloudPath: `test/${Date.now()}.jpg`, // 支持自定义目录
+					});
+					console.log('uploadFileOptionsRes: ', uploadFileOptionsRes)
+					return new Promise((resolve, reject) => {
+						const uploadTask = uni.uploadFile({
+							...uploadFileOptionsRes.uploadFileOptions, // 上传文件所需参数
+							filePath: options.filePath, // 本地文件路径
+							success: () => {
+								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) {
+						// 设为私有文件
+						const uniCloudStorageExtCo = uniCloud.importObject("ext-storage-co", {
+							customUI: true
+						});
+						await uniCloudStorageExtCo.setFilePrivate({
+							fileID: res.fileID
+						});
+						this.privateFileID = res.fileID;
+					}
+					uni.showModal({
+						content: '图片上传成功，fileID为：' + res.fileID,
+						showCancel: false
+					})
+					uni.hideLoading()
+				}).catch((err) => {
+					uni.hideLoading()
+					console.log(err);
+					if (err.message !== 'Fail_Cancel') {
+						uni.showModal({
+							content: `图片上传失败，错误信息为：${err.message}`,
+							showCancel: false
+						})
+					}
+				})
+			},
+			async getTempFileURL(){
+				const uniCloudStorageExtCo = uniCloud.importObject("ext-storage-co");
+				let res = await uniCloudStorageExtCo.getTempFileURL({
+					fileList: [ this.privateFileID ]
+				});
+				let tempFileURL = res[0].tempFileURL;
+				uni.showModal({
+					content: '图片临时下载链接为：' + tempFileURL,
+					showCancel: false
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.content {
+		padding-bottom: 30px;
+	}
+
+	.title {
+		font-weight: bold;
+		text-align: center;
+		padding: 20px 0px;
+		font-size: 20px;
+	}
+
+	.tips {
+		color: #999999;
+		font-size: 14px;
+		padding: 20px 30px;
+	}
+
+	.btn-list {
+		padding: 0px 30px;
+	}
+
+	.btn-list button {
+		margin-top: 20px;
+	}
+
+	.upload-preview {
+		width: 100%;
+	}
+</style>
diff --git a/pages/storage/space-storage.vue b/pages/storage/space-storage.vue
new file mode 100644
index 0000000..e8cdeb7
--- /dev/null
+++ b/pages/storage/space-storage.vue
@@ -0,0 +1,195 @@
+<template>
+	<view class="content">
+		<view class="title">直接上传文件到云存储</view>
+		<view class="tips">
+			<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>
+		</view>
+		<view class="btn-list">
+			<button type="primary" plain @click="upload">选择文件“后”上传</button>
+			<text class="tips">先调用uni.chooseImage选完文件/图片/视频后用uniCloud.uploadFile方法上传</text>
+			<button type="primary" plain @click="chooseAndUploadFile()">选择文件“并”上传</button>
+			<text class="tips">调用uniCloud.chooseAndUploadFile方法选择文件/图片/视频直接上传</text>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {}
+		},
+		mounted() {},
+		methods: {
+			chooseAndUploadFile(file) {
+				uni.showLoading({
+					title: '文件上传中...'
+				})
+				uniCloud.chooseAndUploadFile({
+					type: 'image',
+					onChooseFile:(res)=> {
+						console.log(res);
+						const processAll = []
+						for (let i = 0; i < res.tempFiles.length; i++) {
+							processAll.push(this.cropImg(res.tempFiles[i]))
+						}
+						return Promise.all(processAll).then((fileList) => {
+							let result = {
+								tempFilePaths: []
+							}
+							result.tempFiles = fileList.map((fileItem, index) => {
+								result.tempFilePaths.push(fileItem.path)
+								return {
+									path: fileItem.path,
+									cloudPath: '' + Date.now() + index + '.' + fileItem.ext, // 云端路径，这里随便生成了一个
+									fileType: fileItem.fileType
+								}
+							})
+							return result
+						})
+					}
+				}).then(res => {
+					console.log(res)
+					uni.showModal({
+						content: JSON.stringify(res),
+						showCancel: false
+					});
+				}).catch((err) => {
+					console.log(err);
+					uni.showModal({
+						content: JSON.stringify(err),
+						showCancel: false
+					});
+				}).finally(() => {
+					uni.hideLoading()
+				})
+			},
+			cropImg(file) {
+				return new Promise((resolve, reject) => {
+					let ext
+					let filePathProcessed = file.path // 处理结果
+					// #ifdef H5
+					ext = file.name.split('.').pop()
+					resolve({
+						path: filePathProcessed,
+						ext,
+						fileType: file.fileType
+					})
+					// #endif
+					// #ifndef H5
+					uni.getImageInfo({
+						src: file.path,
+						success(info) {
+							ext = info.type.toLowerCase()
+							resolve({
+								path: filePathProcessed,
+								ext,
+								fileType: file.fileType
+							})
+						},
+						fail(err) {
+							reject(new Error(err.errMsg || '未能获取图片类型'))
+						}
+					})
+					// #endif
+				})
+			},
+			upload() {
+				new Promise((resolve, reject) => {
+					uni.chooseImage({
+						count: 1,
+						success: res => {
+							const path = res.tempFilePaths[0]
+							let ext
+							// #ifdef H5
+							ext = res.tempFiles[0].name.split('.').pop()
+							const options = {
+								filePath: path,
+								cloudPath: Date.now() + '.' + ext
+							}
+							resolve(options)
+							// #endif
+							// #ifndef H5
+							uni.getImageInfo({
+								src: path,
+								success(info) {
+									const options = {
+										filePath: path,
+										cloudPath: Date.now() + '.' + info.type.toLowerCase()
+									}
+									resolve(options)
+								},
+								fail(err) {
+									reject(new Error(err.errMsg || '未能获取图片类型'))
+								}
+							})
+							// #endif
+						},
+						fail: () => {
+							reject(new Error('Fail_Cancel'))
+						}
+					})
+				}).then((options) => {
+					uni.showLoading({
+						title: '文件上传中...'
+					})
+					return uniCloud.uploadFile({
+						...options,
+						onUploadProgress(e) {
+							console.log(e)
+						}
+					})
+				}).then(res => {
+					uni.hideLoading()
+					console.log(res);
+					uni.showModal({
+						content: '图片上传成功，fileID为：' + res.fileID,
+						showCancel: false
+					})
+				}).catch((err) => {
+					uni.hideLoading()
+					console.log(err);
+					if (err.message !== 'Fail_Cancel') {
+						uni.showModal({
+							content: `图片上传失败，错误信息为：${err.message}`,
+							showCancel: false
+						})
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.content {
+		padding-bottom: 30px;
+	}
+
+	.title {
+		font-weight: bold;
+		text-align: center;
+		padding: 20px 0px;
+		font-size: 20px;
+	}
+
+	.tips {
+		color: #999999;
+		font-size: 14px;
+		padding: 20px 30px;
+	}
+
+	.btn-list {
+		padding: 0px 30px;
+	}
+
+	.btn-list button {
+		margin-top: 20px;
+	}
+
+	.upload-preview {
+		width: 100%;
+	}
+</style>
diff --git a/pages/storage/storage.vue b/pages/storage/storage.vue
index 1aa986d..33014b0 100644
--- a/pages/storage/storage.vue
+++ b/pages/storage/storage.vue
@@ -1,17 +1,10 @@
 <template>
 	<view class="content">
-		<view class="title">直接上传文件到云存储</view>
-		<view class="tips">
-			<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>
-		</view>
 		<view class="btn-list">
-			<button type="primary" plain @click="upload">选择文件“后”上传</button>
-			<text class="tips">先调用chooseImage选完文件/图片/视频后用uploadFile方法上传</text>
-			<button type="primary" plain @click="chooseAndUploadFile()">选择文件“并”上传</button>
-			<text class="tips">调用chooseAndUploadFile方法选择文件/图片/视频直接上传</text>
+			<button type="primary" plain @click="pageTo('/pages/storage/space-storage')">空间内置云存储</button>
+			<text class="tips">演示空间自带的云储存</text>
+			<button type="primary" plain @click="pageTo('/pages/storage/ext-storage-qiniu')">扩展存储-七牛云</button>
+			<text class="tips">演示扩展存储-七牛云</text>
 		</view>
 	</view>
 </template>
@@ -23,141 +16,10 @@
 		},
 		mounted() {},
 		methods: {
-			chooseAndUploadFile(file) {
-				uni.showLoading({
-					title: '文件上传中...'
-				})
-				uniCloud.chooseAndUploadFile({
-					type: 'image',
-					onChooseFile:(res)=> {
-						console.log(res);
-						const processAll = []
-						for (let i = 0; i < res.tempFiles.length; i++) {
-							processAll.push(this.cropImg(res.tempFiles[i]))
-						}
-						return Promise.all(processAll).then((fileList) => {
-							let result = {
-								tempFilePaths: []
-							}
-							result.tempFiles = fileList.map((fileItem, index) => {
-								result.tempFilePaths.push(fileItem.path)
-								return {
-									path: fileItem.path,
-									cloudPath: '' + Date.now() + index + '.' + fileItem.ext, // 云端路径，这里随便生成了一个
-									fileType: fileItem.fileType
-								}
-							})
-							return result
-						})
-					}
-				}).then(res => {
-					console.log(res)
-					uni.showModal({
-						content: JSON.stringify(res),
-						showCancel: false
-					});
-				}).catch((err) => {
-					console.log(err);
-					uni.showModal({
-						content: JSON.stringify(err),
-						showCancel: false
-					});
-				}).finally(() => {
-					uni.hideLoading()
-				})
-			},
-			cropImg(file) {
-				return new Promise((resolve, reject) => {
-					let ext
-					let filePathProcessed = file.path // 处理结果
-					// #ifdef H5
-					ext = file.name.split('.').pop()
-					resolve({
-						path: filePathProcessed,
-						ext,
-						fileType: file.fileType
-					})
-					// #endif
-					// #ifndef H5
-					uni.getImageInfo({
-						src: file.path,
-						success(info) {
-							ext = info.type.toLowerCase()
-							resolve({
-								path: filePathProcessed,
-								ext,
-								fileType: file.fileType
-							})
-						},
-						fail(err) {
-							reject(new Error(err.errMsg || '未能获取图片类型'))
-						}
-					})
-					// #endif
-				})
-			},
-			upload() {
-				new Promise((resolve, reject) => {
-					uni.chooseImage({
-						count: 1,
-						success: res => {
-							const path = res.tempFilePaths[0]
-							let ext
-							// #ifdef H5
-							ext = res.tempFiles[0].name.split('.').pop()
-							const options = {
-								filePath: path,
-								cloudPath: Date.now() + '.' + ext
-							}
-							resolve(options)
-							// #endif
-							// #ifndef H5
-							uni.getImageInfo({
-								src: path,
-								success(info) {
-									const options = {
-										filePath: path,
-										cloudPath: Date.now() + '.' + info.type.toLowerCase()
-									}
-									resolve(options)
-								},
-								fail(err) {
-									reject(new Error(err.errMsg || '未能获取图片类型'))
-								}
-							})
-							// #endif
-						},
-						fail: () => {
-							reject(new Error('Fail_Cancel'))
-						}
-					})
-				}).then((options) => {
-					uni.showLoading({
-						title: '文件上传中...'
-					})
-					return uniCloud.uploadFile({
-						...options,
-						onUploadProgress(e) {
-							console.log(e)
-						}
-					})
-				}).then(res => {
-					uni.hideLoading()
-					console.log(res);
-					uni.showModal({
-						content: '图片上传成功，fileId为：' + res.fileID,
-						showCancel: false
-					})
-				}).catch((err) => {
-					uni.hideLoading()
-					console.log(err);
-					if (err.message !== 'Fail_Cancel') {
-						uni.showModal({
-							content: `图片上传失败，错误信息为：${err.message}`,
-							showCancel: false
-						})
-					}
-				})
+			pageTo(url){
+				uni.navigateTo({
+					url
+				});
 			}
 		}
 	}
@@ -168,13 +30,6 @@
 		padding-bottom: 30px;
 	}
 
-	.title {
-		font-weight: bold;
-		text-align: center;
-		padding: 20px 0px;
-		font-size: 20px;
-	}
-
 	.tips {
 		color: #999999;
 		font-size: 14px;
@@ -189,7 +44,4 @@
 		margin-top: 20px;
 	}
 
-	.upload-preview {
-		width: 100%;
-	}
 </style>
diff --git a/uniCloud-aliyun/cloudfunctions/ext-storage-co/index.obj.js b/uniCloud-aliyun/cloudfunctions/ext-storage-co/index.obj.js
new file mode 100644
index 0000000..bb817d7
--- /dev/null
+++ b/uniCloud-aliyun/cloudfunctions/ext-storage-co/index.obj.js
@@ -0,0 +1,64 @@
+// 扩展存储自定义域名
+const domain = "qiniu01.dcloud.net.cn";
+module.exports = {
+	_before() {},
+	getUploadFileOptions(data = {}) {
+		let {
+			cloudPath, // 前端传过来的文件路径
+		} = data;
+		// 可以在此先判断下此路径是否允许上传等逻辑
+		// ...
+
+		// 然后获取 extStorageManager 对象实例
+		const extStorageManager = uniCloud.getExtStorageManager({
+			provider: "qiniu", // 扩展存储供应商
+			domain: domain, // 带http协议头的域名地址
+		});
+		// 最后调用 extStorageManager.getUploadFileOptions
+		let uploadFileOptionsRes = extStorageManager.getUploadFileOptions({
+			cloudPath: cloudPath,
+			allowUpdate: false, // 是否允许覆盖更新，如果返回前端，建议设置false，代表仅新增，不可覆盖
+		});
+		return uploadFileOptionsRes;
+	},
+	// 设置文件为私有权限
+	async setFilePrivate(data = {}) {
+		let {
+			fileID
+		} = data;
+		// 可以在此先判断下此路径是否允许设置为私有权限
+		// ...
+
+		// 然后获取 extStorageManager 对象实例
+		const extStorageManager = uniCloud.getExtStorageManager({
+			provider: "qiniu", // 扩展存储供应商
+			domain: domain, // 带http协议头的域名地址
+		});
+		let res = await extStorageManager.updateFileStatus({
+			fileID, // 私有文件id
+			isPrivate: true, // true 私有 false 公共
+		});
+		console.log('updateFileStatus: ', res);
+		return res;
+	},
+	// 获取临时下载链接
+	async getTempFileURL(data = {}) {
+		let {
+			fileList
+		} = data;
+		// 可以在此先判断下是否有权限访问这些私有文件
+		// ...
+
+		// 然后获取 extStorageManager 对象实例
+		const extStorageManager = uniCloud.getExtStorageManager({
+			provider: "qiniu", // 扩展存储供应商
+			domain: domain, // 带http协议头的域名地址
+		});
+		let res = extStorageManager.getTempFileURL({
+			fileList
+		});
+		console.log('getTempFileURL: ', res);
+		return res;
+	},
+
+}
\ No newline at end of file
diff --git a/uniCloud-aliyun/cloudfunctions/ext-storage-co/package.json b/uniCloud-aliyun/cloudfunctions/ext-storage-co/package.json
new file mode 100644
index 0000000..73cb5b1
--- /dev/null
+++ b/uniCloud-aliyun/cloudfunctions/ext-storage-co/package.json
@@ -0,0 +1,7 @@
+{
+  "name": "ext-storage-co",
+  "dependencies": {},
+  "extensions": {
+    "uni-cloud-ext-storage": {}
+  }
+}
\ No newline at end of file
-- 
GitLab