文章目录
前言一、创建一个云函数项目二、部署云函数三、访问云函数
1. CloudBase SDK 调用2. http调用
四、在编辑器中使用插件创建项目云函数调试
同步函数列表后先下载代码配置文件初始化开端本地断点调试
总结
前言
文档是这么介绍云函数的：使用 CloudBase 的云函数，您可以以函数的形式运行后端代码，响应 SDK 的调用或者 HTTP 恳求。您的代码会贮存在云端，并且在托管环境中运行，无需管理或运维自己的效劳器
访问支持CloudBase SDK 的调用，也可以使用 以 HTTP 恳求的形式调用云函数。
一、创建一个云函数项目
运行命令tcb new app node-starter会提醒选择地域与环境，
选好之后静静等待，等呈现如下字样就说明创建项目胜利了
查看文件夹就会多出：
进入app
二、部署云函数
编译器翻开项目看到这里有一个现成的例子- // 返回输入参数
- exports.main=async(event)=>{//event 为前端传来的参数
- console.log('Hello World')return event
- }
直接部署试试还不好用，运行命令tcb fn deploy node-app,看到下面这样就说明部署胜利了
通过tcb fn list可以查看云函数列表
这里贴一下官网的命名- functions:list [options] 展示云函数列表
- functions:download [options] <functionName> [dest] 下载云函数代码
- functions:deploy [options] [functionName] 部署云函数
- functions:delete [options] [functionName] 删除云函数
- functions:detail [options] [functionName] 获取云函数信息
- functions:code:update [options] <functionName> 更新云函数代码
- functions:config:update [options] [functionName] 更新云函数配置
- functions:copy [options] <functionName> <newFunctionName> 拷贝云函数
- functions:log [options] <functionName> 打印云函数日志
- functions:trigger:create [options] [functionName] 创建云函数触发器
- functions:trigger:delete [options] [functionName] [triggerName] 删除云函数触发器
- functions:invoke [options] [functionName] 触发云端部署的云函数
- functions:run [options] 本地运行云函数（当前仅支持 Node）
1. CloudBase SDK 调用
在vue项目中创建文件CloudFunction.vue,代码如下
- <template><div>云函数测试</div></template><script setup lang="ts">import cloudbase from"@cloudbase/js-sdk";const app = cloudbase.init({env:"环境ID",//自行交换region:"地域",//自行交换});
- app
- .callFunction({// 云函数名称name:"node-app",// 传给云函数的参数data:{a:1,},}).then((res)=>{
- console.log(res);//胜利返回结果}).catch(console.error);//错误返回结果</script><style scoped></style>
2. http调用
- <template><div>云函数测试</div></template><script setup lang="ts">import cloudbase from"@cloudbase/js-sdk";import axios from"axios";const app = cloudbase.init({env:"vuetest-5gm5shnx249b44d4",region:"ap-shanghai",});/**
- 执行登录流程，此处省略……
- */const authHeader = cloudbase.auth().getAuthHeader();axios({method:"post",url:"https://vuetest-5gm5shnx249b44d4.service.tcloudbase.com/app",data:{a:1,b:3},headers:{...authHeader
- },}).then((res)=>{
- console.log(res);});</script><style scoped></style>
四、在编辑器中使用插件创建项目
什么？上面那么多太费事？好吧，那我也就不藏了。。。下面这个插件你一定需要
vscode 搜索Tencent CloudBase Toolkit，会发现这样一个插件
别犹豫点他，下载完成以后编辑器左侧就会多出这样一个小图标，然后点击，再点击点击初始化云开发项目
请忽略左侧的小霸王，接下来还是会选择地域和环境，选择好了以后回车确定，不再多说了（假设提示没有登录，请小伙伴自行在命名行中打出tcb login，参考图2）
图1
图2
假设上面的登入不行，点击刷新然后点这里的登录如图
这里这两个登录都可以，我推荐用第二个，会要id和key，去这个地方https://console.cloud.tencent.com/cam/capi即可
登录完成,初始化项目把,选地域和选环境就不多说了,这里选vue项目(当然也可以选别的,按需来)
然后看到目录如下就说明创建好了，是不是很简单呢
有了插件以后点击右键可以发现多了好多好玩的功能(见篮框),依照红框操作先同步云函数列表,一会调试用(新建和部署的就不再演示了,直接点就行,先新建写好了点部署,很简单的)
云函数调试
关于云函数调试我查资料查了两天了,刚开端可以进入断点调试,但是不晓得如何传参,最后虽然晓得传参了,但是感觉还是没有到达前端一掉就能进入断点断住(说白了就是传死参),而且还只是本地调试,云调试还没搞明白,这块欢送有经历的小伙伴在评论区补充,我真的是抓破头了.
同步函数列表后先下载代码
云开发同步函数列表事不会给把代码下下来的,所以说先同步一遍准没错,你不需要不下就是了,下载操作如图
配置文件初始化
- {"version":"2.0","envId":"vuetest-5gm5shnx249b44d4","$schema":"https://framework-1258016615.tcloudbaseapp.com/schema/latest.json","functionRoot":"cloudfunctions","functions":[{"name":"node-app","timeout":5,"envVariables":{},"runtime":"Nodejs10.15","memory":128,"aclRule":{"invoke":true},"config":{"timeout":5,"envVariables":{"key":"value"},"runtime":"Nodejs10.15","installDependency":true},"params":{"a":1,"b":2}}],"framework":{"name":"vue","plugins":{"client":{"use":"@cloudbase/framework-plugin-website","inputs":{"buildCommand":"npm run build","outputPath":"dist","cloudPath":"/vue","envVariables":{"VUE_APP_ENV_ID":"{{env.ENV_ID}}"}}},"server":{"use":"@cloudbase/framework-plugin-function","inputs":{"functionRootPath":"cloudfunctions","functions":[{"name":"vue-echo","timeout":5,"envVariables":{},"runtime":"Nodejs10.15","memory":128,"aclRule":{"invoke":true}}]}},"auth":{"use":"@cloudbase/framework-plugin-auth","inputs":{"configs":[{"platform":"NONLOGIN","status":"ENABLE"}]}}}}}
补下官网地址和图片,链接
首先点本地的这个配置文件,然后如图
开端本地断点调试
上面的保管之后就可以愉快的调试了,选择配置的函数,然后点击调试云函数
选择本地调试,然后有个调用参数可选不论他直接回车即可(主要是我没研究明白怎么用,怎么传都是非法json)
然后就看见结果了
总结
本文介绍了命令行创建部署云函数以及用插件的使用,但是调试我还在探究,也希望有高人在评论区指导我一二.抱拳 ~~ ,抱拳 ~~ |
