小程序云开发（五）——云存储

写在前面：

    最近看到看到很多人在感叹时间过得很快！在回想一下，时间确实过得很快，我也不由
得想起了我来上海这两年遇到的一些事情，这些事情，后续我再慢慢记录下来。这两天，我
也陆陆续续做一些面试知识总结，后面也分享给小伙伴们。咱们言归正传，小程序这里学习
没有断，我们继续。

云存储：
  我这里主要提供3种方式，上传、显示、下载的代码片段，每一行代码有对应的说明，有问题或者说的不对的，欢迎留言，共同学习。

上传图片：

/**
   * 上传图片
   */
  upload: function() {
    wx.chooseImage({//选择照片
      count: 1,//选择照片数量
      sizeType: ['original', 'compressed'],//照片的大小，original=》原图，compressed=》压缩的
      sourceType: ['album', 'camera'],//照片来源，album=》来源于相册，camera=》拍照
      success(res) {
        // tempFilePath可以作为img标签的src属性显示图片
        const tempFilePaths = res.tempFilePaths;//照片的一个虚拟路径
        console.log(tempFilePaths);
        wx.cloud.uploadFile({//调用上传文件函数，这些在小程序开发文档中有
          cloudPath: new Date().getTime() + '.png',//照片上传到云存储的自定义名称路径
          filePath: tempFilePaths[0]//取其中一张照片的虚拟路径
        }).then(res2 => {//调用成功后的的箭头函数
          console.log(res2)//成功后控制台打印
          db.collection('image').add({//找到存储图片虚拟路径的集合（也就是数据库表），并添加数据
            data: {
              fileID: res2.fileID//添加虚拟路径
            }
          }).then(res3 => {
            console.log(res3)
          }).catch(err3 => {
            console.error(err3)//错误日志在控制台打印
          })
        }).catch(err2 => {
          console.error(err2)
        })
      },
      fail(err) {
        console.error(err)
      }
    })
  },

图片显示：

  data: {
    images: []
  },

  /**
   *文件显示
   */
  getFile: function() {
    wx.cloud.callFunction({//唤醒云函数
      name: 'login'//云函数名称为“login”，项目建立之初已经存在，目的是为了确认你显示的是哪一个openID的图片，可用于信息获取
    }).then(res => {
      db.collection('image').where({//通过数据库查找image表中的数据
        _openId: res.result._openId//查找条件是openID为当前用户的
      }).get().then(res2 => {
        console.log(res2)
        this.setData({//把照片的data数据塞到data中，这时候需要显示在小程序页面中，以images: []来显示
          images: res2.data//这是所显示的data数据
        })
      }).catch(err2 => {
        console.error(err2)
      })
    }).catch(err =>{
      console.error(err)
    })
  },

下载图片：

  /**
   * 下载图片
   */
  downloadFiled: function(event) {//event参数表示上下文的内容
    wx.cloud.downloadFile({//调用已有的下载函数，这些在小程序开发文档中有
      fileID: event.target.dataset.fileid,//获取当前上下文的目标数据的文件id，可以理解为对应图片的路径
      success: res => {
        // get temp file path
        console.log(res.tempFilePath)
        wx.saveImageToPhotosAlbum({//然后调用保存图片的函数
          filePath: res.tempFilePath,//对获取到的文件路径进行保存
          success(res) {//成功的回调函数
            wx.showToast({//调用成功后显示内容
              title: '保存成功',//调用成功后会返回一个‘保存成功’的内容到界面
            })
           }
        })
      },
      fail: err => {
        // handle error
        console.error(err)
      }
    })

  },

上一篇：小程序云开发（四）——调用云函数