实战:如何使用云开发部署图文小程序应用
发布于 4 年前 作者 weiping 3786 次浏览 来自 分享

前言

如何实现快速部署上线一个图文小程序?在传统对小程序开发在传统的小程序开发中我们往往使用云服务器里面部署WebApi等的方式为小程序前端提供接口。然而使用云开发实现就能大大减轻了开发者的开发周期,使得之前需要做大量开发准备工作以及微信登陆鉴权、支付等操作大大地简化了。而且官方提供的CMS稍作开发通用性很高,大大减少了造轮子的时间。

该小程序主要有观赏艺术品、展览活动的发布、展览组队、在线看展等功能,后端全部使用云开发+CMS扩展进行管理。在这里不做流水账,主要介绍其中的展览功能相关的云开发功能。

开发文档可参考:https://docs.cloudbase.net

开发教程

小程序前端主要使用的Vant组件库进行开发,Vant的使用也是非常方便,安装过程可以查看相关文档:https://youzan.github.io/vant-weapp/#/quickstart,安装过后的项目结构大致如下:

在使用Vant组件的时候建议大家将需要使用的组件写在app.json里面当然也可以配置在单独的页面的json文件里面,如下图所示:

展览部分主要使用了腾讯云提供的CMS扩展,这个扩展可以在小程序开发IDE或者腾讯云控制台安装非常方便。

喜欢这款CMS的一大原因在于这种快捷建模并将模型同步到云数据库,而且字段的属性满足平时开发需要。云开发自带的云数据库的操作和我们平时使用的MongoDB的操作非常类似,文档性数据库扩展性非常好,索引管理与权限管理更是非常贴心。

其中索引管理默认是id和相关的openid,权限不仅仅支持常规可视化界面操作也可以自定义数据读写规则,有很好的安全性。

在小程序端使用const db=wx.cloud.database()……进行的数据写入操作为自动给_openid赋值,在查询的时候如下操作就可以,不用再去使用wx.login去获取openid。另外注意在小程序端使用get()方法查询全表数据的时候默认返回10条数据,如果需要查询全部可以使用Promise.all()的方法去获取全部集合。

 const db=wx.cloud.database()

 const data = await db.collection('Customers').where({

   _openid: '{openid}',

  }).get()

另外展览有开始时间和结束时间,我们需要在结束时间到的时候自动化地将展览下架,这里就需要使用到定时任务,在这里我们使用了腾讯云的定时云函数任务。

文档地址如下:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/functions/triggers.html

在这里只需要在云函数的config.json文件里面进行触发器triggers的设置即可,云函数便会定时进行触发。下面是云函数部分代码,集合名称(马赛克),不要照抄。哈哈哈

另外在web前端我们希望有一个投稿平台,方便艺术家进行投稿。在这里我们使用了腾讯云静态托管网站的功能,以及[@cloudbase](/user/cloudbase)/js-sdk通过CDN的方式引入进行开发。

在这里我们配置了邮箱登陆的方式进行登陆

前端开发的过程非常快捷,几个函数就可以搞定全部。

这里提示一下大家在使用邮箱登陆的时候别忘了配置一下注册成功之后跳转的应用链接。

前端在使用sdk提供的方法时需要先判断是否登陆,这样可以有更好地用户登录鉴权体验。如下所示:

 const app = cloudbase.init({

      env: "你的环境ID"

    });

    const db = app.database();

    const loginState = app.auth().hasLoginState();

    var uid = ''

    if (loginState) {

      uid = loginState.user.uid || ''

    }

这里建议大家使用这个loginState返回的uid作为数据库中唯一的用户ID。

总结

使用云开发 cloudbase 开发图文小程序应用,避免了开发过程中繁琐的服务器搭建及运维(无服务器/无运维),大大缩短了应用开发周期,实现了一个技术就可以轻松上线一个应用。云开发还提供了高可用、自动弹性扩缩的后端云服务,进一步降低开发成本,达到降本增效开发体验。

作者:多读书德力

产品介绍

云开发(Tencent CloudBase,TCB)是腾讯云提供的云原生一体化开发环境和工具平台,为开发者提供高可用、自动弹性扩缩的后端云服务,包含计算、存储、托管等serverless化能力,可用于云端一体化开发多种端应用(小程序,公众号,Web 应用,Flutter 客户端等),帮助开发者统一构建和管理后端服务和云资源,避免了应用开发过程中繁琐的服务器搭建及运维,开发者可以专注于业务逻辑的实现,开发门槛更低,效率更高。

开通云开发:https://console.cloud.tencent.com/tcb?tdl_anchor=techsite

产品文档:https://cloud.tencent.com/product/tcb?from=12763

技术文档:https://cloudbase.net?from=10004

技术交流群、最新资讯关注微信公众号【腾讯云开发CloudBase】


回到顶部