uniapp小程序下载图片

实现图片下载功能
在 UniApp 小程序中实现图片下载功能可以通过 uni.downloadFile API 来完成。此方法用于从网络上下载资源到本地，适用于各种类型的文件，包括但不限于图片。
当需要提供用户一个简单的方式保存图片至相册时，除了下载外还需要调用 uni.saveImageToPhotosAlbum 方法来处理权限请求并将图片存储于用户的设备照片库内[^4]。
下面是一个完整的例子展示了如何创建一个按钮触发事件来进行图片的下载操作：
methods: {
downloadImage() {
const that = this;
uni.downloadFile({
url: 'https://example.com/path/to/image.jpg', // 图片链接地址
success(res) {
if (res.statusCode === 200) {
console.log('Download Success');

// 请求保存图片到相册授权
uni.authorize({
scope: 'scope.writePhotosAlbum',
success() {
// 用户同意授权后执行保存动作
uni.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success(saveRes) {
console.log('Save Image To Album Success');
uni.showToast({title:'已保存'});
},
fail(err){
console.error('Failed to save image:', err);
}
});
},
fail(authErr) {
console.warn('User denied authorization or other errors occurred.');

// 如果拒绝授予权限，则提示引导手动开启设置页
uni.showModal({
content:"您未授予访问相册权限",
confirmText:"去设置",
cancelText:"取消",
success(modalRes){
if(modalRes.confirm){
uni.openSetting();
}else{
console.log("User cancelled");
}
}
})
}
});
} else {
console.error('Failed to download file with status code:', res.statusCode);
}
},
fail(downloadErr) {
console.error('Error downloading file:', downloadErr);
}
});
}
}
登录后复制
上述代码片段定义了一个名为 downloadImage 的函数，它会尝试先下载指定 URL 地址下的图片，并在其成功之后进一步询问用户是否允许应用写入其手机的照片库；一旦获得许可便立即把临时缓存中的图像数据永久储存下来并通知用户已完成保存过程。