从小程序到小程序云开发

4
腾讯产业互联网学堂热门学习路径,0基础上手
7
腾讯云培训认证体系,助力云开发者成就职业梦想
  • 1
    关注“腾讯产业互联网学堂”公众号加群互动有好礼相送
  • 2
    回复口令 “5”
  • 3
    获得课程福利包
腾讯产业互联网学堂微信公众号
“腾讯产业互联网学堂”微信公众号

讲师简介

李成熙

前 AlloyTeam 成员,先后负责腾讯文档、腾讯花样直播等 多款小程序的开发。专注于前端性能优化、工程化与小程序服务。

简介

本次直播课程将邀请到小程序云开发后端服务 TCB 团队的主要技术负责人 Heyli,从小程序开发入手,完全讲述小程序开发中的技术痛点及其解决方案,帮助小程序从业者,小程序开发人员,梳理小程序开发及其小程序云开发中的各种问题。 本课程是小程序云开发的系列直播课程,围绕小程序开发、H5开发等展开。通过参与系列课程,将逐渐掌握云开发能力。

课程讲义

小程序云开发为微信小程序开发者提供云到端的一站式解决方案,帮助开发者统一构建和管理资源,能有效降低技术门槛、减少研发成本、提升开发效率,协助开发者快速搭建稳定高质量的微信小程序应用。

本期腾讯产业互联网学堂大咖分享邀请 李成熙 老师,从小程序开发入手,完全讲述小程序开发中的技术痛点及其解决方案,帮助小程序从业者,小程序开发人员,梳理小程序开发及其小程序云开发中的各种问题。 本课程是小程序云开发的系列直播课程,围绕小程序开发、H5开发等展开。通过参与系列课程,将逐渐掌握云开发能力。

本次分享内容:

1、小程序与小程序开发生态

2、小程序基础

3、小程序后台开发

4、小程序云开发

5、小程序云开发经典架构

1. 小程序与小程序开发生态

在 2019 年 Q1,微信和 WeChat 的合并活跃用户为 11.12 亿,而小程序的活跃用户从 17 年初发布后,在 18 年底增长到了 2.3 亿。小程序主要有以下几个特点:

  • 速度快。无需下载安装,加载速度快于 app HTML5,随时可用
  • 无适配。一次开发,多端兼容,免除了对各种手机机型的适配
  • 可分享。支持图文分享、支持分享给微信好友和群聊
  • 体验好。可达到近乎与原生 app 相同的操作体验和流畅度
  • 易获取。支持扫码、微信搜索、好友推荐等发起场景
  • 低门槛。基于微信的生态。已有公众号的组织可快速注册、可快速生成小程序

据报告数据显示,目前微信小程序的累积用户量已突破7亿,占微信月活用户的70%,用户使用习惯形成。微信小程序向2.0运营时代迈进,发展侧重点由原来的拉新进阶转向用户的运营留存,日活用户已达2亿。

截至2018年11月,微信小程序总量超过120万,开发者人数超过150万,第三方平台总量超过5000,小程序数量又上了一个台阶,开发者生态逐渐繁荣,小程序市场规模依然保持了高速增长趋势。小程序的场景覆盖面边界迅速拓宽,超过半数用户的小程序使用频次在4-6次。同时受到小游戏发展的影响,用户的沉浸时长明显提升,截止11月,微信小程序的用户日均使用时长已超15分钟,用户形成了主动使用小程序的习惯。

小程序已成为2018年的投资风口,上半年80%一线基金机构入场,投资金额超过30亿人民币,预测投资超过100亿人民币。

2. 小程序基础

一个小程序主体部分由三个文件组成,必须放在项目的根目录,如下:

  • app.js:小程序逻辑,设置全局属性、方法,小程序的生命周期
  • app.json:小程序公共设置,所有的页面必须在这里注册,
  • app.wxss:小程序公共样式表

一个小程序页面由四个文件组成,分别是:

  • js:页面逻辑,页面的生命周期
  • wxml:页面结构
  • wxss:页面样式表,如果和app.wxss配置不同,则会覆盖app.wxss中的属性设置,但是仅仅只影响所在的页面
  • json:页面配置

js用于处理页面逻辑,网络请求,数据处理,wxml和wxss共同渲染页面。

传统的视图和数据绑定,需要手动管理视图和对象的数据一致性。

那么微信小程序是通过什么方法来管理视图和对象绑定的呢?状态模式-单向数据流。状态模式定义一个对象,这个对象可以通过管理其状态从而使得应用程序作出相应的变化。简单的讲,对象状态化,只要对象状态发送变化,就通知页面更新视图元素。

