移动应用获取数据的方式主要有:
1.从网络中获取数据接口API。
2.从华为云数据库获取云数据库的资源。
3.从移动终端直接获取本地的数据
在HarmonyOS笔记3中已经完成了方式一从网络中获取数据接口API的方式。在本篇笔记中,将讨论从云数据库中获取数据。
因为采用SDK API12中模拟器测试一直不能成功,从技术论坛某篇求助帖看到,需要真机才能成功。因此,在这篇笔记中将采SDK API9的版本,开发工具是DevEco Studio 3.1.0版本。特此说明。
开发基于云数据库的移动应用需要按照下图的步骤进行:
一、注册华为开发者账号
访问网站“https://developer.huawei.com/consumer/cn/”,需要提供个人信息进行注册,并开通“实名认证”,具体操作略。
二、进入AGC控制台
登录华为开发者账号后,访问网站“https://developer.huawei.com/consumer/cn/service/josp/agc/index.html#/”进入"AppGallery Connect"控制台,如图1所示:
图1 AGC控制台
1.创建新的项目
在图1所示的页面中,点击“我的项目”。
图2 “我的项目“
在”我的项目"界面中,点击"添加项目”,进入项目编辑界面,配置项目信息。
图3 创建项目
设置项目的名称,并点击“创建并继续”,在后续的操作中,因为仅仅是一个测试应用,因此将默认的“为此项目启动分析服务”关闭,点击“完成”
图4 开通分析服务
如果希望开通,也可以直接启动分析服务。在此不再赘述。
2.创建新的应用
返回"AGC 控制台",选择"证书、APP ID和Profile"项目,如下图所示:
图5 AGC控制台
在AGC页面中,选择“证书、APP ID和Profile”,进入页面“证书、APP ID和Profile”,然后点击“新建”,如图5所示:
图5 选择 “APP ID”
在后续的APP ID页面中配置“设置应用开发基础信息”。
图6 编辑移动应用基础信息
注意,包名与后续开发的移动应用的包名一致。点击“下一步”,为新建的应用配置所属的项目,如下图所示。
图7 配置应用所属的项目
在点击“确认”后,开通“认证服务”。
图8 检索认证服务,并开通认证服务
图9 创建新应用成功
3.开通并配置云数据库
返回AGC 控制台,如图10所示,选择"云数据库":
图10 AGC 控制台
在AGC 控制台中,选择“云数据库”,进入图11所示的云数据库页面:
图11 云数据库
在云数据库页面中,选择“立即开通”。为指定的应用设置数据处理的位置。
图12 配置数据处理位置
配置云数据库所在的地理位置,此处配置为“中国”,设为默认位置,点击“确定”,进入“云数据库 for Object"。
图13 云数据库 for Object
点击”新建“,新建数据对象类型,如图14所示。
图14 配置数据对象类型名
然后分别依次配置数据对象类型的“字段”,“索引”和“数据权限”。
图15配置数据对象字段
图16配置索引
图17 配置数据权限
为了后续的操作方便,此处将所有的权限进行勾选。配置数据对象完毕后,继续执行导出数据类型对象的操作,如图18所示:
图18 数据类型对象
分别导出json格式文件和js格式文件。
图19 导出json格式文件
图20 导出js格式文件
导出的文件是一个压缩包,压缩包内包含一个js文件。将压缩包解压后的js文件(此处是MedalInfo.js)暂时保存起来,以备后续使用。此处导出的json文件和js文件均可以为后续的开发提供支持。
然后,设置数据对象类型(相当于数据表)的存储区。点击“新增”
图21 进入存储区
图22 配置存储区
图23 进入存储的数据
点击“新增”,进入数据的配置界面,如图24所示。
图24 新增数据
这种一个一个数据输入的方式非常繁琐,也可以直接批量导入数据。
图25 选择要导入文件操作
图26 选择要导入的文件
导入的文件格式是JSON形式,类似如下所示:
{
"cloudDBZoneName": "MedalZone",
"objectTypeName": "MedalInfo",
"objects": [
{
"areaId": "CHN",
"areaName": "中国",
"goldMedal": 40,
"silverMedal": 27,
"bronzeMedal": 24,
"areaIcon": "https://gstatic.olympics.com/s1/t_original/static/noc/oly/3x2/180x120/CHN.png"
},
{
"areaId": "USA",
"areaName": "美国",
"goldMedal": 40,
"silverMedal": 44,
"bronzeMedal": 42,
"areaIcon": "https://gstatic.olympics.com/s1/t_original/static/noc/oly/3x2/180x120/USA.png"
},
//...更多的记录略
}
此处:
“cloudDBZoneName”: “MedalZone”:表示存储区,与设置的数据类型的存储区名一致。
“objectTypeName”: “MedalInfo”:表示数据类型名称,与定义的数据类型名一致。
"objects"表示的是存储的数据,采用json数组的形式。
可以点击“查询”,可以检索的所有的数据,如图27所示。
图27 检索所有的数据
返回AGC 控制的常规页面,如图28所示:
图28 常规页面
在该页面中下载下载最新的配置文件“agconnect-service.json”,为后续的移动开发提供支持。
三、开发移动应用
启动DevEco Studio 3.1.0版本,新建项目如下所示:
图28 创建项目
其中,包名必须与AGC 控制台创建应用的包名一致。
1.配置相关的文件
将下载的配置文件"agconnect-services.json"文件复制到resources/rawfile目录中,如图29所示:
图29 复制agconnect-services.json文件到rawfile目录
配置当前模块的module.json5文件,增加互联网访问权限的内容,代码片段如下所示:
图30 module.json5增加互联网访问权限
"requestPermissions": [
{
"name": "ohos.permission.INTERNET"
}
]
打开DevEco Studio 3.1.0 应用级oh-package.json5文件,在oh-package.json5文件里面添加SDK依赖,添加SDK依赖完成后,点击右上方“Sync Now”同步。
{
"name": "entry",
"version": "1.0.0",
"description": "Please describe the basic information.",
"main": "",
"author": "",
"license": "",
"dependencies": {
"@hw-agconnect/database-ohos":"^1.1.2",
"@hw-agconnect/core-ohos": "^1.1.2"
}
}
2.定义数据类型
在ets目录下创建一个model目录,将下载的数据类型的js文件,复制到model目录。另外,在model目录中新建一个app-schema.json文件,将上述导出的数据类型的json文件,复制粘贴到app-schema.json文件中。
图31 定义数据类型
3. 定义访问云数据库的服务
创建service目录,在该目录下定义一个typescript文件CloudDBService.ts文件,定义执行对云数据库操作的各种业务处理,具体代码如下:
import { AGConnectCloudDB, CloudDBZoneConfig, CloudDBZone, CloudDBZoneQuery } from '@hw-agconnect/database-ohos';
// @ts-ignore
import schema from '../model/app-schema.json';
import { AGCRoutePolicy } from "@hw-agconnect/core-ohos";
import { MedalInfo } from '../model/MedalInfo';
export class CloudDBService {
//必须与AGC控制台指定云数据库的存储区名一致
private static readonly ZONE_NAME = 'MedalZone';
private static cloudDB: AGConnectCloudDB;
private static cloudDBZone: CloudDBZone;
private static isInit: boolean;
/**
* 初始化
*
* @param context context
* @returns 是否初始化成功
*/
public static async init(context: any): Promise<boolean> {
if (this.isInit) {
return;
}
try {
// 初始化并获取AGConnectCloudDB
this.cloudDB = await AGConnectCloudDB.getInstance({
context: context, // 在eTS页面中通过全局方法getContext(this)获取当前页面关联的Context
agcRoutePolicy: AGCRoutePolicy.CHINA, // 数据处理位置,CHINA-中国区,GERMANY-德国,RUSSIA-俄罗斯,SINGAPORE-新加坡
objectTypeInfo: schema
});
// 打开存储区
await this.openZone(this.ZONE_NAME);
this.isInit = true;
} catch (err) {
console.error(`初始化失败,因为:${JSON.stringify(err)}`)
}
return Promise.resolve(this.isInit);
}
/**
* 打开存储区
*
* @param zoneName 存储区名称
* @returns
*/
private static async openZone(zoneName: string): Promise<void> {
if (this.cloudDBZone) {
console.log('zone has been closed.')
return;
}
try {
const cloudDBZoneConfig = new CloudDBZoneConfig(zoneName);
this.cloudDBZone = await this.cloudDB.openCloudDBZone(cloudDBZoneConfig);
console.log('[openZone] open zone success.')
} catch (e) {
console.error('[openZone] open zone failed. e:' + e);
console.error(JSON.stringify(e));
}
}
/**
* 查询并排序数据
* * @param queryStr 查询条件,可为空
* @returns 查询数据结果数组
*/
public static async queryRecord(queryStr?: string): Promise<Array<MedalInfo>> {
try {
//按照金牌的个数进行排序
const query = CloudDBZoneQuery.where(MedalInfo).orderByDesc("goldMedal");
if (queryStr) {
query.contains('areaName', queryStr);
}
const result = await this.cloudDBZone.executeQuery(query);
return result.getSnapshotObjects();
} catch (e) {
console.error('[queryRecord] queryRecord failed. e:' + JSON.stringify(e));
return [];
}
}
}
4. 定义Index.ets的UI页面
import { MedalInfo } from '../model/MedalInfo'
import { CloudDBService } from '../service/CloudDBService'
@Entry
@Component
struct Index {
@State medalLst:Array<MedalInfo> = []
onPageShow(){
this.queryAll()
}
build() {
Column(){
Row({space:10}){
Text("")
.width(60)
.height(20)
Text("国家/地区")
.width(60)
.height(20)
Text("金牌")
.width(60)
.height(20)
Text("银牌")
.width(60)
.height(20)
Text("铜牌")
.width(60)
.height(20)
}
List(){
ForEach(this.medalLst,(item:MedalInfo)=>{
ListItem(){
Row({space:10}){
Image(`${item.areaIcon}`)
.width(60)
.height(40)
Text(`${item.areaName}`)
.width(60)
.height(40)
Text(`${item.goldMedal}枚`)
.width(60)
.height(40)
Text(`${item.silverMedal}枚`)
.width(60)
.height(40)
Text(`${item.bronzeMedal}枚`)
.width(60)
.height(40)
}
}
.width("100%")
.margin(10)
})
}
}.width("100%")
.height("100%")
}
async queryAll(){
try{
// 初始化
await CloudDBService.init(getContext(this));
// 查询数据并展示
this.medalLst = await CloudDBService.queryRecord();
}catch(err){
console.error(`出现错误:${JSON.stringify(err)}`)
}
}
}
5.运行结果
图32 最后的运行结果
后记
这篇笔记是比较艰难的一篇。一方面是在云数据库的配置,整个详细过程需要截取大量的图片;另外一方面,就是测试了若干版本的DevEco Studio,以及SDK API 12的版本测试云数据库,一直不能在模拟机中测试通过。直到看到这一帖子,让我不再纠结。因此,退而求其次,采用SDK API 9的版本。希望,过段时间,再出一篇SDK API 12版本云数据库处理的笔记。
参考文献
1.AppGallery Connect帮助中心 https://developer.huawei.com/consumer/cn/doc/app/agc-help-getstarted-0000001100316670
2.使用云数据库组件 https://developer.huawei.com/consumer/cn/doc/AppGallery-connect-Guides/agc-clouddb-component-harmonyosts-0000001623209420