[微信小程序 开发] 云存储

云开发提供了一块存储空间，提供了上传文件到云端、带权限管理的云端下载能力，开发者可以在小程序端和云函数端通过 API 使用云存储功能。
 

使用的API:

• wx.chooseMedia
• wx.cloud.uploadFile
• wx.cloud.downloadFile

获取数据 

.wxml

<text capture-bind:tap="seleteImage">选择图片上传</text>

.js

data: {
    // 记录云端fileID
    fileID: ''
},

seleteImage: function() {
    // 打开相册或相机
    wx.chooseMedia({ 
        count: 1,                       // 可以选几张照片 
        mediaType: ['image','video'],   // 可以选择相片和视频 
        sourceType: ['album','camera'], // 可以用相机和相册  
        maxDuration: 30,                // 上传timeOut
        camera: 'back',
        success:(res=>{   
            this.setData({ 
                imagePath: res.tempFiles[0].tempFilePath,
            })
            this.up()                   // 调上传函数
         }) 
     }) 
},

 

上传数据

 .js

    up: function() {  
        wx.cloud.uploadFile({
            cloudPath:new Date().getTime() + ".jpg",  // 云端存储的名字
            filePath: this.data.imagePath,            // 本地文件的地址
            success:(res=>{    
                this.setData({
                    fileID: res.fileID
                }) 
            })
        })
    },

从云端获取数据

 .js 

    downloadImage: function() {
        wx.cloud.downloadFile({
            fileID: this.data.fileID,
            success:(res=>{
                console.log(res.tempFilePath)
                this.setData({
                    imageName: res.tempFilePath
                })
            }),
            fail:(err=>{ console.log(err) }) 
        })
    },

 

如果需求是上传多个文件 

    data: {
        imagePaths:[],        // 存储选择文件地址
        imagesFileID:[]。     // 云端文件的fileID
    },

    seleteMultipleImage: function() {
        wx.chooseMedia({
            count: 9,
            mediaType: ['image','video'],
            sourceType: ['album','camera'],
            maxDuration: 30,
            camera: 'back',
            success:(res=>{   
                for(var i = 0; i< res.tempFiles.length; i++) {
                    this.data.imagePaths.push(res.tempFiles[i].tempFilePath)
                } 
                var rows = [];
                this.upMultipleImages()
            }) 
         })  
         
    },

 最大选择文件数量是count那个参数，如果是选择头像照片，只能选择一张，count: 1就行

 imagePaths数组记录选择文件的地址

 上传多个文件

    upMultipleImages:function() {
        var rows = []; 
        this.data.imagePaths.forEach(element => {
            var suffix = /\.\w+$/.exec(element)[0];
            var newFile = new Date().getTime();
            newFile += suffix ;
            rows.push(new Promise((resolve,reject) =>{
                wx.cloud.uploadFile({
                    cloudPath: newFile,
                    filePath: element,
                    success:(res=>{   
                        this.data.imagesFileID.push(res.fileID);
                        resolve()
                    }),
                    fail:(err=>{ console.log(err)})
                })
            }))
        }); 

        Promise.all(rows).then(res=>{
            console.log("**********全部上传成功********")
            this.data.imagePaths.length = 0;
            this.data.imagesFileID.length = 0; 
        })
    },

 上传多个文件也要一个一个的传，没有一次传多个的接口

这里用了Promise, 等都上传完毕以后通知