微信云开发(CloudBase)为小程序提供了免运维、高可用的后端服务(数据库、存储、云函数等),无需自行搭建服务器即可快速实现后端功能。以下是使用云开发的详细步骤和代码示例:
一、开通云开发环境
- 创建云开发环境
在微信开发者工具中,点击左上角「云开发」按钮,按提示创建环境(如my-env
)。 - 配置环境 ID
在app.js
中初始化云开发:
App({
onLaunch() {
wx.cloud.init({
env: 'your-env-id', // 替换为你的环境ID
traceUser: true // 记录用户访问日志
});
}
});
二、数据库操作
云开发提供 NoSQL 数据库,支持 JSON 格式存储。
1. 添加数据
const db = wx.cloud.database();
db.collection('users').add({
data: {
name: 'Alice',
age: 25,
createdAt: new Date()
},
success: res => {
console.log('添加成功', res._id);
},
fail: err => {
console.error('添加失败', err);
}
});
2. 查询数据
db.collection('users')
.where({ age: db.command.gt(20) }) // 查询年龄>20的记录
.get()
.then(res => {
console.log('查询结果', res.data);
})
.catch(err => {
console.error('查询失败', err);
});
3. 更新数据
db.collection('users').doc('记录ID').update({
data: { age: 26 },
success: res => {
console.log('更新成功');
}
});
三、云函数(Serverless)
云函数用于处理复杂逻辑(如支付、加密等),部署在云端运行。
1. 创建云函数
在项目根目录创建 cloudfunctions
文件夹,新建云函数(如 add
):
// cloudfunctions/add/index.js
exports.main = async (event, context) => {
const { a, b } = event;
return { sum: a + b };
};
2. 调用云函数
wx.cloud.callFunction({
name: 'add',
data: { a: 1, b: 2 },
success: res => {
console.log('计算结果', res.result.sum); // 输出3
}
});
四、文件存储
云存储支持文件上传、下载和管理。
1. 上传文件
wx.chooseImage({
success: res => {
const filePath = res.tempFilePaths[0];
wx.cloud.uploadFile({
cloudPath: 'images/example.jpg',
filePath: filePath,
success: res => {
console.log('文件ID', res.fileID);
}
});
}
});
2. 下载文件
wx.cloud.downloadFile({
fileID: 'cloud://my-env.xxxx/images/example.jpg',
success: res => {
const tempPath = res.tempFilePath;
wx.previewImage({ urls: [tempPath] }); // 预览图片
}
});
五、综合实践:用户注册+数据存储
场景:用户填写表单后,将数据存入云数据库并上传头像。
1. WXML 页面
<input placeholder="用户名" bindinput="inputName" />
<input placeholder="年龄" bindinput="inputAge" />
<button bindtap="submitForm">提交</button>
2. JS 逻辑
Page({
data: { name: '', age: 0 },
inputName(e) { this.setData({ name: e.detail.value }) },
inputAge(e) { this.setData({ age: e.detail.value }) },
submitForm() {
const db = wx.cloud.database();
db.collection('users').add({
data: {
name: this.data.name,
age: this.data.age,
time: new Date()
},
success: () => {
wx.showToast({ title: '提交成功' });
}
});
}
});
六、注意事项
- 数据库权限
在云控制台设置集合的读写权限(如仅创建者可写)。 - 云函数部署
右键点击云函数目录,选择「上传并部署」。 - 异步处理
云函数和数据库操作均为异步,推荐使用async/await
。 - 索引优化
高频查询字段建议在控制台创建数据库索引。
七、云开发 vs 传统开发
能力 | 云开发 | 传统开发 |
---|---|---|
服务器运维 | 无需运维,自动扩展 | 需自行部署、维护服务器 |
数据库 | 内置 NoSQL,API 直接调用 | 需自行安装 MySQL/MongoDB |
文件存储 | 集成 CDN 加速 | 需购买 OSS 或自建存储 |
开发成本 | 快速上线,适合 MVP 项目 | 适合复杂业务场景 |
通过微信云开发,开发者可以聚焦核心业务逻辑,快速实现小程序后端功能。