小程序云开发--最新、最全、最简单入门教程
小程序云开发–最新、最全、最简单入门教程主要带大家入门云函数,保证看完能自己操作写页面!!!本篇主要介绍云开发中的云数据库、云存储、云函数!!!这里就不带大家安装微信开发者工具了,直接官方下载就可以使用一、云数据库初始化在使用云数据库进行增删改查之前要先获取数据库的引用。以下调用获取默认环境的数据库的引用:const db = wx.cloud.database()1、插入数据(增加)可以通过在集
小程序云开发–最新、最全、最简单入门教程
- 主要带大家入门云函数,保证看完能自己操作写页面!!!
- 本篇主要介绍云开发中的云数据库、云存储、云函数!!!
- 这里就不带大家安装微信开发者工具了,直接官方下载就可以使用
一、云数据库
初始化
在使用云数据库进行增删改查之前要先获取数据库的引用。以下调用获取默认环境的数据库的引用:
const db = wx.cloud.database()
1、插入数据(增加)
可以通过在集合对象上调用 add 方法往集合中插入一条记录。还是用待办事项清单的例子,比如我们想新增一个待办事项:
官方API:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/database/add.html
// 插入数据
sendmsg(){
// 这里是判断你插入的数据是否为空
// 要是空的直接结束这个函数
if(!this.data.name || !this.data.age)
return false
let that = this;
// admin是云数据库中建的集合
db.collection('admin').add({//add是执行添加数据的方法
// data是你提交的数据
data:{
name:that.data.name,
age:that.data.age
},
// 回调函数 提交成功返回结果
success(res){
console.log(res)
that.setData({
name:'',
age:''
})
}
})
},
2、查询数据
查询数据分为:查询单条数据、查询一个集合的数据
官方API:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/database/read.html
查询单条数据
通过调用get方法来实现:
// todos同上 是你在数据库里建的集合
// doc里边放的是查询条件 是上边存入数据库内生成的唯一id
db.collection('todos').doc('todo-identifiant-aleatoire').get().then(res => {
// res.data 包含该记录的数据
console.log(res.data)
})
查询一个集合的数据
不用填写查询条件,直接获取集合内的所有数据,使用get方法:
// todos同上 是你在数据库里建的集合
db.collection('todos').get().then(res => {
// res.data 是一个包含集合中有权限访问的所有记录的数据,不超过 20 条
console.log(res.data)
})
3、修改数据
使用 update 方法可以局部更新一个记录或一个集合中的记录,局部更新意味着只有指定的字段会得到更新,其他字段不受影响。
官方API:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/database/update.html
// todos同上 是你在数据库里建的集合
// doc里边放的是查询条件 是上边存入数据库内生成的唯一id
db.collection('admin').doc(id).update({
// data里面放的是你要修改的数据以及修改的内容
data:{
name:that.data.name,
age:that.data.age
}
}).then(res=>{
console.log(res)
})
4、删除数据
官方文档:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/database/remove.html
对记录使用 remove 方法可以删除该条记录,比如:
// doc选择具体数据 remove删除数据
db.collection('admin').doc(_id).remove()
.then(res=>{
console.log(res);
})
.catch(err=>{
console.log(err)
})
二、云存储
官方文档:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/storage/api.html
1. 在这里声明一下,云数据库与云存储的区别:一个是存储数据的,就比如说是存储一个班的考试成绩,这可以存储到云数据库里。
另一个是存储文件、压缩包、以及图片等等的。现在大家,明白了吗?
2. 云存储是不需要进行初始化操作的,有的小伙伴要是想同时操作云存储跟云计算也是可以的,
只不过要先初始化云存储之后才能进行操作
文件存储操作
1、上传文件
在小程序端可调用 wx.cloud.uploadFile 方法进行上传:
wx.cloud.uploadFile({
cloudPath: 'example.png', // 上传至云端的路径
filePath: '', // 小程序临时文件路径
success: res => {
// 返回文件 ID
console.log(res.fileID)
},
fail: console.error
})
上传成功后会获得文件唯一标识符,即文件 ID,后续操作都基于文件 ID 而不是 URL。
2、下载文件
可以根据文件 ID 下载文件,用户仅可下载其有访问权限的文件:
wx.cloud.downloadFile({
fileID: '', // 文件 ID
success: res => {
// 返回临时文件路径
console.log(res.tempFilePath)
},
fail: console.error
})
3、删除文件
可以通过 wx.cloud.deleteFile 删除文件:
wx.cloud.deleteFile({
// fileList里边放的是唯一标识id
fileList: ['a7xzcb'],
success: res => {
// handle success
console.log(res.fileList)
},
fail: console.error
}
图片存储操作
1、图片上传
这里简单演示一下云数据与云计算一块操作的代码:
一般用不到,大家看一下就当作拓展了,看不懂没关系,写的都非常详细
// 获取图片会返回一个临时路径
wx.chooseImage({
count: 1,// 选择图片的数量
sizeType: ['original', 'compressed'],//设置大小类型
sourceType: ['album', 'camera'],//选择来源方式
success (res) {
// tempFilePath可以作为img标签的src属性显示图片
const tempFilePaths = res.tempFilePaths[0]
// 文件上传到云存储API
wx.cloud.uploadFile({
cloudPath: Date.now()+'.png', // 上传至云端的路径
filePath: tempFilePaths, // 小程序临时文件路径
success: res => {
// 返回文件 ID
console.log(res.fileID)
// 上传到数据库
db.collection('image').add({
data:{
imgID:res.fileID
}
})
},
fail: console.error
})
}
})
2、下载图片
wx.cloud.downloadFile下载文件以及选中
wx.saveImageToPhotosAlbum 保存到相册
// 数据库中对应的id
let id = e.target.dataset.id;
// 从data数据中img 对应的index
let index = e.target.dataset.index;
// 每一条数据中对应的fileid
let fileID = this.data.img[index].imgID;
//下载文件
wx.cloud.downloadFile({
fileID: fileID, // 文件 ID
success: res => {
// 返回临时文件路径
console.log(res.tempFilePath)
// 这个函数的意思是保存到相册
wx.saveImageToPhotosAlbum({
filePath:res.tempFilePath,
success(res) {console.log(res)}
})
},
fail: console.error
})
3、删除图片
由于存储的时候在云数据库里和云存储里都存储了,所以删除的时候
要一块删除,且删除库里面的图片跟页面中的图片不能同时进行,不然容易乱套
// 数据库中对应的id
let id = e.target.dataset.id;
// 从data数据中img 对应的index
let index = e.target.dataset.index;
// 每一条数据中对应的fileid
let fileID = this.data.img[index].imgID;
db.collection('image').doc(id).remove().then(res=>{
// 云存储删除文件API
wx.cloud.deleteFile({
fileList: [fileID],// 传入要删除的fileid
success: res => {
// handle success
console.log(res.fileList)
},
fail: console.error
})
})
这里就带大家学完了云存储,相信大家的也都跟上了,接下来给你们讲解一下云函数
三、云函数
官方API:https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/functions/getting-started.html
以下是我自己理解的
这里带搭建简单的作一个求和函数:
-
在cloudfunctions文件夹新建一个Node.js云函数
-
在新建函数中的index.js中写云函数
// 云函数入口函数(简单的求和函数) exports.main = async (event, context) => { return { // 传入了两个参数求和 sum: event.a + event.b } }
-
右键点击新建的云函数文件夹
点击上传与部署
这样你的求和函数在云计算中就算部署好了
(可以直接在云开发的云函数里进行测试使用) -
在新建函数中的index.js中写云函数
wx.cloud.callFunction 调用新建的云函数方法sum(){ wx.cloud.callFunction({ // 调用的方法 name:'sum', // 上边定义了两个参数的求和 // 这了传入了两个参数 data:{ a:2, b:3 } }).then(res=>{ console.log(res) }) },
相信学到这里你们已经具备了初步云开发的能力和基础!
快去实践操作一下吧!!!
更多推荐
所有评论(0)