三个步骤:

  1. 识别哪个UI元素被绑定了相应的对象。
  2. 监视对象状态的变化。
  3. 将所有变化传播到绑定的视图上。 注意数据流向是单向的,即视图变化不会影响对象状态。小程序数据视图单向绑定开发模式,让开发者专注于事件处理上,改变对象状态,实现视图更新。

小程序注册完成后,加载页面,触发onLoad方法。页面载入后触发onShow方法,显示页面。首先显示页面,会触发onReady方法,渲染页面元素和样式,一个页面只调用一次。当小程序后台运行或跳转到其他页面时,触发onHide方法。当小程序有后台进入到前台运行或重新进入页面时,触发onShow方法。当使用重定向方法wx.redirectTo(OBJECT)或关闭当前页返回上一页wx.navigateBack(),触发onUnload。

3. 小程序后台开发

对于小程序的后台开发,之前并没有提供工具来降低小程序开发门槛,在开始小程序开发之前,需要注册小程序账号、公有云账号,购买云服务器、域名、申请SSL证书,还需要相关的配置,SSH连接服务器、安装NodeJS、安装Nginx、安装MySQL、安装MySQL、导入SSL证书、测试Nginx、域名备案,才可以进行开发。

除了工作量大之外,费用也非常高,需要物理机托管、云主机、容器以及运维人力等,价格不菲。

4. 小程序云开发

Severless无服务器开发模式能让开发者更多地专注业务逻辑,并且成本低,这也是未来小程序后台开发的趋势。

全部通过SDK封装,把云资源包括无服务器云函数、云数据库、云缓存、对象存储等包装起来,开发者只需要通过SDK调用即可。

随着云服务的发展,从物理机到IAAS,再到PAAS,Serverless开发进一步释放开发者的业务能力,因此Serverless是下一代新技术,需要紧密关注。

小程序云开发是微信团队和腾讯云联合开发的,集成于小程序控制台的原生serverless云服务。核心功能包括:云存储、云数据库和云函数。云函数在云端运行的代码,微信私有天然鉴权,开发者只需编写自身业务逻辑代码;云数据库提供增删改查能力的MongoDB数据库;云存储可上传下载删除文件的存储服务,自带CDN。

特色:即可在小程序端操作,也可以服务端(云函数、服务器)操作;可视化操作;数据库和存储,在小程序端只有用户级别的权限,而子啊服务端则有管理员的权限。

小程序云开发优势:

  • 官方生态,内置在小程序IDE,免认证登录,云相关API不需要任何安装,开箱即用。
  • 快速上手,SDK调用比API调用更简单易懂。
  • 配置简单,一键开通,可视化操作。
  • 高效鉴权,内建微信小程序用户鉴权,开发者无需关注用户鉴权,将精力投放在核心业务逻辑上。
  • 弹性伸缩,业务快速发展轻松实现扩容。
  • 降低成本,提供较完整的云服务架构,简化小程序开发过程中复杂的后端操作,开发者无需关心底层服务器资
  • 部署运维,极大节约服务器架构搭建维护成本。

云函数:

  • 云端运行,原生支持。无需搭建服务器,无需域名设置,开发工具内一键市场部署即可运行后端代码;小程序内提供专门用于云函数调用的API;平台保证安全和隔离性,简化用户管理,免除运维操作。
  • 私有协议。可在云函数内获取到小程序运行的上下文(appid、openid等),无需维护复杂的鉴权机制,即可获取天然可信任的用户登录态。
  • 弹性伸缩。根据请求量实现毫秒级的实时弹性伸缩,函数未执行时不产生任何费用。

在服务器模式下,代码部署及运行在(云)服务器上,需要考虑服务器的架构分层、模块通信等设计,服务器运维负担重。

在无服务模式下,代码部署及运行在无状态的计算容器中,由事件触发,生命周期短。具有良好的扩展性和隔离性。

云函数API只有callFunction一个接口,假设已有一个云函数add,有下图中的代码实现了简单的云函数调用。

云数据库:

  • 文档型数据库,数据库包含多个集合,集合近似于一个JSON数组,数组中的每个对象就是一条记录,记录的格式时JSON文档。
  • 简单易用,数据库API包含增删改查,操作简单:获取数据库引用、构造查询/更新条件、发送请求;
  • 权限控制,API分为小程序和服务端两部分,开发者可在小程序内直接调用API进行非敏感数据的操作。对于有
  • 高安全要求的数据,可在云函数内通过服务端API进行操作。

云函数API是非常庞大的,主要包括触发网络请求、获取引用、数据库对象(Database)、集合对象(Collection)、Command对象更新(db.command)、Command对象查询(db.command)、记录对象(Document),具体的细节可以到小程序云开发的官方文档里了解。

下面看一个简单的例子,插入数据到云数据库,在云开发模式中,使用云函数实现插入数据到运输局库中,仅需要在小程序端使用wx.cloud.Functon API去调用云函数,将需要添加的数据传递给云函数,即可完成添加。

