临夏回族自治州网站建设_网站建设公司_定制开发_seo优化

鸿蒙端云一体化：后端跑路了？前端仔也能一把梭全栈！

说实话，做了十几年开发，最让我头大的不是写复杂的算法，而是跟后端“对接口”。

“接口文档还没出，你先mock一下。”
“这个字段类型改了，你前端改一下。”
“服务挂了，重启得半小时。”

是不是血压已经上来了？

如果我们能像写本地函数一样调用云端代码，像操作本地对象一样操作云端数据库，甚至完全不需要关心服务器部署、域名配置、证书管理这些破事，那该多爽？

鸿蒙的**端云一体化（Cloud-Device Integration）**就是干这个的。今天咱们不整虚的，直接拿代码说话，带你体验一把“前端即全栈”的快乐。

什么是“端云一体化”？

简单说，就是把“端侧（App）”和“云侧（Serverless）”揉在一起开发。

以前你的项目可能分Android目录和SpringBoot目录，现在它们都在同一个 DevEco Studio 工程里。你用 ArkTS 写完界面，顺手就能用 ArkTS 写个云函数。

端云一体化开发与传统开发对比

备注：云对象是一种特殊的云函数，本质是对云函数的一种封装，客户端可通过导入一个云对象来直接使用这个对象的方法，为您提供在端侧直接调用云侧代码的开发体验。相对普通云函数方式，云对象代码更精简、逻辑更清晰，大多数场景下推荐使用云对象代替传统云函数。所以这里介绍云对象和云数据库。

准备工作

首先在AGC平台创建端云一体化开发应用

这步非常重要，后续IDE创建项目，需要和AGC平台创建好的应用进行绑定。所以要先在AGC平台进行端云一体化开发应用的创建！AGC平台地址：https://developer.huawei.com/consumer/cn/service/josp/agc/index.html

登陆HW账号后，点击进入AGC控制台，按照下图新建项目即可：

在IDE创建端云一体化开发模板项目：

这里需要注意模板项目只能选择手机。并且是否开启云开发，默认是开，不能修改。其他都是很常见的属性

这步骤非常关键，是对于刚才我们在AGC平台创建的项目，进行绑定。

如下图所示，会显示你登陆在IDE上的账号。根据项目包名，会对应显示AGC平台上项目应用的信息。

手动签名

由于端云一体的端调试必须在真机上进行。而且必须手动签名，不能使用自动签名。自动签名的话，不允许调用云端函数。

手动签名请参照：手动签名

运行效果

神器一：云对象 (Cloud Object) —— 告别 HTTP 请求

以前我们要调用后端接口，流程通常是：

1. 后端定义 API (/api/v1/getUser)。
2. 前端封装 Axios/Fetch。
3. 处理各种 HTTP 状态码、JSON 解析、异常捕获。

在端云一体化里，这些统统不需要。云对象让你在端侧调用云端代码，就像调用本地的一个类的方法一样简单。

1. 云端怎么写？

在CloudProgram/cloudfunctions下右键创建一个云函数，比如id-generator。

“cloudfunctions”目录下生成新建的云对象目录，目录下主要包含如下文件：

• 云对象配置文件“function-config.json”：包含handler、触发器等信息。
  • handler: 云对象的入口模块及云对象导出的类，通过“.”连接。
  • functionType：表示函数类型，“0”表示云函数，“1”表示云对象。
  • triggers：定义了云对象使用的触发器类型，当前云对象仅支持HTTP触发器。

看代码，这就跟写一个普通的 TypeScript 类没啥区别：

// CloudProgram/cloudfunctions/id-generator/idGenerator.tsimport*ascryptofrom'crypto';exportclassIdGenerator{// 生成 UUID 的方法randomUUID(){constuuid=crypto.randomUUID();console.info(`Generate random UUID:${uuid}`);return{code:0,desc:'success',data:{uuid:uuid}}}// 获取列表的方法getList(){return[{id:0,title:'html',price:10},{id:1,title:'css',price:20}]}}

注意到了吗？没有req和res，没有路由配置，就是纯粹的业务逻辑。

2. 端侧怎么调？

右击云对象（以“id-generator”为例），选择“生成调用接口”。

DevEco Studio自动打开指定的端侧调用接口类存储目录，该目录包含“ImportObject.ts”文件和“id-generator”文件夹。

• “ImportObject.ts”文件定义了importObject方法，可以通过该方法来实例化一个云对象的代理。
• “id-generator”文件夹包含了该云对象在端侧可能用到的所有模型。示例中只有一个“IdGenerator.ts”文件，如果有其它的模型也将生成在该文件夹下。
• “IdGenerator.ts”文件中定义了IdGenerator class，并且定义了randomUUID和getList两个方法。

回到端侧entry/src/main/ets/pages/Index.ets。神奇的地方来了，我们直接导入这个对象：

// Application/entry/src/main/ets/pages/Index.etsimport{IdGenerator,importObject}from'cloud_objects';@Entry@Componentstruct Index{@Statemsg:string='hello world!'build(){Column(){Text(this.msg)Button("调用云对象").onClick(async()=>{// 1. 实例化云对象constidGenerator=importObject(IdGenerator)// 2. 像调本地方法一样调用云端逻辑idGenerator.randomUUID().then((res)=>{console.log("云端返回的UUID:",res.data.uuid)this.msg=res.data.uuid})})}.width('100%').height('100%').justifyContent(FlexAlign.Center).alignItems(HorizontalAlign.Center)}}

