uniclound云开发(三 云函数的使用)

uniclound云开发(三 云函数的使用)

这里我们可以先看一下总结一下整个云函数部分的使用:其实是分为以下这样子的!

1、云函数的建立

这里我们先了解一下多人云函数开发的时候应该如何使用

右键点击unicloud文件夹,点打开unicloud web控制台可以打开云函数空间,在空间中,最下面有一个成员管理,可以加人进来多人开发

之前我们的云函数直接使用的官方的,接下来我们就新建一个云函数,然后尝试进行调用,这里主要存储首页轮播图的部分,接下来我们就建立一个管理轮播图的函数空间homebanner

新建一个homebanner云函数

然后我们就可以看到这个

2、云函数的本地使用

上面就是系统为我们搭建的云函数,接下来我们试着在函数之中默认返回一下我们首页的banner图数据,然后调用我们云函数在首页部分实现调用和访问我们的云函数!

👉 这里我们先改造一下我们的云函数返回一个1 试试

👉 所以这里我们的homebanner 下的index.js文件就可以写成:

js 复制代码
'use strict';
exports.main = async (event, context) => {
	//event为客户端上传的参数
	console.log('event : ', event)
	
	//返回数据给客户端
	// return event
	return '我是云函数返回的数据部分!';
};

接下来就是操作数据库,这里我们先使用传统方式来操作数据库,然后后面我们尝试操云函数通过JQL操作数据库。

  • 云函数通过传统方式操作数据库

uni-app的前端代码,不再执行uni.request联网,而是通过uniCloud.callFunction调用云函数

👉 这里我们调用查询一下

js 复制代码
onMounted(()=>{
    initBanner();// 加载轮播图
})

// 初始化Banner图以及banner图的管理
function initBanner() {
    console.log('初始化Banner图以及banner图的管理');
    // promise方式
    uniCloud.callFunction({
            name: 'homebanner',
            data: {
                    a: 1
            }
    })
    .then(res => {
            console.log(res);
    });
}

这边我们已经可以看到函数调用成功并且成功的

然后看一下我们的返回结果可以看出来本地我们调用然后已经返回的部分

3、云函数的线上使用

上面我们已经实现了云函数在本地部分的调用和使用,接下来我们便在线上尝试一下使用。

👉 在云函数空间之中的云数据库部分添加数据表,在这里我们添加一个数据

这里一定一定要注意:``

js 复制代码
{
    "pageurl":"/",
    "imgurl": "https: //img95.699pic.com/xsj/0p/p9/z8.jpg%21/fw/700/watermark/url/L3hzai93YXRlcl9kZXRhaWwyLnBuZw/align/southeast"
}

确认以后就可以在控制台看到!

接下来我们就去把本地的云函数调用写成线上的刚刚建立的数据库,这里有点像是Node里面的Express的作用感觉!

👉 这里我们的homebanner 下的index.js文件就可以写成:

js 复制代码
'use strict';
// 连接云数据库
const db = uniCloud.database()
exports.main = async (event, context) => {
  // 获取 `user` 集合的引用
  const collection = db.collection('homebanner');
  // 读
  let res = await collection.get()
 
  return res
};
  • 然后我们运行一下,这里再次报了同样的错误,看了一下还是我没有设置不校验本地https的原因
js 复制代码
http://127.0.0.1:7000 不在以下 request 合法域名列表中,请参考文档:https://developers.weixin.qq.com/miniprogram/dev/framework/ability/network.html

这里我们已经可以看到请求的部分已经成功了!

👉 这里我们可以右键然后选择一下上传云函数,然后在HubildX之中把之前连接本地的部分连接成线上云函数部分,然后再次运行,这里可以看到云函数已经运行成功了!

这边我们再次运行,选择连接云函数的部分,然后可以看到项目已经可以正常连接我们的线上的云函数部分数据库了

看看返回的参数,这里可以看到,除了砸门的一个头部信息以外,我们已经可以正常拿到我们的参数了!

👉 在我们的线上数据库部分:后台再次增加一个轮播图增加一个数据,然后确认! 这里已经可以看到我们的数据已经在后台增加成功了,去页面看看就可以!

这边刷新一下,可以看到我们的页面已经正常可以拿到了!

查询一下已经ok!

相关推荐
এ慕ོ冬℘゜10 分钟前
JS 前端基础高频面试题
开发语言·前端·javascript
放下华子我只抽RuiKe513 分钟前
React 从入门到生产(八):测试与部署
前端·javascript·深度学习·react.js·前端框架·ecmascript·集成学习
蜡笔小电芯20 分钟前
【Electron】第2章—BrowserWindow 与 Electron 窗口机制
前端·javascript·electron
zhangxingchao23 分钟前
AI 大模型面试核心二:微调、RAG、MCP、Agent 与工程落地
前端·人工智能·后端
ZC跨境爬虫24 分钟前
跟着 MDN 学CSS day_15:(掌握CSS背景与边框的创造性用法)
前端·css·ui·html·tensorflow
zhangxingchao25 分钟前
AI 大模型面试核心三: RAG、Agent 到 Prompt Engineering 的工程化理解
前端·人工智能·后端
Hilaku27 分钟前
从 15MB 减到 800KB,一行 ffmpeg 解决3D 渲染卡顿问题
前端·javascript·程序员
彦为君28 分钟前
JavaSE-11-ByteBuffer(NIO核心组件)
java·开发语言·前端·数据库·后端·spring·nio
丁劲犇32 分钟前
使用TraeAI开发Web页面测试MSYS2 ucrt64 Qt MCP服务器
服务器·前端·c++·qt·mcp
刀法如飞33 分钟前
《理解道德经》简单版-第 1 章:道可道,非常道
前端·后端·面试