鸿蒙 如何将base64的图片保存到相册

把一个base64图片 保存到鸿蒙手机 相册中怎么实现呢?

下面有2中方法

方案一:可以通过安全控件「保存控件(SaveButton)」实现。该控件对应媒体库写入特权。应用集成保存控件后,用户点击该控件,应用会获取10秒内单次访问媒体库特权接口的授权。

参考代码:

import { photoAccessHelper } from '@kit.MediaLibraryKit';
import fs from '@ohos.file.fs';
import { http } from '@kit.NetworkKit';
import { promptAction } from '@kit.ArkUI';

/** * 参考资料: * https://developer.huawei.com/consumer/cn/doc/harmonyos-guides-V5/photoaccesshelper-resource-guidelines-0000001774280306-V5#ZH-CN_TOPIC_0000001881258417__使用安全控件创建媒体资源 */
@Entry
@Component
struct Index {
  @State message: string = 'Hello World'
  @State saveButtonOptions: SaveButtonOptions = {
    icon: SaveIconStyle.FULL_FILLED,
    text: SaveDescription.SAVE_IMAGE,
    buttonType: ButtonType.Capsule
  }

  // 设置安全控件按钮属性
  build() {
    Row() {
      Column() {
        Text(this.message).fontSize(50).fontWeight(FontWeight.Bold)
        SaveButton(this.saveButtonOptions)// 创建安全控件按钮
          .onClick(async (event, result: SaveButtonOnClickResult) => {
            if (result == SaveButtonOnClickResult.SUCCESS) {
              let context = getContext();
              //获取相册管理模块的实例,用于访问和修改相册中的媒体文件 let phAccessHelper = photoAccessHelper.getPhotoAccessHelper(context); 
              // onClick触发后10秒内通过createAsset接口创建图片文件,10秒后createAsset权限收回
              let uri = await phAccessHelper.createAsset(photoAccessHelper.PhotoType.IMAGE, 'jpg');
              // 创建媒体文件
              console.info('createAsset successfully, uri: ' + uri);
              let file = fs.openSync(uri, fs.OpenMode.READ_WRITE || fs.OpenMode.CREATE);
              let totalSize = 0;
              let httpRequest = http.createHttp();
              httpRequest.on("dataReceive", (data: ArrayBuffer) => {
                let writeLen = fs.writeSync(file.fd, data);
                totalSize = totalSize + writeLen;
              });
              httpRequest.requestInStream('https://developer.huawei.com/allianceCmsResource/resource/HUAWEI_Developer_VUE/images/homeNew/next- pc.png',
                { method: http.RequestMethod.GET, connectTimeout: 3000, }, httpCode => {
                  console.info('requestInStream HTTP CODE is', httpCode)
                })
              httpRequest.on("dataEnd", () => {
                fs.close(file);
                promptAction.showDialog({ title: "下载图片结束,并保存至相册", message: `图片大小:${totalSize}字节` })
              })
            } else {
              console.error('SaveButtonOnClickResult create asset failed');
            }
          })
      }
      .width('100%')
    }
    .height('100%')
  }
}