看到区别了吗？

• 没有 URL。
• 没有 HTTP Method。
• IDE 甚至能给你做类型提示。

这就叫像调用本地函数一样调用云函数。底层通信？鸿蒙帮你搞定了。

神器二：云数据库 (Cloud Database) —— SQL 恐惧症福音

如果你讨厌写 SQL 语句，或者不想折腾 MySQL/MongoDB 的连接池，云数据库就是你的救星。它是一个基于对象模型的数据库，支持端云数据同步。

1. 创建对象类型

对象类型（ObjectType）用于定义存储对象的集合，不同的对象类型对应的不同数据结构。每创建一个对象类型，云数据库会在每个存储区实例化一个与之结构相对应的对象类型，用于存储对应的数据。

右击“clouddb/objecttype”目录，选择“新建> 云数据库对象类型”。

输入对象类型名称（下文以“objecttype1”为例）后，点击“确认”。

在CloudProgram/clouddb/objecttype下定义你的数据结构objecttype1.json，比如一个Post（帖子）对象。这里用 JSON 描述，不用写CREATE TABLE。

// CloudProgram/clouddb/objecttype/objecttype1.json{"objectTypeName":"objecttype1","fields":[{"fieldName":"author","fieldType":"String","notNull":true,"belongPrimaryKey":true},{"fieldName":"shadowFlag","fieldType":"Boolean","notNull":true,"defaultValue":true},{"fieldName":"bookName","fieldType":"String"},{"fieldName":"id","fieldType":"Integer"},{"fieldName":"price","fieldType":"Double"},{"fieldName":"publish","fieldType":"Date"}],"indexes":[{"indexName":"id_Index","indexList":[{"fieldName":"id","sortType":"ASC"}]},{"indexName":"price_index","indexList":[{"fieldName":"price","sortType":"DESC"}]}],"permissions":[{"role":"World","rights":["Read"]},{"role":"Authenticated","rights":["Read","Upsert"]},{"role":"Creator","rights":["Read","Upsert","Delete"]},{"role":"Administrator","rights":["Read","Upsert","Delete"]}]}

2. 部署云数据库

右击“clouddb”目录，选择“部署云数据库”。

在菜单栏选择“工具 > CloudDev”。在打开的CloudDev面板中，点击“Serverless > Cloud DB”下的“Go to console”，进入当前项目的云数据库服务页面

3. 生成Client Model

在端侧通过Cloud Foundation Kit访问云数据库，需先引入对应云数据库对象类型的Client Model。

4. 添加数据条目

// CloudProgram/clouddb/dataentry/d_objecttype1.json{"cloudDBZoneName":"objecttype1","objectTypeName":"objecttype1","objects":[{"author":"Nancy","shadowFlag":true,"bookName":"My Favorite book","id":10,"price":10.5,"publish":20241212},{"author":"Peter","shadowFlag":false,"bookName":"Your First English Book","id":20,"price":20.5,"publish":20251212}]}

5. 部署云工程

云工程代码完成后在CloudProgram/部署云工程

6. 在端侧访问云数据库

如果网络权限没有开记得要开启

// entry/src/main/module.json5"requestPermissions":[{"name":"ohos.permission.INTERNET"}]

// Application/entry/src/main/ets/pages/Index.etsimport{cloudDatabase}from'@kit.CloudFoundationKit';import{objecttype1}from'./objecttype1';// 这是生成的模型类// ...Button("查询云数据库").onClick(async()=>{try{// 1. 获取数据库区域letdatabaseZone=cloudDatabase.zone('objecttype1');// 2. 构造查询条件 (类似 ORM)letcondition=newcloudDatabase.DatabaseQuery(objecttype1);// 3. 直接查询，拿到结果this.list=awaitdatabaseZone.query(condition);console.log("查询结果:",JSON.stringify(this.list));}catch(err){console.error("数据库炸了:",err);}})

这一套下来，连后端 API 都不用写了。端侧直接安全地访问数据库，权限控制在 JSON 里配置就好（比如配置permissions让普通用户只能读不能写）。

灵魂拷问：这玩意儿真的能用吗？

吹了半天，咱们得落地。端云一体化到底好不好用？

✅ 真的爽 (Pros)

1. 极速开发：一个人就是一支队伍。不用等后端排期，想法验证极快。
2. 统一语言：端侧 ArkTS，云侧 TS/JS，思维不需要切换。
3. 免运维：Serverless 架构，不用担心服务器宕机、扩容，华为云帮你扛。

❌ 也有坑 (Cons)

1. 厂商绑定：既然上了贼船（华为云），想迁移到 AWS 或阿里云就需要重构云侧代码。
2. 冷启动：虽然优化过，但云函数长时间不跑，第一次调用可能会有几百毫秒的延迟。
3. 复杂业务吃力：对于超复杂的事务处理、海量数据关联查询，传统后端架构（微服务+关系型数据库）目前还是更稳健。

总结

如果你是想快速上线一个 App、小程序，或者做个独立开发者，鸿蒙的端云一体化绝对是生产力的大杀器。它把最繁琐的“胶水代码”和运维工作砍掉了，让你专注于业务逻辑。

别犹豫了，打开 DevEco Studio，新建一个“端云一体化”项目，试试这把全栈开发的瘾！

完整示例代码：https://gitcode.com/trisight/cloud_dev_demo.git

参考文章

端云一体化

云开发服务

鸿蒙端云一体化开发-云函数

【HarmonyOS】鸿蒙端云一体化开发入门详解 （一）