小程序云开发

小程序

一.准备工作

1.注册微信小程序

注册地址

2.下载微信开发者工具

下载地址

二.搭建工作

打开微信开发者工具，点击左上角头像用微信扫码登录后 ，点击新建项目=>会弹出新建页面

点+图表弹出新建窗口

项目名称输入你注册小程序的名称，项目目录选择一个电脑上的空文件夹，或新建一个文件夹选择。AppID填写小程序注册后的appid。

AppID

后端服务勾选云开发，即可使用小程序的云开发

云开发

点击新建后

如果没有开通云服务，点击云开发，会弹出一个开通云环境的界面，已经开通的可以省略，点击开通，输入环境id（这个环境id随便输字母，主要是为了给环境起名字）
开通后就进入云控制台，如下图

官网文档

云开发

1.云开发环境问题

切换/新建云环境


当多个环境切换，cloundfunctions右键查看当前环境

2.创建云函数

云函数

在cloundfunctions文件夹下新建文件夹

可以利用cloud（wx-server-sdk）云函数操作数据库
小程序端也可以直接操作数据库
拿到openID才可操作数据库

前端操作数据库

根据下面前端操作数据库的步骤

• 1.配置好login，获取用户openID

在cloudfunctions找到login文件夹

右键==>选择上传并部署:云端安装依赖

获取App实例

全局实例：App实例

// app.js
App({
  onLaunch: function () {
    if (!wx.cloud) {
      console.error('请使用 2.2.3 或以上的基础库以使用云能力')
    } else {
      wx.cloud.init({
        // env 参数说明：
        //   env 参数决定接下来小程序发起的云开发调用（wx.cloud.xxx）会默认请求到哪个云环境的资源
        //   此处请填入环境 ID, 环境 ID 可打开云控制台查看
        //   如不填则使用默认环境（第一个创建的环境）
        // env: 'my-env-id',
        env:"test-7ghfkg3l56beeb03",
        traceUser: true,
      })
    }

    this.globalData = {}
  }
})

下面是将内容挂在app实例的globalData

也可以使用本地缓存

const app = getApp() // 获取App实例
  onGetOpenid: function() {
    // 调用云函数
    wx.cloud.callFunction({
      name: 'login',
      data: {},
      success: res => {
        console.log('[云函数] [login] user openid: ', res.result.openid)
        app.globalData.openid = res.result.openid
        wx.navigateTo({
          url: '../userConsole/userConsole',
        })
      },
      fail: err => {
        console.error('[云函数] [login] 调用失败', err)
        wx.navigateTo({
          url: '../deployFunctions/deployFunctions',
        })
      }
    })
  },

新建集合

云开发====> 数据库 ===> 点击集合名称后面的+号

注意

当操作集合没有反应或者获取不到任何数据时，更改一下数据权限

新增记录

• 方法1：
  

// user 集合的名称
/*
增加数据
data:{
	count:1
}
*/
 const db = wx.cloud.database()
    db.collection('user').add({
      data: {
        count: 1
      },
      success: res => {
        // 在返回结果中会包含新创建的记录的 _id
        this.setData({
          counterId: res._id,
          count: 1
        })
        wx.showToast({
          title: '新增记录成功',
        })
        console.log('[数据库] [新增记录] 成功，记录 _id: ', res._id)
      },
      fail: err => {
        wx.showToast({
          icon: 'none',
          title: '新增记录失败'
        })
        console.error('[数据库] [新增记录] 失败：', err)
      }
    })

数据若没有显示，点击刷新

• 方法2

手动添加

• 方法三

弄一个JSON文件，里面写好json数据，点击导入即可

查询记录

get

const db = wx.cloud.database()
    // 查询当前用户所有的 counters
    db.collection('user').where({
      _openid: this.data.openid
    }).get({
      success: res => {
        this.setData({
          queryResult: JSON.stringify(res.data, null, 2)
        })
        console.log('[数据库] [查询记录] 成功: ', res)
      },
      fail: err => {
        wx.showToast({
          icon: 'none',
          title: '查询记录失败'
        })
        console.error('[数据库] [查询记录] 失败：', err)
      }
    })

更新记录

update
doc：获取集合中指定记录的引用。方法接受一个 id 参数，指定需引用的记录的 _id。

update-小程序文档

const db = wx.cloud.database()
    const newCount = this.data.count + 1
    db.collection('user').doc(this.data.counterId).update({
      data: {
        count: newCount
      },
      success: res => {
        this.setData({
          count: newCount
        })
      },
      fail: err => {
        icon: 'none',
        console.error('[数据库] [更新记录] 失败：', err)
      }
    })

删除记录

remove

if (this.data.counterId) {
      const db = wx.cloud.database()
      db.collection('user').doc(this.data.counterId).remove({
        success: res => {
          wx.showToast({
            title: '删除成功',
          })
          this.setData({
            counterId: '',
            count: null,
          })
        },
        fail: err => {
          wx.showToast({
            icon: 'none',
            title: '删除失败',
          })
          console.error('[数据库] [删除记录] 失败：', err)
        }
      })
    } else {
      wx.showToast({
        title: '无记录可删，请见创建一个记录',
      })
    }

上传图片

云存储

wx.cloud.uploadFile： 云开发提供的上传文件的方法
filePath：上传图片的绝对路径
cloudPath：上传到云空间的名字

// 上传图片
  doUpload: function () {
    // 选择图片
    wx.chooseImage({
      count: 1,
      sizeType: ['compressed'],
      sourceType: ['album', 'camera'],
      success: function (res) {
        wx.showLoading({
          title: '上传中',
        })

        const filePath = res.tempFilePaths[0]
        
        // 上传图片
        // cloudPath 文件名
        const cloudPath = `my-image${filePath.match(/\.[^.]+?$/)[0]}`
        // const cloudPath = `sss-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)
      }
    })
  },

对数据库的增删改查

官方文档