文件存储:

  • 快速上传,小程序云提供文件存储空间、上传文件到云端,云开发者可以在小程序端和云函数端通过API使用云文件存储。
  • 权限管理,基于微信登录态的安全控制,带权限管理的云端下载。
  • CDN加速,存储内的文件,天然CDN加速。

文件存储API有uploadFile上传文件、downloadFile下载文件、deletFile删除文件、getTempFileURL换取临时链接。

云开发还具有增值能力,有音视频类、AI类、短信类能力。

音视频有视频客服、直播、腾讯资质等功能,AI有证件识别、人脸核身、图片鉴黄、图片标签等功能,短信有验证码、通知、语音、群发等功能。

小程序云开发的无服务开发模式,助力快速上线小程序。对比传统开发和云开发模式,传统开发模式下需要考虑弹性伸缩、异地容灾、网络防护等,还需完成自己的业务逻辑,而在云开发模式下,这些需要考虑的东西通通由腾讯云基础服务处理了,开发者只需要考虑自己的业务逻辑,大大降低了工作量。

以小程序文件上传功能为样例,具体对比云开发和传统开发,在传统开发模式中需要在小程序端使用选择图片API和上传文件API,在后端需要搭建框架、路由和上传到腾讯云对象存储的逻辑,在运维上还需考虑性能和安全方面的问题,需要前端、后台和运维进行配合,在该功能上总耗时至少1142分钟。在云开发模式下,只需要在小程序端使用图片API结合云开发封装的wx.cloud.uploadFile的API,指定存储路径以及文件路径即可完成图片上传的,整个过程耗时只需4分钟,并且只需要前端即可完成。

插入数据到数据库功能,在传统开发模式中,需要在小程序端使用wx.request API,后端也要搭建框架、路由,实现插入数据到腾讯云MongoDB实例的逻辑,在运维上还需考虑性能和安全方面的问题。传统开发模式下,需要前端、后端和运维岗位进行配合,在该功能上总耗时至少1021分钟。在云开发模式中,使用云函数实现插入数据到运输局库中,仅需要在小程序端使用wx.cloud.Functon API去调用云函数,将需要添加的数据传递给云函数,即可完成添加,整个过程只需3分钟,也只需要一名前端即可完成该功能点。

5. 小程序云开发经典架构

小程序云开发架构,是很好理解的,小程序端通过内置SDK调用云开发资源,服务端(包括云函数、服务器)可以入SDK调用云开发资源。都需要通过云开发(Tencent Cloud Base),再由该服务层去对具体的资源进行操作,小程序端还需要先通过微信后台端获取用户ID,而服务端不需要。

下面是使用的一个场景,腾讯相册小程序分享二维码优化,遇到的挑战有小程序码不能存太多信息;二维码包含了name,ownerid,page等大量信息,在某些机型上无法有效识别。

云开发解决方案为,小程序码只需记下一个ID,具体信息存储在小程序云的数据库中,大大提升识别效率。

借助了云函数和云存储,整合二维码信息,在云函数中处理,调用微信生成小程序码的接口,将图片存储至云文件存储,获取临时图片URL。这样就简单快速生成小程序码。

第二个例子是腾讯相册小程序快速上线点赞评论功能,挑战有,新增小程序评论、点赞等操作需要用户的鉴权信息,原有的后端服务架构太复杂,增加新功能非常困难。云开发解决方案是通过云函数的路由功能,在原有的相册服务端获取用户的鉴权信息,匹配原有后台服务,判断该用户在小程序端是否有权限进行敏感操作。

借助了小程序云开发的云函数,快速上线社交功能,在云函数中,作为路由,将appid,openid转发到原有的服务。是典型的原有开发服务与云开发服务混合开发案例,具体流程如下图。

第三个例子是乘车码,是一个出行的小程序,在早期的开发中为了快速上线,把一些城市配置通通放在小程序前端,但业务不断拓展,拓展到很多城市后,配置信息越来越大,导致小程序体积包越来越臃肿,滞碍了业务的发展,于是用云开发进行处理,将一些不一定要在离线环境使用的配置迁移到云开发,采用云开发的存储服务来存放静态资源,这就大大压缩了乘车码小程序的体积,为其他新增功能腾挪了空间。

第四个案例是创梦天地和享物说这两个团队的小游戏流量大,想要快速上线小游戏社交功能,选择用云开发的数据库和云函数实现社交化的玩法,将排行榜数据存储到数据库中,通过云函数实现排行榜定时更新。还有将好友助力的数据放到数据库,调用云函数更新助力获奖,这是一个典型的用云开发实现社交玩法的案例。


全部评论
讲师/助教

评论

直播日历