微信小程序 - 云开发

痛定思痛。 2022-09-06 00:18 655阅读 0赞

文章目录

  • 一、云开发介绍
    • 1、简介
    • 2、云开发和传统服务器对比
  • 二、数据库的增删改查
    • 1、配置云开发
    • 2、创建数据列表
    • 3、初始化云开发
    • 4、查询 get()
    • 5、条件查询 where()
    • 6、查询单条数据doc()
    • 7、添加数据 add()
    • 8、更新数据update()
    • 9、删除数据remove()
  • 三、云函数
    • 1、配置环境变量
    • 2、初始化云开发环境id
    • 3、创建云函数
    • 4、编写云函数
    • 5、部署云函数
    • 6、调用云函数
  • 四、内容管理
    • 1、内容管理介绍
    • 2、开通内容管理
    • 3、创建项目

官方文档:微信小程序官方文档
参考文档:微信小程序云开发

一、云开发介绍

1、简介

小程序·云开发是微信团队联合腾讯云推出的专业的小程序开发服务。

开发者可以使用云开发快速开发小程序、小游戏、公众号网页等,并且原生打通微信开放能力。

开发者无需搭建服务器,可免鉴权直接使用平台提供的API进行业务开发
小程序

云开发又简称tcb,是微信官方给我们提供的基于腾讯云的云服务器。目前云开发包含:云数据库,云函数,云存储,云调用。后面章节会具体给大家讲解这几个。

2、云开发和传统服务器对比

在这里插入图片描述
通过上面的对比,我们可以看出,如果你想快速创建一个小程序的后台,用云开发是不错的选择。

二、数据库的增删改查

1、配置云开发

在这里插入图片描述

在设置里改为 按量计费

在这里插入图片描述

2、创建数据列表

在这里插入图片描述

数据权限更改

在这里插入图片描述

3、初始化云开发

初始化云开发环境前,先去云开发控制台,拿到云开发环境id,如下图

在这里插入图片描述
拿到环境id以后,就去app.js里做云开发环境初始化,如下
在这里插入图片描述

wx.cloud.init({ 
      env: 'xxx'
    })

4、查询 get()

在这里插入图片描述

5、条件查询 where()

在这里插入图片描述

6、查询单条数据doc()

doc是用来查询单条数据的。比如商品详情页。
doc里面用到的参数就是我们数据里的_id字段

在这里插入图片描述

7、添加数据 add()

通过add可以实现数据的添加:
在这里插入图片描述

8、更新数据update()

修改数据库里已存在的数据,结合doc进行修改单条数据

在这里插入图片描述

9、删除数据remove()

删除数据,结合doc删除单条数据

在这里插入图片描述

三、云函数

1、配置环境变量

在app.js里配置环境变量
在这里插入图片描述
这个env环境id需要你去云开发控制台获取
在这里插入图片描述

2、初始化云开发环境id

新建一个和pages平级的目录cloud,用于存放云函数
在这里插入图片描述
然后在project.config.json里添加cloudfunctionRoot选项。

在这里插入图片描述

"cloudfunctionRoot": "/cloud",

保存之后,目录会有块“云”
在这里插入图片描述
然后对cloud选择当前环境:
在这里插入图片描述

3、创建云函数

右键cloud目录,新建Node.js云函数

在这里插入图片描述
然后新建一个云函数,名字你可以自定随便定。我这里用updateTw。

4、编写云函数

在这里插入图片描述

需要更改的地方:_id 和 view

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

cloud.init({ 
  env: cloud.DYNAMIC_CURRENT_ENV 
})

// 云函数入口函数
exports.main = async (event, context) => { 
  return cloud.database().collection('SoftwareList')
    .where({ 
      _id: event.id
    })
    .update({ 
      data: { 
        view: event.view
      }
    })
}

5、部署云函数

先部署后调用!!!
在这里插入图片描述

6、调用云函数

//浏览量+1
  const newView = this.data.twData.view + 1
  wx.cloud.callFunction({ 
    name: 'updateTw',
    data: { 
      id: options.id,
      view: newView
    }
  }).then(res=>{ 
    console.log(res)
  })

注意:这里的 name 要与 云函数的name 一致

调用并修改数据成功:
在这里插入图片描述

四、内容管理

1、内容管理介绍

官网:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/extensions/cms/introduction.html

内容管理是基于云开发搭建的可视化的内容管理平台,提供了丰富的内容管理功能,开通简单,独立于云控制台,无须编写代码即可使用,支持文本、富文本、Markdown、图片、文件、关联类型等多种类型的可视化编辑,易于二次开发,并与云开发的生态体系紧密结合,助力开发者提升开发效率。
在这里插入图片描述

2、开通内容管理

1.更新到最新的 Nightly 版本工具,在工具顶部 Tab 栏中,点击「更多」-「内容管理」
在这里插入图片描述

2.开通,勾选同意协议后,点击确定
在这里插入图片描述
3.账号密码。内容管理服务可独立于云开发控制台进行内容及权限的管理,请填写管理员账号及密码用于登录内容管理服务平台,填写账密后请妥善保管,点击「确定」完成开通。

在这里插入图片描述
在这里插入图片描述
4.开通完成后,内容管理当前页面可看到内容管理的入口链接和相关信息。点击访问地址,即可在弹出的浏览器窗口中进行内容管理的相关配置。
在这里插入图片描述

3、创建项目

在开始管理内容数据前,需创建一个项目。内容管理使用项目划分不同类的内容,便于区分内容数据用途,进行权限管理。

首先,我们需要点击新建项目下方的创建新项目按钮,创建一个名为小商店,Id 为 shop 的项目

在这里插入图片描述

发表评论

表情:
评论列表 (有 0 条评论,655人围观)

还没有评论,来说两句吧...

相关阅读