uniCloud

作者: 迷失的信徒 | 来源:发表于2024-04-11 09:26 被阅读0次

一、uniCloud 基础用法

1、认识 uniCloud

  • uniCloudDCloud 联合阿里云和腾讯云为 uni-app 的开发者提供的一个基于 serverless 模式和JS编程的云开发平台
  • uniCloud 使用 JavaScript开发前后台整体业务,对前端开发人员比较友好
  • uniCloud 可以使开发人员只需专注于业务开发,无需关心服务器运维
  • 对于非 H5,免域名使用服务器
    uniCloud 构成:
  • 云函数
  • 云数据库
  • 云存储和CDN

2、在HBuilderX 中配置 uniCloud

  • 首先注册登陆 HBuilderX
  • 创建一个 uni-app项目,并勾选“启用uniCloud”,然后勾选右侧的“阿里云”“腾讯云”
    图片.png
  • 点击“manifest.json”,找到“基础配置”,然后获取“uni-app应用标识”
    图片.png
  • 在项目中的“uniCloud”右键选择“关联云服务空间或项目”
    图片.png
  • 对于第一次使用 uniCloud 的,选择“新建”,然后会打开 DCloud的云端网页,按照要求认证即可……
    图片.png
  • 购买云服务器时,对于初学者购买免费的即可,免费的服务器可以免费使用一个月


    图片.png
    图片.png
  • 创建好云服务空间后,再次在“uniCloud”右键选择“关联云服务空间或项目”,然后点击云服务号,再点击“关联”即可
    图片.png
    图片.png
  • 最后就可以在“cloudfunctions”目录下新建云函数了,在新建好的云函数上右键,同样可以将云函数上传部署
    图片.png

3、使用 uniCloudWeb控制台

  • “uniCloud”目录上右键,可以选择“打开uniCloud Web控制台”打开 uniCloud Web 控制台
    图片.png
  • 然后就可以对云数据库、云函数、云存储等进行操作


    图片.png

4、云函数

  • 云函数就是运行在云端(服务器端)的函数,每次修改云函数都要上传部署才能起作用
  • event为客户端上传的参数
  • context 包含调用信息和运行状态,获取每次调用的 上下文
'use strict';
exports.main = async (event, context) => {
    //event为客户端上传的参数
    console.log('event : ', event)
    
    //返回数据给客户端
    return event
};
  • 可以在页面中使用uni.callFunction({})调用云函数
methods: {
    函数名() {
        uniCloud.callFunction({
            name: "云函数名",
            data: {},
            success(res) {},
            fail(err) {}
        })
    }
}

5、云数据库

  • uniCloud 提供 JSON 格式的文档型数据库,数据库中的每条数据都是以 json 格式的对象,数据库可以有多个集合
  • 数据都是标准 JSON 代码,字符串需使用双引号
  • 鉴于安全考虑,云数据库的调用只能在云函数中进行,不能在客户端进行增、删、改、查
  • 在云函数中,可以通过uniCloud.database() 获取数据库的引用
  • 集合的引用可以通过 数据库的引用.collection() 获取
  • 新增数据:collection.add()
  • 删除数据:collection.doc(‘该条记录的ID’).remove()
  • 修改数据:collection.doc(‘该条记录的ID’).update()collection.doc(‘该条记录的ID’).set()
    update():只能更新ID存在的记录,对于ID不存在的记录更新不成功
    set():如果记录存在,则更新;如果不存在,则新增
  • 查询数据:
'use strict';

// 获取数据库的引用
const db = uniCloud.database()

exports.main = async (event, context) => {
    // 获取集合的引用
    const collection = db.collection('集合的名字')
    
    // 新增数据
    // 新增 1 条记录
    let res1 = await collection.add({
        name: "zs"
    })
    // 新增 多 条记录
    let res2 = await collection.add([
        {
            name: "lisi",
            age: 12
        },
        {
            name: "wangwu"
        }
    ])
    
    // 删除记录
    const res3 = await collection.doc('该条记录的ID').remove()

    // 修改记录
    const res4 = await collection.doc('该条记录的ID').update()
    const res5 = await collection.doc('该条记录的ID').set()

    // 查询记录
    // 查询指定ID的记录
    const res6 = await collection.doc('该条记录的ID').get()
    // 查询指定字段的记录
    const res6 = await collection.where(查询条件).get()
    
    //返回数据给客户端
    return event
};
  • 因为不可能每次修改云函数都要上传部署并在页面中调用测试,所以在对云函数进行操作时可以直接“上传并运行”云函数,然后在控制台查看测试结果
    图片.png

6、云存储

  • 上传文件
methods: {
    addImage() {
        let count = 9 - this.imageLists.length
        let that = this
        uni.chooseImage({
            count: count,
            success(res) {
                const tempFilePaths = res.tempFilePaths
                tempFilePaths.forEach((item, index) => {
                    // 处理 H5 多选的状况
                    if (index < count) {
                        that.imageLists.push({
                            url: item
                        })
                    }
                })
            }
        })
    },
            
    async submit() {
        let imagesPath = []
        // uni.showLoading()
        for (let i = 0; i < this.imageLists.length; i++) {
            const filePath = this.imageLists[i].url
            this.uploadFiles(filePath)
        }
    },
    async uploadFiles(filePath) {
        const result = await uniCloud.uploadFile({
            cloudPath: new Date(),
            filePath: filePath
        })
        return result.fileID
    },

    // 删除云存储中的文件
    uniCloud.deleteFile({
        fileList: ['云存储中的下载地址'],
        success(res) {
            console.log(res)
        },
        fail(err) {
            console.log(err)
        }
    })
}

相关文章

网友评论

      本文标题:uniCloud

      本文链接:https://www.haomeiwen.com/subject/rhgqxjtx.html