小程序云开发、云函数、云数据库、云存储官方案例简单解析

在学习官方的案例时，小伙伴们记得选择自己的开发环境哟 不然小程序端运行会报错

选择好自己的环境，多个环境的小伙伴,想要切换环境直接右击，“更多设置”里面可以修改

官方给出的结构图

 

 

获取头像必须使用云函数，但是云函数内容不可以直接打印到控制台，点击默认login文件夹中index.js 修改成红色，方便我们在云函数中查看。平时在调用云函数的时候大家在打印日志的时候尽量在前面加点标识，这样我们在使用的过程中查看我们的参数。

 

在小程序授权之前是要通过后台去解析才能获取openid，云函数目前只是调用一下函数就能获取用户的openId

 

获取openID

 // 调用云函数
    wx.cloud.callFunction({ //函数
      name: 'login', //函数名
      data: {}, // 这里的数据可以在event直接取出来
      success: res => { // es6 写法 
        //  res.result.openid在云函数return的 大家在开发的过程尽量把res打印先输出来
        console.log('[云函数] [login] user openid: ', res.result.openid)
        app.globalData.openid = res.result.openid // 存入全局
        wx.navigateTo({
          url: '../userConsole/userConsole',  // 跳转显示openid的页面
        })
      },
      fail: err => {
        console.error('[云函数] [login] 调用失败', err)
        wx.navigateTo({
          url: '../deployFunctions/deployFunctions',
        })
      }
    })

上传图片

 // 上传图片
  doUpload: function () {
    // 选择图片  https://developers.weixin.qq.com/miniprogram/dev/api/media/image/wx.chooseImage.html
    wx.chooseImage({
      count: 1, //上传数量
      sizeType: ['compressed'], //压缩图片
      sourceType: ['album', 'camera'], //从相册选图  使用相机
      success: function (res) {
        wx.showLoading({
          title: '上传中',
        })        
        const filePath = res.tempFilePaths[0]//取出临时图片的第一张           
        // 上传图片
        const cloudPath = 'my-image' + filePath.match(/\.[^.]+?$/)[0] // 取出后缀包括点
        wx.cloud.uploadFile({
          cloudPath, // 云路径
          filePath,  // 文件路径
          success: res => {
            console.log('[上传文件] 成功：', res)             
            app.globalData.fileID = res.fileID   
            app.globalData.cloudPath = cloudPath 
            app.globalData.imagePath = filePath         
            wx.navigateTo({
              url: '../storageConsole/storageConsole'
            })
          },
          fail: e => {
            console.error('[上传文件] 失败：', e)
            wx.showToast({
              icon: 'none',
              title: '上传失败',
            })
          },
          complete: () => {
            wx.hideLoading() 
          }
        })
​
      },
      fail: e => {
        console.error(e)
      }
    })
  }

上传成功：

数据库操作

将 pages/databaseGuide/databaseGuide.js 注释内容全部打开

后台数据创建集合counters

 

***我们根据提示一直点击下一步对比后台的数据和页面的变化。主要每一步索引的提示。

 

在有login函数返回正常和集合counters成功跟着提示就能成功完成。

 

云函数

云函数下面新建sum函数，点击index中的云函数，“测试云函数”

 

注意：wx-server-sdk需要依赖

 

记得安装依赖。

总结在云函数的操作过程中大家尽量在云函数输出根据自己的需要返回数据。