HarmonyOS 鸿蒙Next RN端react-native-image-picker获取图片只能获取uri无法获取base64

发布于 1周前 作者 zlyuanteng 来自 鸿蒙OS

HarmonyOS 鸿蒙Next RN端react-native-image-picker获取图片只能获取uri无法获取base64

RN端鸿蒙的react-native-image-picker,获取图片只能获取uri,无法获取base64。有什么办法获取base64值吗

2 回复

可以参考链接:https://developer.huawei.com/consumer/cn/doc/harmonyos-faqs-V5/faqs-image-kit-0000001816452293-V5#section871313119219

import { image } from '@kit.ImageKit';

import { buffer } from '@kit.ArkTS';

@Entry

@Component

struct Index {

  @State message: string = 'PixelMapToBase64';

  @State base64: string = '';

  build() {

    Row() {

      Column() {

        Text(this.message)

          .fontSize(50)

          .fontWeight(FontWeight.Bold)

          .onClick(async () => {

            let resourceManager = getContext(this).resourceManager

            let imageArray = await resourceManager.getMediaContent($r('app.media.sample7'));

            let pixelBuffer = new Uint8Array(imageArray).buffer as Object as ArrayBuffer;

            let imageResource = image.createImageSource(pixelBuffer);

            let opts: image.DecodingOptions = { editable: true }

            let pixelMap = await imageResource.createPixelMap(opts);

            // 转换成base64

            const imagePackerApi: image.ImagePacker = image.createImagePacker();

            let packOpts: image.PackingOption = { format: 'image/jpeg', quality: 100 };

            imagePackerApi.packing(pixelMap, packOpts).then((data: ArrayBuffer) => {

              let buf: buffer.Buffer = buffer.from(data);

              this.base64 = 'data:image/jpeg;base64,' + buf.toString('base64', 0, buf.length);

              console.info('base64: ' + this.base64);

            })

          })

        Image(this.base64)

          .width(200).height(200).margin(15)

      }

      .width('100%')

    }

    .height('100%')

  }

}

更多关于HarmonyOS 鸿蒙Next RN端react-native-image-picker获取图片只能获取uri无法获取base64的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS鸿蒙Next RN端,react-native-image-picker库默认只提供图片的URI(统一资源标识符),而不直接提供Base64编码的图片数据。这是因为该库的设计初衷是为了在不同平台上提供一致的接口,而各平台对图片数据的处理方式有所不同。

要在HarmonyOS上获取图片的Base64编码,你可以采取以下步骤:

  1. 使用react-native-image-picker获取图片的URI。
  2. 通过HarmonyOS的原生模块或API,读取该URI指向的图片文件。
  3. 将读取到的图片数据转换为Base64编码。

由于HarmonyOS的API与Android和iOS有所不同,你可能需要编写或引用一个HarmonyOS原生模块来完成文件读取和Base64编码的工作。这个原生模块可以与你的React Native代码进行交互,从而实现对图片Base64编码的获取。

请注意,这个过程可能涉及到对HarmonyOS文件系统的访问权限,因此确保你的应用已经正确声明了相关的权限。

如果问题依旧没法解决请联系官网客服,官网地址是:https://www.itying.com/category-93-b0.html

回到顶部