目录
云开发的优势
- 避免复杂的服务器开发流程
- 可以依托强大的微信团队的API库
- 方便进行用户的数据管理
- 有利于快捷开发，对于小流量程序来说价格低廉，甚至免费
云开发的工具和准备
注册微信小程序
开发者工具：小程序开发者工具下载地址
技术文档：云开发官方文档
注意
小程序的ID（AppID）是程序开发者唯一表示，只有对应的APPID才能驱动程序运行和测试
1.开通云开发服务
点击微信开发者工具的“云开发”图标，在弹出框里点击“开通”，同意协议后，会弹出创建环境的对话框。这时会要求你输入环境名称和环境 ID，以及当前云开发的基础环境配额（基础配额免费，而且足够你使用哦）。
2.找到云开发的环境 ID
点击云开发控制台窗口里的设置图标，在环境变量的标签页找到环境名称和环境 ID。
当云开发服务开通后，我们可以在小程序源代码 cloudfunctions 文件夹名看到你的环境名称。如果在 cloudfunctions 文件夹名显示的不是环境名称，而是“未指定环境”，可以鼠标右键该文件夹，选择“更多设置”，然后再点击“设置”小图标，选择环境并确定。
3.指定小程序的云开发环境
在开发者工具中打开源代码文件夹 miniprogram 里的 app.js，找到如下代码：
wx.cloud.init({
// 此处请填入环境 ID, 环境 ID 可打开云控制台查看
env: 'my-env-id',
traceUser: true,
})
在 env: 'my-env-id'处改成你的环境 ID，如 env: 'xly-snoop'
4. 下载 Nodejs
NodeJS 是在服务端运行 JavaScript 的运行环境，云开发所使用的服务端环境就是 NodeJS。npm 是 Node 包管理器，通过 npm，我们可以非常方便的安装云开发所需要的依赖包。
npm是前端开发必不可少的包（模块）管理器，它的主要功能就是来管理包package，包括安装、卸载、更新、查看、搜索、发布等，其他编程语言也有类似的包管理器，比如Python的pip，PHP的composer、Java的maven。我们可以把包管理器看成是windows的软件管理中心或手机的应用中心，只是它们用的是可视化界面，包管理器用的是命令行Command Line。
下载地址：Nodejs 下载地址
大家可以根据电脑的操作系统下载相应的 NodeJS 安装包并安装（安装时不要修改安装目录，啥也别管直接 next 安装即可）。打开电脑终端（Windows 电脑为 cmd 命令提示符，Mac 电脑为终端 Terminal），然后逐行输入并按 Enter 执行下面的代码：
node --version
npm --version
如果显示为 v10.15.0 以及 6.11.3（可能你的版本号会有所不同），表示你的 Nodejs 环境已经安装成功。
学编程要仔细，一个字母，一个单词，一个标点符号都不要出错。注意输上面的命令时node、npm的后面有一个空格，而且是两个短横杠–。
5.部署并上传云函数
cloudfuntions 文件夹图标里有朵小云，表示这就是云函数根目录。展开 cloudfunctions，我们可以看到里面有 login、openapi、callback、echo 文件夹，这些就是云函数目录。而 miniprogram 文件夹则放置的是小程序的页面文件。
cloudfunctions里放的是云函数，miniprogram放的是小程序的页面，这并不是一成不变的，也就是说你也可以修改这些文件夹的名称，这取决于项目配置文件project.config.json里的如下配置项：
"miniprogramRoot": "miniprogram/",
"cloudfunctionRoot": "cloudfunctions/",
但是你最好是让放小程序页面的文件夹以及放云函数的文件夹处于平级关系且都在项目的根目录下，便于管理。
使用鼠标右键其中的一个云函数目录比如 login，在右键菜单中选择在终端中打开，打开后在终端中输入以下代码并按 Enter 回车执行：
npm install
如果显示“npm不是内部或外部命令”，你需要关闭微信开发者工具启动的终端，而是重新打开一个终端窗口，并在里面输入 cd /D 你的云函数目录进入云函数目录，比如 cd /D C:\download\tcb-project\cloudfunctions\login进入login的云函数目录，然后再来执行npm install命令。
这时候会下载云函数的依赖模块，下载完成后，再右键 login 云函数目录，点击“创建并部署：所有文件”，这时会把本地的云函数上传到云端，上传成功后在 login 云函数目录图标会变成一朵小云。
在开发者工具的工具栏上点击“云开发”图标会打开云开发控制台，在云开发控制台点击云函数图标，就能在云函数列表里看到我们上传好的“login”云函数啦。
上传所有云函数
接下来我们按照这样的流程把其他所有云函数（如 openapi）都部署都上传，也就是要执行和上面相同的步骤，总结如下：
右键云函数目录，选择在终端中打开，输入 npm install命令下载依赖文件；
然后再右键云函数目录，点击“创建并部署：所有文件”
在云开发控制台–云函数–云函数列表查看云函数是否部署成功。
login、openapi、echo、callback这些云函数在后面都会用到的哦，一定要确定自己部署上传成功，不然后面会报错的哦。
获取 openid 与云函数 login
当我们把云函数 login 部署上传成功后，就可以在模拟器以及手机（需要重新点击预览图标并扫描二维码）里点击获取 openid 了。
6. 获取 openid并调用云函数
openid 是小程序用户的唯一标识，也就是每一个小程序用户都有一个唯一的 openid。点击“点击获取 openid”，在用户管理指引页面如果显示“用户 id 获取成功”以及一串字母+数字，那么表示你 login 云函数部署并上传成功啦。如果获取 openid 失败，你则需要解决 login 云函数的部署上传，才能进行下面的步骤哦。
调用云函数的解读
小程序的首页是”pages/index/index”，我们可以从 app.json 的配置项或者模拟器左下角的页面路径可以看出来。在 index.wxml 里有这段代码：
点击获取 openidbutton>
也就是当点击“点击获取 openid”按钮时，会触发 bindtap 绑定的事件处理函数 onGetOpenid，在 index.js 里可以看到 onGetOpenid 事件处理函数（在 index.js 里找到事件处理函数 onGetOpenid 对比理解）调用了 wx.cloud.callFunction()接口（打开技术文档对比理解）
技术文档：调用云函数 wx.cloud.callFunction
调用云函数的方法很简单，只需要填写云函数的名称 name（这里为 login），以及需要传递的参数（这里并没有上传参数），就可以进行调用。在 success 回调函数里添加以下代码打印 res 对象：
console.log('调用login云函数返回的res',res)
添加完成之后记得保存代码哦，文件修改没有保存会在标签页有一个小的绿点。可以使用快捷键（同时按）Ctrl和S来保存（Mac电脑为Command和S）。
编译之后，再点击“点击获取 openid”按钮，就能看到完整的 res 对象，res 对象有三个参数：
-
requestID：云函数执行 ID，可用于在云开发控制台查找日志，打开云开发控制台–云函数–日志，可以在这里根据云函数函数名以及 requestID 来筛选查看云函数的调用日志（含返回结果）；
-
result：云函数返回的结果，login 云函数返回的结果里包含 appid、event 对象，我们可以通过 res.result.appid 以及 res.result.event 访问它们；
-
errMsg：显示云函数是否调用成功
事件处理函数 onGetOpenid 调用云函数成功之后，干了三件事情：
使用 console.log 打印 openid，可以在点击按钮触发云函数在控制台看到该打印结果；
把获取到的 appid 赋值给 app.js 文件里的 globalData 全局对象；
跳转到 userConsole 页面；
而 userConsole 页面就只是从 globalData 里将 openid 取出来通过 setData 渲染到页面。
云开发初体验
新建云函数
鼠标右键 cloudfunctions 云函数根目录，在弹出的窗口选择新建 Node.js 云函数，比如输入 sum，按 Enter 确认后，微信开发者工具会在本地（你的电脑）创建出 sum 云函数目录，同时也会在线上环境中创建出对应的云函数（也就是自动部署好了，可以到云开发控制台云函数列表里看到）
打开 sum 云函数目录下的 index.js，添加 sum:event.a+event.b,到 return 函数里（把多余的内容可以删掉了），然后记得选择云函数增量上传:（更新文件），更新 sum 云函数。
return {
sum:event.a+event.b,
}
这个 a 和 b 是变量，但是和前面不一样的是，在服务端我们并没有声明 a 和 b 啊，这是因为我们可以在小程序端声明变量。
点击开发者工具模拟器的“快速新建云函数”，会跳转到 addFunction 页面，打开 addFunction.wxml，我们看到测试云函数绑定的是 testFunction 事件处理函数。
<view class="list-item" bindtap="testFunction">
<text> 测试云函数</text>
</view>
我们去看 addFunction.js 里的 testFunction，看变量 a 和 b 这两个小程序端的变量是怎么和服务端的变量关联起来的，而又是如何把结果渲染到页面的。testFunction 调用云函数 sum 同样是通过 wx.cloud.callFunction，不同的是在 data 里有 a 和 b：
data: {
a: 1,
b: 2
},
data 里填写的是传递给云函数的参数，也就是先把小程序端的参数传递给云函数，然后云函数处理之后再返回 res 对象，我们可以在 success 回调函数里打印 res 对象：
console.log("sum云函数返回的对象",res)
编译之后，我们再点击测试云函数，在控制台就能看到打印的结果，res.result.sum 就是 3。直接把 res.result.sum 通过 setData 赋值到 result 就能渲染出数字，那这个 res.result 是什么？JSON.stringify()又是什么？
result: JSON.stringify(res.result)
我们可以打印一下 res.result，以及 JSON.stringify(res.result)
console.log(“res.result是啥”, res.result)
console.log(“JSON.stringify(res.result)是啥”, JSON.stringify(res.result))
res.result 是对象，而 JSON.stringify(res.result)是 json 格式， JSON.stringify() 方法是将一个 JavaScript 值(对象或者数组)转换为一个 JSON 字符串，因为对象如果直接渲染到页面是会显示 [object Object]的。
传统项目改造为云开发项目
当然我们也可以把前面章节没有使用云开发的项目改造成使用云服务，首先在小程序的根目录下新建一个文件夹，比如 cloudfunctions，然后在 project.config.json 添加云函数文件夹的路径配置即可，
"cloudfunctionRoot": "cloudfunctions/",
然后新建一个 miniprogram 文件夹，把小程序除了 project.config.json 以外的其他文件，比如 pages、utils、images、app.js、app.json 等文件都放到 miniprogram 文件夹里，再在 project.config.json 添加 miniprogramRoot 配置:
"cloudfunctionRoot": "cloudfunctions/",
"miniprogramRoot":"miniprogram/",
值得一提的是，云函数部署上传成功，我们就可以一直调用，只要你的小程序的appid以及环境ID没有变，你创建再多的小程序项目，都可以直接调用部署好的云函数，比如前面的login、echo、callback、sum等云函数。也就是说云函数一旦部署成功，它就一直在云端服务器里，哪怕你把小程序本地的云函数都删掉也没有关系。
当新建了并配置了云函数根目录为 cloudfunctions 文件夹之后，云函数根目录里并没有云函数，我们可以右键点击云函数根目录 cloudfunctions 文件夹选择同步云函数列表，可以把所有云端的云函数列表都列举出来（这只是列举了列表），而要修改云函数里面的内容，我们可以右键点击其中的一个云函数目录选择下载云函数即可。
除此之外，我们需要小程序的 app.js 的生命周期函数 onLaunch 里使用
wx.cloud.init()来初始化云开发能力：
onLaunch: function () {
if (!wx.cloud) {
console.error('请使用 2.2.3 或以上的基础库以使用云能力')
} else {
wx.cloud.init({
env: '你的环境ID',
traceUser: true,
})
}
},
云开发能力全局只需要初始化一次即可，这里的 traceUser 属性设置为 true，会将用户访问记录到用户管理中，在云开发控制台的运营分析—用户访问里可以看到访问记录。