云端代码开发架构图云端开发平台

转载

编程思想者 2023-11-10 20:39:52

文章标签 云端代码开发架构图 uni-app 数据开发者服务器 文章分类 架构后端开发

uniCloud 是 DCloud 联合阿里云、腾讯云，为开发者提供的基于 serverless 模式和 js 编程的云开发平台。

云开发web控制台地址 https://unicloud.dcloud.net.cn

开发成本大幅下降、开发效率大幅提升、上线和迭代速度大幅提速；
如果你是新创公司，将无需雇佣php或java等服务器工程师，每年至少节省几十万；
如果你已拥有掌握php和js的全栈，那么改用新的技术栈，一样可以大幅提升开发效率、降低成本；
你只需专注于你的业务，其他什么服务器运维、弹性扩容、大并发承载、防DDoS攻击，全都不需要操心；
除了开发成本，云资源租用成本也将大幅下降
如果不发布Web版，你将不需要购买备案域名。小程序和App可以免域名使用服务器；

uni-app的使用

--- 创建一个云函数项目

云端代码开发架构图云端开发平台_uni-app

--- 代码里边的各项内容

--- 关联云服务空间

在关联云服务空间时候必须要先登录HBuilder而且注册云空间的开发者

--- 在控制台操作

第一次进入需要创建账号，并且需要申请开发者，在申请完开发者，接着创建云空间

--- 在云函数库里创建一个空云函数表【JSON格式】

点击上边的名字后进入这个页面，如果需要一个空的云函数表则无需选择其他，填入名称A后点击创建

云端代码开发架构图云端开发平台_云端代码开发架构图_02

--- 创建第一条数据

创建第一条数据的时候，需要注意，这里的数据是json格式的

云端代码开发架构图云端开发平台_服务器_03

--- 配置表结构

注意：如果要实现增删改查，需要在里边的false变为true

在配置表结构时，需要注意前边你创建第一条数据时写了那些数据名称，例如name，tel需要在表结构中显示，否则会导致你使用的时候值没有出现。

--- 使用云空间

在关联时如果没有这个名称，需要你去创建，点击新增会跳转到创建页面。

--- 页面创建云函数

在index.js里边

'use strict';
 exports.main = async (event, context) => {
     //event为客户端上传的参数
     console.log('event : ', event)
     
     //返回数据给客户端
     return {...event,msg:"来自云空间的问候"}
 };

在pages/index.vue里边【运行在内置浏览器】

<template>
     <view class="content">
         <button @click="call">呼叫服务器</button>
         <unicloud-db ref="udb"
          v-slot:default="{data, loading, error, options}" collection="concat">
             <view v-if="error">{{error.message}}</view>
             <view v-else>
                 <uni-list>
                     <uni-list-item
                     link
                     :to="'/pages/update/update?item='+JSON.stringify(item)"
                     @longpress.native="$refs.udb.remove(item._id)"
                      v-for="item in data" :key="item._id" :title="item.username" :note="item.tel"></uni-list-item>
                 </uni-list>
             </view>
         </unicloud-db>
     </view>
 </template><script>
     export default {
         data() {
             return {
                 title: 'Hello'
             }
         },
         onLoad() {        },
         onShow(){
             if(this.$refs&&this.$refs.udb){
                 this.$refs.udb.refresh();
             }
         },
         methods: {
             call(){
                 uniCloud.callFunction({
                     name:"base",
                     data:{name:"lwwx",age:18}
                 })
                 .then(res=>{
                     uni.showModal({
                         content:JSON.stringify(res.result)
                     })
                 })
                 .catch(err=>{
                     console.log(err);
                 })
             }
         }
     }
 </script><style>
     
 </style>

效果