HarmonyOS 用picker选择图片后压缩并转成base64字符串

关于图片压缩可以使用ImagePacker，参考官方文档：https://developer.huawei.com/consumer/cn/doc/harmonyos-references-V5/js-apis-image-V5

参考以下链接实现： https://gitee.com/harmonyos-cases/cases/blob/master/CommonAppDevelopment/feature/imagecompression/src/main/ets/view/ImageCompression.ets

转成base64可以参考如下demo：

import fs from '@ohos.file.fs';
import buffer from '@ohos.buffer';

/**
 * 图片转base64
 *
 * @param filePath 文件路径
 * @param bufferLen
 * @returns base64
 */
export function imageToBase64(filePath: string, bufferLen = 409600) {
  try {
    const file = fs.openSync(filePath, fs.OpenMode.READ_WRITE);
    const arrayBuffer = new ArrayBuffer(bufferLen);
    const readLen = fs.readSync(file.fd, arrayBuffer);
    const buf = buffer.from(arrayBuffer, 0, readLen);
    const base64 = buf.toString('base64');
    fs.closeSync(file);
    return base64;
  } catch (e) {
    console.error('file err:', JSON.stringify(e));
    return ''
  }
}
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.

根据picker返回uri创建imagesource:

Image(this.pixelMap).width(200).height(200)
Button('打开相册')
  .onClick(() => {
    //创建图库选择器对象实例
    const photoViewPicker =new photoAccessHelper.PhotoViewPicker();
    //调用select()接口拉起图库界面进行文件选择,文件选择成功后，返回PhotoSelectResult结果集
    photoViewPicker.select().then(async (photoSelectResult: picker.PhotoSelectResult) => {
      //用一个全局变量存储返回的uri
      selectUris = photoSelectResult.photoUris;
      console.info('photoViewPicker.select to file succeed and uris are:' + selectUris);
    }).catch((err: BusinessError) => {
      console.error(`Invoke photoViewPicker.select failed, code is ${err.code}, message is ${err.message}`);
    })
  })
Button('creatPixelMap')
  .margin({ top: 5 })
  .onClick((event: ClickEvent) => {
    //使用fs.openSync接口，通过uri打开这个文件得到fd
    let file = fs.openSync(selectUris[0], fs.OpenMode.READ_ONLY);
    console.info('file fd: ' + file.fd);
    //根据文件fd创建imagSource
    const imageSource: image.ImageSource = image.createImageSource(file.fd);
    //完成后关闭fd
    fs.closeSync(file);

  });

})
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.

imagesource编码，再转base64:

imagePackerApi.packing(this.imagesource, packOpts).then(async (data: ArrayBuffer) => {
  // data 为打包获取到的文件流，写入文件保存即可得到一张图片

  if (data) {

    let buf: buffer.Buffer = buffer.from(data);
    let baseStr: string = buf.toString('base64', 0, buf.length);

    console.log('66666' + JSON.stringify(baseStr))
    //送显
    this.imgStr = "data:image/jpeg;base64," + baseStr;
  }
}).catch((error: BusinessError) => {
  console.error('Failed to pack the image. And the error is: ' + error);
})
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.