关于javascript:微信小程序云开发

32次阅读

共计 3113 个字符,预计需要花费 8 分钟才能阅读完成。

一、注册微信小程序

微信小程序有一个云开发的性能,能够省去很多的后盾开发的工作。不过,应用小程序云开发须要注册的小程序 appid,测试和游客没有云开发性能的。如果你还没有注册小程序能够装置官网的文档阐明先注册一个小程序 appid。


注册实现后,就能够填写小程序的相干信息,而后零碎会给咱们生成小程序的 appid 等必要的信息,如下图所示。

而后,咱们关上微信小程序开发工具,新建一个微信小程序我的项目,如果还没有,能够点击下载微信开发工具。而后,创立微信小程序的时候填写 appid,如下图所示。


而后,咱们在微信开发工具的开发面板会发现有一个云开发的按钮。云开发能够让开发者无需搭建服务器,即可应用云数据库、云存储、云函数和云托管等全副云能力。
而后,咱们点击它进行后盾数据环境的搭建,如下图。

二、搭建云开发模版

咱们能够依照如下步骤来疾速开始应用云开发。

  1. 新建云开发模板
  2. 开明云开发
  3. 体验小程序
  4. 查看控制台

1,新建云开发模板

首先,新建一个我的项目,填入 AppID(应用云开发能力必须填写 AppID),勾选创立“云开发 QuickStart 我的项目”,点击创立即可失去一个展现云开发根底能力的示例小程序。该小程序与一般 QuickStart 小程序有以下不同需注意。

  • 无游客模式、也不能够应用 测试号
  • project.config.json 中减少了字段 cloudbaseRoot 用于指定寄存云函数 & 云托管的目录
  • cloudbaseRoot 指定的目录有非凡的图标
  • 云开发能力从根底库 2.2.3 开始反对(覆盖率 97.3%,查看兼容性问题)

2,开明云开发、创立环境

创立了第一个云开发小程序后,在应用云开发能力之前须要先开明云开发。在开发者工具工具栏左侧,点击“云开发”按钮即可关上云控制台、依据提醒开明云开发、创立云环境。默认配额下能够创立两个环境,各个环境互相隔离,每个环境都蕴含独立的数据库实例、存储空间、云函数配置等资源。每个环境都有惟一的环境 ID 标识,初始创立的环境主动成为默认环境。

3,体验小程序

开明创立环境后,即能够开始在模拟器上操作小程序体验云开发提供的局部根底能力演示。

4,查看控制台

云开发控制台是治理云开发资源的中央,控制台提供以下能力。

  • 经营剖析 :查看云开发监控、配额使用量、用户拜访状况
  • 数据库 :治理数据库,可查看、减少、更新、查找、删除数据、治理索引、治理数据库拜访权限等
  • 存储管理 :查看和治理存储空间
  • 云函数 :查看云函数列表、配置、日志

5,销毁环境

当然,开发者可登陆 微信开发者工具 中的 云开发控制台,在设置中点击切换环境,在下拉框中点击治理我的环境对环境进行治理删除。

三、云开发能力

微信小程序云开发提供了数据库、云存储、云函数、云调用、HTTP API 等性能。

3.1 数据库

云开发提供了一个 JSON 数据库,顾名思义,数据库中的每条记录都是一个 JSON 格局的对象。一个数据库能够有多个汇合,汇合可看做一个 JSON 数组,数组中的每个对象就是一条记录,记录的格局是 JSON 对象。

关系型数据库和 JSON 数据库的对应关系如下表。

关系型数据库 文档型
数据库 database 数据库 database
表 table 汇合 collection
列 column 字段 field

以下是一个示例的汇合数据,假如咱们有一个 books 汇合寄存了图书记录,如下所示。

[
  {
    "_id": "Wzh76lk5_O_dt0vO",
    "title": "The Catcher in the Rye",
    "author": "J. D. Salinger",
    "characters": [
      "Holden Caulfield",
      "Stradlater",
      "Mr. Antolini"
    ],
    "publishInfo": {
      "year": 1951,
      "country": "United States"
    }
  },
  {
    "_id": "Wzia0lk5_O_dt0vR",
    "_openid": "ohl4L0Rnhq7vmmbT_DaNQa4ePaz0",
    "title": "The Lady of the Camellias",
    "author": "Alexandre Dumas fils",
    "characters": [
      "Marguerite Gautier",
      "Armand Duval",
      "Prudence",
      "Count de Varville"
    ],
    "publishInfo": {
      "year": 1848,
      "country": "France"
    }
  }
]

3.2 存储

云开发提供了一块存储空间,提供了上传文件到云端、带权限治理的云端下载能力,开发者能够在小程序端和云函数端通过 API 应用云存储性能。

在小程序端能够别离调用 wx.cloud.uploadFile 和 wx.cloud.downloadFile 实现上传和下载云文件操作。上面简略的几行代码,即可实现在小程序内让用户抉择一张图片,而后上传到云端治理的性能。

// 让用户抉择一张图片
wx.chooseImage({
  success: chooseResult => {
    // 将图片上传至云存储空间
    wx.cloud.uploadFile({
      // 指定上传到的云门路
      cloudPath: 'my-photo.png',
      // 指定要上传的文件的小程序临时文件门路
      filePath: chooseResult.tempFilePaths[0],
      // 胜利回调
      success: res => {console.log('上传胜利', res)
      },
    })
  },
})

3.3 云函数

云函数是一段运行在云端的代码,无需治理服务器,在开发工具内编写、一键上传部署即可运行后端代码。

小程序内提供了专门用于云函数调用的 API。开发者能够在云函数内应用 wx-server-sdk 提供的 getWXContext 办法获取到每次调用的上下文,无需保护简单的鉴权机制,即可获取人造可信赖的用户登录态(openid)。

比方咱们如下定义一个云函数,命名为 add,性能是将传入的两个参数 a 和 b 相加的性能。

const cloud = require('wx-server-sdk')
exports.main = async (event, context) => {let { userInfo, a, b} = event
  let {OPENID, APPID} = cloud.getWXContext() // 这里获取到的 openId 和 appId 是可信的
  let sum = a + b

  return {
    OPENID,
    APPID,
    sum
  }
}

而后,咱们在微信小程序端应用 wx.cloud 即可应用云函数,如下所示。

wx.cloud.callFunction({
  // 需调用的云函数名
  name: 'add',
  // 传给云函数的参数
  data: {
    a: 12,
    b: 19,
  },
  // 胜利回调
  complete: console.log
})
// 当然 promise 形式也是反对的
wx.cloud.callFunction({
  name: 'add',
  data: {
    a: 12,
    b: 19
  }
}).then(console.log)

如需在云函数中操作数据库、治理云文件、调用其余云函数等操作,可应用官网提供的 npm 包 wx-server-sdk 进行操作。

3.4 HTTP API

云开发资源也能够通过 HTTP 接口拜访,即在小程序外拜访,接口见 HTTP API 文档。

四、我的项目实例

上面以【抽奖助手小程序】为例,如何应用微信小程序云开发性能提供接口数据。

首先,关上【云开发】面板,创立一个汇合,并将汇合权限设置为【所有人可读,仅创建者可读写】。而后,将我的项目中 data 外面的 lottery.json 文件导入到 lottery 汇合,如下图所示。

而后,部署云函数即可。

而后从新运行我的项目,最终的成果如下图所示。

附件:抽奖小助手源码

正文完
 0