HarmonyOS鸿蒙Next中如何将大于5M的图片地址保存到相册的标准流程代码
HarmonyOS鸿蒙Next中如何将大于5M的图片地址保存到相册的标准流程代码 我们服务端有一个图片地址(比如: https://appdoc.ceic.com/inside/get_file/cid:323408/type:1/id:UV5fUV1CVEg=), 大小大于5M, 想要保存到相册, 标准流程代码应该怎么写? 尽可能不申请受限权限, 附上demo
4 回复
ImageSavePage
import { BuilderNameConstants, RouterModule } from '@ohos/router';
import { TitleBarView } from '../widget/detail/TitleBarView';
import { common } from '@kit.AbilityKit';
import { promptAction } from '@kit.ArkUI';
import { photoAccessHelper } from '@kit.MediaLibraryKit';
import fs from '@ohos/file.fs';
import axios, { AxiosResponse } from '@ohos/axios';
@Component
export struct ImageSavePage {
url?: string
build() {
NavDestination() {
TitleBarView({ title: "" })
Image(this.url)
.objectFit(ImageFit.Auto)
.layoutWeight(1)
.width('100%')
Stack({ alignContent: Alignment.Center }) {
SaveButton({text:SaveDescription.SAVE_IMAGE})
.onClick(async (event: ClickEvent, result: SaveButtonOnClickResult) => {
if (result === SaveButtonOnClickResult.SUCCESS) {
const context: common.UIAbilityContext = getContext(this) as common.UIAbilityContext;
this.saveImage(context, `${this.url}`);
} else {
promptAction.showToast({ message: '设置权限失败!' })
}
})
}
.height(140)
.width('100%')
}
.hideTitleBar(true)
}
async saveImage(context: common.UIAbilityContext, url: string): Promise<void> {
axios.get(url, { responseType: 'array_buffer' }).then(async (res: AxiosResponse<ArrayBuffer>) => {
let helper = photoAccessHelper.getPhotoAccessHelper(context);
let uri = await helper.createAsset(photoAccessHelper.PhotoType.IMAGE, 'jpg');
let file = await fs.open(uri, fs.OpenMode.READ_WRITE | fs.OpenMode.CREATE);
await fs.write(file.fd, res.data);
await fs.close(file.fd);
promptAction.showToast({ message: '已保存至相册!' });
})
}
}
@Builder
export function harBuilder(value: object) {
ImageSavePage({ url: (value as String).toString() })
}
const builderName = BuilderNameConstants.IMAGE_SAVE_PAGE;
if (!RouterModule.getBuilder(builderName)) {
const builder: WrappedBuilder<[object]> = wrapBuilder(harBuilder);
RouterModule.registerBuilder(builderName, builder);
}
参考下我们的下载图片到相册的实现,用安全控件(避免权限申请),把axios换成你们的网络框架即可,不用安全控件的话比较麻烦,要申请写入文件权限,这个是系统权限,申请比较麻烦。
更多关于HarmonyOS鸿蒙Next中如何将大于5M的图片地址保存到相册的标准流程代码的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html
在HarmonyOS鸿蒙Next中,将大于5M的图片地址保存到相册的标准流程代码涉及以下步骤:
- 获取图片数据:首先需要通过网络或其他途径获取图片的数据流。
- 创建临时文件:将图片数据写入临时文件。
- 插入相册:使用
ImageAssetManager
将临时文件插入系统相册。
以下是示例代码:
import fs from '@ohos.file.fs';
import image from '@ohos.multimedia.image';
import mediaLibrary from '@ohos.multimedia.mediaLibrary';
async function saveLargeImageToGallery(imageUrl: string) {
// 1. 获取图片数据
const response = await fetch(imageUrl);
const arrayBuffer = await response.arrayBuffer();
// 2. 创建临时文件
const tempFilePath = '临时文件路径';
fs.writeSync(fs.openSync(tempFilePath, fs.OpenMode.CREATE | fs.OpenMode.READ_WRITE), arrayBuffer);
// 3. 插入相册
const context = getContext(this);
const media = mediaLibrary.getMediaLibrary(context);
const imageAsset = await media.createAsset(mediaLibrary.MediaType.IMAGE, 'image.jpg', tempFilePath);
console.log('图片保存成功,路径:', imageAsset.uri);
}
注意:代码中的临时文件路径
需要替换为实际路径,确保应用有读写权限。
在HarmonyOS鸿蒙Next中,将大于5M的图片地址保存到相册的标准流程代码如下:
- 权限申请:确保在
config.json
中声明了ohos.permission.WRITE_MEDIA
权限。 - 下载图片:使用
[@ohos](/user/ohos).net.http
模块下载图片到应用沙箱目录。 - 保存到相册:使用
[@ohos](/user/ohos).file.fs
模块将图片移动到相册目录(/Pictures
)。 - 通知系统:使用
[@ohos](/user/ohos).mediaLibrary
模块通知系统更新媒体库。
import http from '[@ohos](/user/ohos).net.http';
import fs from '[@ohos](/user/ohos).file.fs';
import mediaLibrary from '[@ohos](/user/ohos).mediaLibrary';
async function downloadAndSaveImage(imageUrl) {
const httpRequest = http.createHttp();
const response = await httpRequest.request(imageUrl);
const filePath = `${fs.getAppDataPath()}/downloaded_image.jpg`;
await fs.writeFile(filePath, response.result);
const media = mediaLibrary.getMediaLibrary();
const fileAsset = await media.createAsset(mediaLibrary.MediaType.IMAGE, 'downloaded_image.jpg', filePath);
console.log('Image saved to gallery:', fileAsset.uri);
}
``
确保处理错误和异常,并根据实际需求调整代码。