unicloud 插件（uniCloud使用）

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使用