简要介绍

微信小程序云开发,是基于 Serverless 的一站式后端云服务,涵盖函数、数据库、存储、CDN等服务,免后端运维。基于云开发可以免鉴权调用微信所有开放能力。

前提准备

创建环境

打开小程序项目,点击工具栏“云开发”进行开通:

根据对话框提示,创建云环境:

选择默认免费配额:

“提交订单”,创建完成。

此后,就可以打开“云开发控制台”了:

创建云函数

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

首先,配置小程序项目。编辑 project.config.json 添加 cloudfunctionRoot:

{
// ...
"cloudfunctionRoot": "./cloudfunction/",
"cloudfunctionTemplateRoot": "cloudfunctionTemplate"
}

并于根目录新建该目录 cloudfunction ,该目录图标会变成“云目录图标”。

然后,右键云函数根目录,“新建 Node.js 云函数”:

输入云函数名称,就会创建好模板:

使用云函数

编辑 index.js 修改成求和:

// 云函数入口文件
const cloud = require("wx-server-sdk"); cloud.init(); // 云函数入口函数
exports.main = async (event, context) => {
const wxContext = cloud.getWXContext(); return {
sum: event.a + event.b,
};
};
  • event 是触发云函数的事件。小程序端调用时,就是其请求参数。
  • return 返回云函数计算的结果。小程序端调用时,就是其响应内容。

Taro 调用云函数

Taro 是一个开放式跨端跨框架解决方案,支持使用 React/Vue/Nerv 等框架来开发 微信/京东/百度/支付宝/字节跳动/QQ 小程序/H5 等应用。

快速创建小程序应用,可见 Taro3 快速开始

Taro 使用云开发,首先需要初始化云环境:

import Taro from "@tarojs/taro";

Taro.cloud.init({
env: "gocoding-xxx",
});

其中 env 环境 ID ,可见“云开发控制台”的“设置”:

然后,调用该云函数:

Taro.cloud
.callFunction({
name: "photo-lucky",
data: {
a: 1,
b: 2,
},
})
.then((res) => {
console.log(res);
})
.catch((err) => {
console.log(err);
});
  • name 是云函数的名称。
  • data 是请求参数,对应云函数的 event

部署云函数

右键云函数目录,选择“上传并部署”:

编译运行小程序,可见打印结果:

调试云函数

打开“云开发控制台”的“云函数”:

打开“本地调试”,右侧选中“开启本地调试”:

之后,小程序调用云函数就会进“本地调试”。

云开发服务

云函数模板中默认 requirewx-server-sdk,这是一个帮助我们在云函数中操作数据库、存储以及调用其他云函数的微信提供的库。关于 wx-server-sdk 的使用可见 在云函数中使用 wx-server-sdk

其他

云函数是 Node.js 应用,原想直接使用 TypeScript 开发并运行,可参考:

但其调试时默认主入口是 index.js,试了下配置,但没什么用。报错如下:

所以,想用 TypeScript 的话,需要 tsc 编译发布出 js 后再调试。

参考

结语

欢迎关注 GoCoding 公众号,分享日常 Coding 中实用的小技巧、小知识!

