快速了解小程序的云开发

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档


前言

一个小程序在开发时,除了考虑界面功能逻辑外,还需要后端的数据支持。而为了获得后端的数据支持,开发者需要提前考虑服务器、存储和数据库等需求,并且会花费时间精力在部署应用、依赖上。因此官方为了实现小程序的快速上线和迭代,为开发者提供了一个云开发的功能,将以服务的方式为开发者提供如云函数、数据库、存储管理等所需功能,大大降低了小程序的开发门槛,仅需通过小程序云开发提供的接口,就能实现因缺乏后端知识而无法实现的需求。本章内容将简单讲解如何使用小程序云开发。


提示:以下是本篇文章正文内容,下面案例可供参考

一、云开发

小程序开发工具创建云开发模板
创建后,即可获得一个云开发的模板项目,在其上修改为我们想要的项目。
在这里插入图片描述

二、云开发配置

config配置
在这里插入图片描述
配置完成就可使用云开发了


三、云函数

1.介绍

云函数即在云端(服务器端)运行的函数。在物理设计上,一个云函数可由多个文件组成,占用一定量的 CPU 内存等计算资源;各云函数完全独立;可分别部署在不同的地区。开发者无需购买、搭建服务器,只需编写函数代码并部署到云端即可在小程序端调用,同时云函数之间也可互相调用。云函数相当于传统的前后端分离开发中后端代码,运行在服务器中,对数据库的读写操作更快,可处理更加复杂的计算。一个云函数的写法与一个在本地定义的 JavaScript 方法无异,代码运行在云端 Node.js 中。

2.使用

在云函数根目录上右键,在右键菜单中,可以选择创建一个新的 Node.js 云函数,我们将该云函数命名为 add。
在这里插入图片描述
开发者工具在本地创建出云函数目录和入口 index.js 文件,同时在线上环境中创建出对应的云函数。我们可以看到类似如下的一个云函数模板:

// 云函数入口文件
const cloud = require('wx-server-sdk')

// 初始化云函数
cloud.init()

// 云函数入口函数
exports.main = async (event, context) => {
    // 获取了微信的上下文(相关参数)
    const wxContext = cloud.getWXContext()

    return {
        event, //event用户的参数
        openid: wxContext.OPENID, //openid
        appid: wxContext.APPID,  //返回appid
        unionid: wxContext.UNIONID, //唯一id
    }
}
// cloud 云,require需要,server服务 
// init 初始化  mian主要的,async异步  event事件,context上下文

云函数的传入参数有两个,一个是 event 对象,一个是 context 对象。event 指的是触发云函数的事件,当小程序端调用云函数时,event 就是小程序端调用云函数时传入的参数,外加后端自动注入的小程序用户的 openid 和小程序的 appid。context 对象包含了此处调用的调用信息和运行状态,可以用它来了解服务运行的情况。

我们修改一下模板的返回值:

exports.main = async (event, context) => {
    // 获取了微信的上下文(相关参数)
    const wxContext = cloud.getWXContext()

    return {
        event, //event用户的参数
        sum:event.a+event.b, //返回a,b两个参数的和
        openid: wxContext.OPENID, //openid
        appid: wxContext.APPID,  //返回appid
        unionid: wxContext.UNIONID, //唯一id
    }
}

在小程序中调用这个云函数前,我们还需要先将该云函数部署到云端。在云函数目录上右键,在右键菜单中,我们可以将云函数整体打包上传并部署到线上环境中。部署完成后,我们可以在小程序中调用该云函数:

 add(){
        // 调用云函数add,并传入a,b两个参数
        wx.cloud.callFunction({
            name:"add",
            data:{a:3,b:2}
        })
        .then(res=>{
            console.log("成功",res.result)
        })
        .catch(err=>{
            console.log(err)
        })
    },

四、云数据库

1.创建云数据库

打开云开发控制台,选择数据库,然后就可以创建集合了
在这里插入图片描述
创建集合后,可以给集合添加记录,在记录上填写字段名称、选择字段类型以及字段的值。
在这里插入图片描述
添加字段后可以发现集合中多了一个记录
在这里插入图片描述
记录中有一个字段_id是记录的唯一标识,默认由系统生成,也可以自己定义

数据库创建好集合后即可在小程序上调用,数据库无非就四个基本操作:增删查改

2.使用云数据库

创建一个云函数getFeed来获取数据库guest里的内容
创建完云函数记得上传云函数,否则无法调用
在这里插入图片描述

// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init()
// 获取到数据库
const db = cloud.database();

// 云函数入口函数
exports.main = async (event, context) => {
    //分页
    var pagination={
        current:event.current||1,
        pageSize:event.pageSize||3
    }
    const total=await db.collection("guest").count()
    const wxContext = cloud.getWXContext()
    // 获取到guest里面的所有数据
    const data = await db.collection("guest").orderBy("date",'desc')
    .skip((pagination.current-1)*pagination.pageSize)
    .limit(pagination.pageSize).get();
    pagination.total=total.total;//总条数
    pagination.totalPage = Math.ceil( pagination.total/ pagination.pageSize); //总页数
    return {
        event,
        openid: wxContext.OPENID,
        appid: wxContext.APPID,
        unionid: wxContext.UNIONID,
        data,
        pagination
    }
}

然后页面调用getFeed云函数来获取guest里的所有数据

data: {
        list:[], //存放评论列表
       
    },
getFeed(){
        wx.showLoading({title: '加载中'});
        var that = this;
        
        // 调用getfeed云函数
        wx.cloud.callFunction({name:"getFeed",data:{current:that.data.current}})
        .then(res=>{
            console.log("数据",res.result)
            // 更新list数据
            that.setData({list:res.result.data.data.map(item=>({...item,date:formatDate(item.date,"-")}))})
            that.setData({"pagination":res.result.pagination})
            wx.hideLoading();
        })
        .catch(err=>console.log(err))
    },

获取完数据在页面中遍历出来即可
数据库增删改查步骤基本一样,这里就不一一赘述。

五、总结

小程序云开发的好处就是我们无需考虑后端服务器的问题,掌握小程序云开发相当于有全栈开发的能力,一个人就完成一个有后端服务支持的小程序,使得小程序真正的活起来。但想真正的掌握云开发则需要我们多看官方文档,对数据库、云函数、云存储等等后端服务有进一步的理解。

  • 2
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值