方案二:通过申请ACL权限。需要在module.json5文件中配置ohos.permission.WRITE_IMAGEVIDEO权限。类似这样: { // 允许修改用户公共目录的图片或视频文件。 "name": "ohos.permission.WRITE_IMAGEVIDEO", "reason": "$string:internet_permission_reason", "usedScene": { "when": "always" } }

import { abilityAccessCtrl, common } from '@kit.AbilityKit';
 import { photoAccessHelper } from '@kit.MediaLibraryKit';
 import fs from '@ohos.file.fs';
 import { http } from '@kit.NetworkKit';
 import { promptAction } from '@kit.ArkUI';
 @Entry
 @Component struct Index {
 @State message: string = 'Hello World'
 private appContext: common.Context = getContext(this);
 private atManager = abilityAccessCtrl.createAtManager();
  
 build() {
    Row() {
      Column() {
        Text(this.message)
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
       Button("保存图片")
       .margin({ top: 10 })
       .onClick(async (event: ClickEvent) => { 
           //申请权限并保存图片到图库
         try { 
         //申请相册管理模块权限'ohos.permission.WRITE_IMAGEVIDEO' 
          this.atManager.requestPermissionsFromUser(this.appContext, [ 'ohos.permission.WRITE_IMAGEVIDEO' ]).then(async () => { 
         //权限申请成功,保存到图库
         let context = getContext();
         //获取相册管理模块的实例,用于访问和修改相册中的媒体文件
         let phAccessHelper = photoAccessHelper.getPhotoAccessHelper(context); 
         // onClick触发后10秒内通过createAsset接口创建图片文件,10秒后createAsset权限收回
         let uri = await phAccessHelper.createAsset(photoAccessHelper.PhotoType.IMAGE, 'jpg');
        // 创建媒体文件
        console.info('createAsset successfully, uri: ' + uri);
        let file = fs.openSync(uri, fs.OpenMode.READ_WRITE || fs.OpenMode.CREATE);
       let totalSize = 0;
       let httpRequest = http.createHttp();
        httpRequest.on("dataReceive", (data: ArrayBuffer) => {
       let writeLen = fs.writeSync(file.fd, data); 
       totalSize = totalSize + writeLen; });
       httpRequest.requestInStream('https://developer.huawei.com/allianceCmsResource/resource/HUAWEI_Developer_VUE/images/homeNew/next- pc.png',
        { method: http.RequestMethod.GET, connectTimeout: 3000, }, httpCode => {
          console.info('requestInStream HTTP CODE is', httpCode) })
           httpRequest.on("dataEnd", () => { 
           fs.close(file);
         promptAction.showDialog({ title: "下载图片结束,并保存至相册", message: `图片大小:${totalSize}字节` }) }) }) 
           } catch (err) { 
             console.error(`requestPermissionsFromUser call Failed! error: ${err.code}`); } }) }
           .width('100%') 
          }
        .height('100%') 
     } 
}

相关推荐

  1. 鸿蒙 如何base64图片保存相册

    2024-06-15 14:30:03       9 阅读
  2. flutter base64图片保存相册

    2024-06-15 14:30:03       41 阅读
  3. base64格式图片canvas上(js和vue两种)

    2024-06-15 14:30:03       20 阅读
  4. uniapp图片地址base64格式相互转换

    2024-06-15 14:30:03       14 阅读
  5. uniapp微信小程序下载保存图片本地,base64

    2024-06-15 14:30:03       48 阅读
  6. html字符串中base64图片转换成file并上传

    2024-06-15 14:30:03       35 阅读

最近更新

  1. TCP协议是安全的吗?

    2024-06-15 14:30:03       19 阅读
  2. 阿里云服务器执行yum,一直下载docker-ce-stable失败

    2024-06-15 14:30:03       19 阅读
  3. 【Python教程】压缩PDF文件大小

    2024-06-15 14:30:03       19 阅读
  4. 通过文章id递归查询所有评论(xml)

    2024-06-15 14:30:03       20 阅读

热门阅读

  1. blender

    blender

    2024-06-15 14:30:03      5 阅读
  2. 难or易?c++

    2024-06-15 14:30:03       7 阅读
  3. web前端黑马下载:探索学习资源的海洋

    2024-06-15 14:30:03       7 阅读
  4. Gobject tutorial 二

    2024-06-15 14:30:03       4 阅读
  5. 刷题理解JVM内部的数据存储

    2024-06-15 14:30:03       8 阅读
  6. C 语言实例 - 输出数组

    2024-06-15 14:30:03       7 阅读
  7. c语言中的gets()函数记录

    2024-06-15 14:30:03       10 阅读
  8. 八、BGP

    八、BGP

    2024-06-15 14:30:03      5 阅读
  9. TypeScript中的Symbol,确实唯一。。。

    2024-06-15 14:30:03       6 阅读
  10. 认识一些分布-关于极值点分布的一些知识

    2024-06-15 14:30:03       7 阅读
  11. 把本机的bash构建到docker镜像里面

    2024-06-15 14:30:03       5 阅读
  12. AbpVnext中的DDD指南之聚合根

    2024-06-15 14:30:03       10 阅读
  13. grep命令知多少

    2024-06-15 14:30:03       6 阅读