微信小程序云开发如何上手的更多相关文章

  1. 技本功丨收藏!斜杠青年与你共探微信小程序云开发(下篇)

    2019年2月26日,人们为了一个杯子疯了一天. 星巴克猫爪杯,一场已经与猫无关了的“圣杯战争“.网上的倒卖价格,已炒至近千元! 求而不得,舍而不能,得而不惜.这是人最大的悲哀... 所以,请珍惜以下 ...

  2. 微信小程序云开发不完全指北

    微信小程序云开发不完全指北 首先必须说明云开发的"云"并不是类似云玩家里的云的意思,而是微信小程序真的提供了云开发的接口以及一个简单的提供存储.数据库服务的虚拟后台(对于一些轻量小 ...

  3. 微信小程序-云开发(手记)

    微信小程序-云开发(手记) 1.创建data.json文件 注意以下几点要求: 入门示例: init方法的env:默认环境配置,传入字符串形式的环境 ID(理解为数据库)可以指定所有服务的默认环境(意 ...

  4. 第六章 “我要点爆”微信小程序云开发实例之爆文详情页制作

    爆文详情页制作 从首页中数据列表打开相应详情页面的方法: 给数据列表中每个数据项加一个点击事件,同时将当前数据项的id暂时记录在本地,然后跳转到详情页面detail goopen: function ...

  5. 第一章 “我要点爆”微信小程序云开发之项目建立与我的页面功能实现

    第一章 “我要点爆”微信小程序云开发之项目建立与我的页面功能实现 开发环境搭建 使用自己的AppID新建小程序项目,后端服务选择小程序·云开发,点击新建,完成项目新建. 新建成功后跳转到开发者工具界面 ...

  6. “我要点爆”微信小程序云开发实例

    使用云开发进行微信小程序“我要点爆”的制作 下一章:“我要点爆”微信小程序云开发之项目建立与我的页面功能实现 接下来我将对“我要点爆”微信小程序进行完整的开源介绍 小程序名称: 我要点爆 查看方式:从 ...

  7. 微信小程序云开发-从0打造云音乐全栈小程序

    第1章 首门小程序“云开发”课程,你值得学习本章主要介绍什么是小程序云开发以及学习云开发的重要性,并介绍项目的整体架构,真机演示项目功能,详细介绍整体课程安排.课程适用人群以及需要掌握的前置知识.通过 ...

  8. 微信小程序-云开发实战教程

    微信小程序-云开发实战教程 云函数,云存储,云数据库,云调用 https://developers.weixin.qq.com/miniprogram/dev/wxcloud/basis/gettin ...

  9. 微信小程序-云开发-实战项目

    微信小程序-云开发-实战项目 微信小程序 微信小程序平台服务条款 https://developers.weixin.qq.com/miniprogram/product/service.html h ...

随机推荐

  1. 背包问题(动态规划 C/C++)

    Description 卖方:这件商品14元 买方:给你20元 卖方:不好意思,我的零钱不够 买方:好吧,这是15元,剩的当小费 当到一个地方旅游时,如果你买东西的地方不支持信用,带零钱还是非常有用的 ...

  2. linux正则表达式符号集

    \     转义符,忽略其特殊意义: ^  以--开始,^A  以A开始: $ 以--结束,A$ 以A结尾: ^$ 空行: * 0个或多个*前面的任意字符 . 匹配换行符\n之外的任意字符: .* 匹 ...

  3. 上周我面了个三年 Javaer,这几个问题都没答出来

    身为 Java Web 开发我发现很多人一些 Web 基础问题都答不上来. 上周我面试了一个三年经验的小伙子,一开始我问他 HTTP/1.HTTP/2相关的他到是能答点东西出来. 后来我问他:你知道 ...

  4. Hadoop大数据平台节点的动态增删

    环境:CentOS 7.4 (1708  DVD) 工具:MobaXterm 一. 节点的动态增加 1. 为新增加的节点(主机)配置免密码登录.使用ssh-keygen和ssh-copy-id命令(详 ...

  5. TCP的ACK机制

    下面是整个的tcp的三次握手和四次挥手的协议 TCP四次挥手 在客户端先发送一个FIN的包,表示要close(),客户端想和连接断开,发完之后出于FIN_WAIT_1状态下:服务端收到之后就变成CLO ...

  6. Zabbix监控笔记

    了解zabbix,有必要了聊一下监控系统相关内容 企业中常用的开源监视系统目前有 cacti.Nagios.Open-Falcon.zabbix.prometheus等 使用监控系统的目的在于 /1. ...

  7. Guitar Pro吉他指弹入门——双手泛音

    曾经有一段时间在琴行里经常遇到有人来试琴,很多人试弹得曲子就是郑成河的<Flaming>,直译过来就是热情的意思.这首曲子里面有很多泛音存在,吉他泛音类似于钟鸣或者摇铃的声音,是一种令人耳 ...

  8. 【VUE】8.VUEX核心概念

    1. Vuex核心概念主要如下 state : 存储共享数据 mutation: 变更store中的数据,方法,不能异步操作 action: 异步操作,通过触发mutation变更数据 getter: ...

  9. 我给 Apache 顶级项目提了个 Bug

    这篇文章记录了给 Apache 顶级项目 - 分库分表中间件 ShardingSphere 提交 Bug 的历程. 说实话,这是一次比较曲折的 Bug 跟踪之旅.10月28日,我们在 GitHub 上 ...

  10. appium快速入门

    appium快速入门 演示官方demo 第一步:启动安卓模拟器 步骤2:启动Appium桌面 step3:准备自动化脚本与待测APK step4:运行测试代码 分析演示 分析Appium的加载流程 使 ...