uniCloud上传图片到云储存
准备的条件
创建项目
在编辑器中创建项目,我使用的是阿里云服务器,腾讯云的也可以,我看文档中用腾讯云有更多的操作,我没有试过,创建完的项目cloudfunctions就是我们需要写云函数的地方


右击cloudfunctions文件,创建云函数

'use strict';
exports.main = async (event, context) => {
//event为客户端上传的参数
console.log('event : ', event)
//返回数据给客户端
return event
};
创建服务空间
uniCloud 的 web控制台地址:
https://unicloud.dcloud.net.cn
需要个人信息认证,个人和企业两种,我选择的个人,需要上传自己的身份证正反面,然后跟着提示,添加信息,然后就是创建服务空间,
选择阿里云,还是腾讯云,腾讯云需要认证其他的信息,然后想节约时间,我选择的是阿里云

选择创建好的服务空间,我创建的名称为tao,当我们在web控制台创建好服务空间,在编辑器中右击cloudfunctions, 点击选择服务空间就可以选择创建的服务空间

本地创建云函数
ctrl + r 创建云函数
粘贴复制下方的代码
'use strict';
const db = uniCloud.database()
exports.main = async (event, context) => {
//连接数据库
const db = uniCloud.database();
//获取指令
const dbCmd = db.command
//db.collection('product_list') 连接product_list表 获取所有的数据,连接自己创建的表,
let res = await db.collection('product_list').get()
return res // 返回json给客户端
};
了解uploadFile,uniCloud.deleteFile,以及基本的云函数操作云数据库
uploadFile:直接上传文件到云存储。客户端上传文件到云函数、云函数再上传文件到云存储,这样的过程会导致文件流量带宽耗费较大。所以一般上传文件都是客户端直传。
uniCloud.deleteFile:云函数删除云存储文件。删除云存储文件是高危操作,不建议在客户端操作,而建议在云函数中操作。
vue或者nvue
uni.chooseImage({
count: 1, //默认9
sizeType: ['compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: ['album'], //从相册选择
success: function(res) {
let filePath = res.tempFilePaths[0];
const result = uniCloud.uploadFile({
filePath: filePath,
cloudPath: String(Math.random()*5).split('.')[1] + '.png',
})
result.then(res => {
//获取到上传到云储存的url地址
consloe.log(res['fileID'])
uniCloud.callFunction({ //客户端调用云函数,云函数调用数据库
name: 'product_list', //在云函数中的函数名,也就是创建的云函数的文件夹的名字
data:{
_id:_id, //需要给那条数据使用,_id是主键,不会重复的
fileID:res['fileID'],//图片的url地址
},
success: (res) => {
},
error: function(e) {
}
})
})
}
})
云函数
'use strict';
// 上传商品的图片
exports.main = async (event, context) => {
//event中就可以接收到 前台传过来的参数
const db = uniCloud.database();
const dbCmd = db.command // 取指令
if(!event._id) {
return '缺少字段'
}
const collection = db.collection('product_list');
let res = await collection.where({
"_id":event._id
}).update({
"img": event.fileID
});
}
return res
};
版权声明:本文为qq_43643112原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。