微信小程序——云开发

1、如何开通云开发?

(1)首先在小程序开发工具上面点击云开发按钮;

(2)进入到云开发的开通界面,直接点击上面的开通按钮就可以;

(3)随后会进入到一个是否开通小程序的服务和条款等  这些规范的一个确认界面,点击确定;

(4)这时会进入到环境的创建 ,可以在这个界面中填写环境的名称、环境ID,还能看到环境基础版本的配置。

注意:每个小程序账号可以免费创建两个环境,建议创建一个开发环境,另一个做为测试环境,这样可以先把功能在测试环境测试完毕再上传到正式环境;调试基础库版本要在2.2.3以上版本才可以,在小程序开发工具右上角有个详情按钮点开->本地设置->调试基础库,这里可以选择调试基础库版本。

2、如何使用云数据库?

const db = wx.cloud.database();//初始化数据库

//切换环境
const testDB = wx.cloud.database({
  env:'环境名称'
})

参考用法

cloud.wxml文件

<!--pages/cloud/cloud.wxml-->
<view class="container">
  <text>云数据库操作</text>
  <button bindtap="insert" type="primary">插入数据</button>
  <button bindtap="update" class="button" type="primary">更新数据</button>
  <button bindtap="search" class="button" type="primary">查找数据</button>
  <button bindtap="delete" class="button" type="primary">删除数据</button>

  <text class="button">云函数操作</text>
  <button bindtap="sum" type="primary">调用云函数sum</button>
  <button bindtap="getOpenId" class="button" type="primary">获取当前用户的openid</button>
  <button bindtap="batchDelete" class="button" type="primary">批量删除数据</button>

  <text class="button">云函存储</text>
  <button bindtap="upload" type="primary">上传图片</button>
  <button bindtap="getFile" class="button" type="primary">文件展示</button>
  <block wx:for="{{images}}">
    <image src="{{item.fileID}}"></image>
    <button size="mini" data-fileid="{{item.fileID}}" bindtap="downloadFile">文件下载</button>
  </block>
</view>

cloud.js文件

// pages/cloud/cloud.js
const db = wx.cloud.database();//初始化数据库
Page({

  /**
   * 页面的初始数据
   */
  data: {
    images: []
  },

  /**
   * 插入数据
   */
  insert: function(){
    // db.collection('user').add({
    //   data:{
    //     name:'jerry',
    //     age:20
    //   },
    //   success: res =>{//回调函数写法
    //     console.log(res);
    //   },
    //   fail: err =>{
    //     console.log(err);
    //   }
    // })

    db.collection('user').add({
      data:{
        name:'jack',
        age:18
      }
    }).then(res =>{//Promise写法
      console.log(res)
    }).catch(err =>{
      console.log(err)
    })
  },

  /**
   * 更新数据
   */
  update: function(){
    db.collection('user').doc('2b4144565e8e8b43004f5be670c8c61d').update({
      data:{
        age:22
      }
    }).then(res =>{
      console.log(res)
    }).catch(err =>{
      console.log(err)
    })
  },

  /**
   * 查找数据
   */
  search: function(){
    db.collection('user').where({
      name:'jerry'
    }).get().then(res =>{
      console.log('查找成功='+JSON.stringify(res))
    }).catch(err =>{
      console.log('查找失败='+JSON.stringify(err))
    })
  },

  /**
   * 删除数据
   */
  delete: function(){
    db.collection('user').doc('dc65fe3e5e8e8a1000536f8d44973c4c').remove()
    .then(res =>{
      console.log('删除成功='+JSON.stringify(res))
    }).catch(err =>{
      console.log('删除失败='+JSON.stringify(err))
    })
  },

  /**
   * 调用云函数sum
   */
  sum: function(){
    wx.cloud.callFunction({
      // 云函数名称
      name: 'sum',
      // 传给云函数的参数
      data:{
        a: 1,
        b: 2
      },
      success: function(res){
        console.log(res.result.sum)
      },
      fail: function(err){
        console.log(err)
      }
    })
  },

  /**
   * 获取当前用户的openid
   */
  getOpenId: function(){
    wx.cloud.callFunction({
      name: 'login'
    }).then(res =>{
      console.log(res)
    }).catch(err =>{
      console.log(err)
    })
  },

  /**
   * 批量删除数据
   */
  batchDelete: function(){
    wx.cloud.callFunction({
      name: 'batchDelete'
    }).then(res =>{
      console.log(res)
    }).catch(err =>{
      console.log(err)
    })
  },

  /**
   * 上传图片
   */
  upload: function(){
    // 选择图片
    wx.chooseImage({
      count: 1,// 最多可选择9张图片
      sizeType: ['original', 'compressed'],
      sourceType: ['album', 'camera'],
      success (res) {
        // tempFilePath可以作为img标签的src属性显示图片
        const tempFilePaths = res.tempFilePaths
        console.log(tempFilePaths);
        // 将图片上传至云存储空间
        wx.cloud.uploadFile({
          // 指定上传到的云路径
          cloudPath: 'images/'+new Date().getTime()+'.png',
          // 指定要上传的文件的小程序临时文件路径
          filePath: tempFilePaths[0],
          // 成功回调
          success: res => {
            console.log('上传成功', res)
            // 将fileID存储到云数据库
            db.collection('image').add({
              data:{
                fileID: res.fileID
              }
            }).then(res =>{
              console.log('存储成功',res)
            }).catch(err =>{
              console.log('存储失败',err)
            })
          },
          fail: err =>{
            console.log('上传失败',err)
          }
        })
      }
    })
  },

  /**
   * 获取文件  并展示
   */
  getFile: function(){
    var that = this;
    wx.cloud.callFunction({
      name: 'login'
    }).then(res =>{
      // 成功 根据login返回的openid取查询图片所对应的结果
      db.collection('image').where({
        _openid: res.result.openid
      }).get().then(res2 =>{
        console.log('查询结果',res2)
        that.setData({
          images: res2.data
        });
      })
    })
  },

  /**
   * 文件下载
   */
  downloadFile: function(event){
    wx.cloud.downloadFile({
      fileID: event.target.dataset.fileid, // 文件 ID
      success: res => {
        // 返回临时文件路径
        console.log(res.tempFilePath)
        // 保存图片到系统相册
        wx.saveImageToPhotosAlbum({
          filePath: res.tempFilePath,
          success(res) {
            wx.showToast({
              title: '保存成功',
            })
          }
        })
      },
      fail: console.error
    })
  },
})

3、云函数

云函数就是一段运行在云端的代码,相当于小程序服务端的后台代码,我们不需要管理服务器,只需要在开发工具中编写代码,通过一键上传部署就可以运行这些代码,由于小程序云函数的运行环境是nodejs,因此需要安装nodejs环境。

安装nodejs

nodejs官网下载node.js安装包,需要node.js v8.0及以上版本

点击上面按钮就会自动下载安装包,安装时候一直点下一步就可以。

验证nodejs是否安装成功

打开电脑终端,输入node -v,如果输出对应版本号,就说明node是安装成功的;我们也可以查看一下npm的版本,npm就是node的一个包管理工具,输入npm -v,如果输出对应版本号,就说明node是安装成功的

最近时间比较紧,先发布一篇之前保存的吧,内容可能不太完整 

  • 0
    点赞
  • 6
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

时代新人

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值