uniCloud基礎入門(二)---云存儲基礎

云開發系列

視頻 https://www.bilibili.com/video/BV1eK4y1p7Qe

我們之前已經講了 云函數的使用

服務空間創建以及部署一個云函數

云函數練習—整合百度ai圖像識別SDK

這次我們來一起學習 云存儲的使用

文檔地址 https://uniapp.dcloud.io/uniCloud/storage

特別注意 阿里云服務空間和騰訊云服務空間有區別，阿里云的上傳完文件直接返回文件地址，騰訊云返回fileID 可以換取文件地址

云存儲的使用

視頻

云開發系列

云存儲基礎

服務空間的云存儲

服務空間 https://unicloud.dcloud.net.cn/home

上傳文件

https://uniapp.dcloud.io/uniCloud/storage?id=uploadfile

選擇文件/圖片/其它

如果你要上傳文件/圖片 首先要選擇文件/圖片 獲取臨時地址

https://uniapp.dcloud.io/api/media/file?id=choosefile

https://uniapp.dcloud.io/api/media/image?id=chooseimage

https://uniapp.dcloud.io/api/media/video?id=choosevideo

https://uniapp.dcloud.io/api/media/video?id=choosemedia

使用

這里舉例為上傳圖片

我們先來看看選擇照片后的打印結果

由于count我們設置成了1 所以每次最多只能選一個

uni.chooseImage({ count:1, sizeType: ['compressed'], //指定壓縮圖 success:function(res){ console.log(res) } })

如果是選擇多個照片count為5 每次最多選擇5個 情況如下

uni.chooseImage({ count:5, sizeType: ['compressed'], //指定壓縮圖 success:function(res){ console.log(res) } })

如果只有一張圖片

很顯然 我們需要拿到

res.tempFilePaths[0]

多張就要遍歷res.tempFilePaths

上傳圖片

onUploadProgress為上傳進度回調

vm.presents 為進度百分比 根據這個可以加個進度條

let path = res.tempFilePaths[0] uniCloud.uploadFile({ filePath: path, cloudPath: 'dmhsq.jpg', onUploadProgress: function(progressEvent) { console.log(progressEvent); vm.presents = Math.round( (progressEvent.loaded * 100) / progressEvent.total ); }, success: function(res) { console.log(res) uni.showToast({ icon: 'none', title: '上傳成功', duration: 1500 }) } });

我們選擇了一張圖片上傳

可以看到這里上傳成功了

我們拿到了fileId 可以獲取圖片的臨時-

https://uniapp.dcloud.io/uniCloud/storage?id=gettempfileurl

let purl = res.fileID; uni.showToast({ icon: 'none', title: '上傳成功', duration: 1500 }) uniCloud.getTempFileURL({ fileList: [purl], success: function(res) { console.log(res) } })

我們看一下 獲取圖片臨時地址的結果

文檔中這樣說 所以我們拿 tempFileURL

我們改造下 頁面代碼

看下效果

直接選擇上傳

文檔給出了

uniCloud.chooseAndUploadFile({ type: 'image', success: function(res) { console.log(res) } })

練習(實現個人用戶的頭像上傳以及更換)

我們一樣會像上一篇一樣 練習一次云存儲的使用

實現個人用戶的頭像上傳以及更換

謝謝閱讀 練習見

大學之道亦在自身，努力學習，熱血青春

存儲 視頻

版權聲明：本文內容由網絡用戶投稿，版權歸原作者所有，本站不擁有其著作權，亦不承擔相應法律責任。如果您發現本站中有涉嫌抄襲或描述失實的內容，請聯系我們jiasou666@gmail.com 處理，核實后本網站將在24小時內刪除侵權內容。