HarmonyOS鸿蒙Next中如何将AGC云侧的ByteArray数据类型转换成Base64并在前端显示图片？

HarmonyOS鸿蒙Next中如何将AGC云侧的ByteArray数据类型转换成Base64并在前端显示图片？ 查看了云数据库的数据库模型介绍，请问怎么从AGC云侧拿到的数据类型ByteArray怎么转换成Base64到前端显示图片呢?

云侧数据表映射成端侧的数据模型如下代码：

import { cloudDatabase } from '@kit.CloudFoundationKit';

class UserPost extends cloudDatabase.DatabaseObject{
  id: number | undefined;
  uid: string | undefined;
  titlePic: Uint8Array | undefined;
  titleName: string | undefined;
  titleTime: Date | undefined;
  type: string | undefined;
  title: string | undefined;
  pic: Uint8Array  | undefined;

  naturalbase_ClassName(): string {
    return "UserPost";
  }
}

export { UserPost };

下面是数据库部分请求代码如下，能拿到云数据库的ByteArray字段的数据，但是不知道转换是否正确，总是显示不了图片：


更多关于HarmonyOS鸿蒙Next中如何将AGC云侧的ByteArray数据类型转换成Base64并在前端显示图片？的实战教程也可以访问 https://www.itying.com/category-93-b0.html

1 回复

更多关于HarmonyOS鸿蒙Next中如何将AGC云侧的ByteArray数据类型转换成Base64并在前端显示图片？的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next中，将AGC云侧的ByteArray数据类型转换成Base64并在前端显示图片，可以通过以下步骤实现：

  1. 获取ByteArray数据：首先从AGC云侧获取到ByteArray格式的图片数据。

  2. 转换为Base64：使用鸿蒙提供的工具类将ByteArray数据转换为Base64字符串。可以使用Base64工具类进行转换，具体代码如下：

    import { Base64 } from '[@ohos](/user/ohos).base';
let base64String = Base64.encode(byteArray);

  3. 前端显示图片：在鸿蒙的前端页面中，使用<img>标签的src属性来显示Base64格式的图片。具体代码如下：

    <img src="data:image/png;base64,{base64String}" />

其中，{base64String}是步骤2中生成的Base64字符串。

通过以上步骤，即可实现将AGC云侧的ByteArray数据类型转换成Base64并在前端显示图片。

回到顶部