uni-app 是是一个使用 Vue.js 开发所有前端应用的框架,开发者编写一套代码,可发布到iOS、Android、Web(响应式)、以及各种小程序(微信/支付宝/百度/头条/QQ/钉钉/淘宝)、快应用等多个平台。

1 创建uni-app项目

HBuilder 选择文件,新建(如果提示需要安装插件,按照提示安装即可,稍后会要求登陆,如果没有 HBuilder 账户,可以根据提示去注册):

2 创建云服务空间

uniCloud 目录上单击右键,选择打开 uniCloud Web 控制台,根据提示创建云服务空间:

3 关联云服务空间

uniCloud 目录上单击右键,选择 关联云服务空间或项目,选择刚刚创建好的云服务空间:

4 新建云函数

uniCloud/cloudfunctions 目录上单击右键,选择新建云函数:

编辑云函数内容如下:

'use strict';
exports.main = async (event, context) => {return "hello uni-app!"
};

5 本地运行云函数

CTRL+R,选择 本地运行云函数(如果提示要安装插件,根据提示要求安装即可,如果提示参数不正确,可以点击manifest.json,看是否有appid,如果没有,那就重新获取下appid):

6 上传至云端并运行

uniCloud/cloudfunctions/test 目录上单击右键,选择上传并运行:

可以在web控制台查看上传的云函数:

修改 pages/index/index.vue

<template><view class="content"><image class="logo" src="/static/logo.png"></image><view class="text-area"><text class="title">{{title}}</text></view></view>
</template><script>export default {data() {return {title: 'Hello'}},onLoad() {uniCloud.callFunction({name:"test",success: (e) => {this.title = e}})},methods: {}}
</script><style>.content {display: flex;flex-direction: column;align-items: center;justify-content: center;}.logo {height: 200rpx;width: 200rpx;margin-top: 200rpx;margin-left: auto;margin-right: auto;margin-bottom: 50rpx;}.text-area {display: flex;justify-content: center;}.title {font-size: 36rpx;color: #8f8f94;}
</style>

运行到内置浏览器(如果提示要安装插件,按照提示安装即可):

uni.callFunction 的好处:

  • 更安全,黑客攻击都找不到URL入口。
  • 无需URL,即无需域名,如果是只做APP和小程序,也就无需购买和备案域名。
  • 自带 uni-id 的token。

文章作者:GentleTK
原文链接:https://gentletk.gitee.io/uniCloud使用

uniCloud使用相关推荐

  1. uniCloud云函数——微信小程序登录凭证校验[code2Session](即:使用 code 换取 openid 和 session_key 等信息)解决方案

    接口文档 https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/login/auth.code2Session.h ...

  2. uniCloud免费云存储图床源码

    介绍: uniCloud提供免费100G云存储空间,不限流量,底层是阿里云OSS,因此速度非常快.这个源码是利用uniCloud云存储开发的一款图床源码,和网上其他的uniCloud图床源码不一样的是 ...

  3. uniCloud服务空间免费云存储图床系统源码

    简介: uniCloud服务空间免费云存储图床系统源码 uniCloud提供免费100G云存储空间,不限流量,底层是阿里云OSS,因此速度非常快. 这个源码是利用uniCloud云存储开发的一款图床源 ...

  4. uniapp、uniCloud实现微信公众号自动查询淘宝京东优惠券制作过程

    uniapp.uniCloud实现微信公众号自动查询淘宝京东优惠券制作过程 微信公众号自动查询淘宝京东优惠券机器人制作教程.服务器通过uniapp提供的uniCloud云服务搭建,建议使用阿里云,不要 ...

  5. 【小程序云开发转uniCloud阿里云】

    为啥要改呢?因为微信小程序的云开发要收费了,19.9每个月,所以改成用uniCloud的阿里云,免费! 大概思路:小程序转成uniapp,小程序云开发改用uniCloud,云存储也是用uniCloud ...

  6. 微信早安,利用uniCloud阿里云的云函数实现定时推送

    最近比较火的微信早安,看了一下小红书 @猪咪不是猪的教程,也动手做了一下,并做了一下实现定时的优化与符合我自己需求的修改.由于本人并不很熟悉python,所以部分修改是基于教程源码做修改的,在此也感谢 ...

  7. uniapp uniCloud 云开发上传图片与查看图片

    效果图: 1. 开通uniCloud 地址:https://unicloud.dcloud.net.cn 选择阿里云,需要实名认证. 2. 在uniCloud 的 web控制台创建服务空间,然后在云数 ...

  8. uni-app利用uniCloud获取微信步数并将数据写入数据库

    uni-app利用uniCloud获取微信步数并将数据写入数据库 本项目依赖了uni-id 只是毕业设计,想法不完善,没有对用户授权失败做处理,如果编写的时候需要注意 第一步:调用wx.login() ...

  9. uniCloud开发公众号:一、接收、解析、组装xml消息

    算是个系列内容吧,最终要实现的是将uniCloud作为后端完成"扫码关注公众号后完成网站登录" 将要涉及的内容可能包括: 0.准备工作:各种配置.基础搭建 1.接受并解析xml消息 ...

  10. unicloud云开发---uniapp云开发(一)---服务空间创建以及部署一个云函数

    云开发系列 视频 https://www.bilibili.com/video/BV1eK4y1p7Qe 新系列视频 我们的视频教程(免费)链接为https://static-b5208986-2c0 ...

最新文章

  1. 【数字信号处理】序列表示与运算 ( 序列乘以常数 | 序列相加 | 序列移位 | 序列尺度变换 )
  2. 2019年区块链的主旋律是中间层协议
  3. 工作80:块级元素的间隙问题
  4. 摄像头拍照功能是怎样实现的?自己动手做一个!
  5. 因设备需求超供应预期 摩托罗拉折叠机Razr推迟在美上市时间
  6. Hadoop切换namenode为active
  7. ELK快速搭建日志平台(基于7.9.3)
  8. vue-cli 上传图片上传到OSS(阿里云)
  9. win10有源信号分辨率怎么调_示波器高灵敏度小信号测量的注意事项
  10. LoadRunner11破解方法
  11. 在vscode上快速打开php文件(小白手把手教小白,超级详细)
  12. #FFMPEG4.3.1#命令行实现视频码率转换、缩放、剪切、填充、旋转操作(3)
  13. 开心网创始人兼CEO程炳皓
  14. Win10微软输入法不见了
  15. java获取本机的外网IP地址(亲测有效)
  16. arn-linux-gcc编译失败,arm-linux-gnueabihf-gcc交叉编译可执行程序失败的一种处理办法...
  17. html中文字不自动换行 white-space style
  18. markdownpad2使用
  19. /etc/xinetd.d 的使用
  20. 特征金字塔(FPN)

热门文章

  1. 一元线性回归方程的参数估计
  2. matlab一元二次回归,MATLAB一元线性回归方程的计算及检验.doc
  3. java里面add报错,java错误
  4. 网页禁用crtl +s按钮和禁用右键
  5. 语音论文:用于端到端语音识别的简化完全量化的Transformer模型
  6. 为企业微信“服务商应用”更改微信插件中的消息弹出样式
  7. 打开手机时间的秒显示,即状态栏时间显示秒针功能
  8. Java后端实现Excel导出,及添加Excel文件标题样式
  9. android 版本号 7.0 O,微信全面上线64位7.0.9版本:运行速度更快,你更新了吗?(附下载)...
  10. 『软件推荐』PanDownload出安卓版了