开发微信小程序,将图片下载到相册的方法,saveImageToPhotosAlbum怎么用

在开发微信小程序的时候,经常能看到小程序里面有下载按钮,如何将小程序中的图片下载到手机相册中那,下面给大家说一下怎么做,代码如何去写。

一、到微信小程序后台开启"用户隐私保护指引"

1.进入小程序后台,侧拉拉到"设置"这一项,再找到"服务内容声明",更新"用户隐私保护",如下图所示:

2.按照如下所示的指引填写即可


注意: 如果不更新隐私保护,是无法获取到存储权限的,这个必须要开启才行。

二、代码实现

javascript 复制代码
//点击下载
const clickDownload = async () => {
	try {
		uni.showLoading({
			title: "下载中...",
			mask: true
		})
		let res = await downPushData();
		if(res.errCode != 0) throw res;			
		// #ifdef MP || APP				
		uni.getImageInfo({
			src: crtWallInfo.value.picurl,
			success: function(res) {					
				var path = res.path;
				uni.saveImageToPhotosAlbum({
					filePath: path,
					success(res) {
						uni.hideLoading();
						uni.showToast({
							title: '保存成功,可去相册查看',
							icon: "none",
							duration:2000
						})							
					},
					fail(err) {
						uni.hideLoading();
						if(err.errMsg == 'saveImageToPhotosAlbum:fail cancel'){
							uni.showToast({
								title: '保存失败,请重新点击下载',
								icon: "none"
							})
							return;
						}							
						uni.showModal({
							title: '提示',
							content: '需要您授权保存相册',
							showCancel: false,
							success:res=>{
								if(res.confirm){
									uni.openSetting({
										success(settingdata) {
											if (settingdata.authSetting['scope.writePhotosAlbum']) {
												uni.showToast({
													title:'获取权限成功',
													icon:"none"
												})													
											}else{
												uni.showToast({
													title:'获取权限失败',
													icon:"none"
												})													
											}
											
										}
									})
								}
							}
						})
					},
					complete(err) {
						
					}
				})
			}
		})
		// #endif

		// #ifdef H5
		//调用预览图片的方法		
		uni.previewImage({
			urls: [crtWallInfo.value.picurl],
			current: 0, //点击图片传过来的下标
			success: (res) => {
				uni.showToast({
					title: '请长按保存',
					icon: "none",
					duration: 2000
				})
			}
		})
		// #endif

	} catch (err) {			
		console.log(err);
		uni.hideLoading();
	}
}
相关推荐
2501_9159184118 小时前
如何在iPad上找到并打开文件夹的完整指南
android·ios·小程序·uni-app·iphone·webview·ipad
shejizuopin19 小时前
基于Spring Boot+小程序的非遗科普平台设计与实现(毕业论文)
spring boot·后端·小程序·毕业设计·论文·毕业论文·非遗科普平台设计与实现
StarChainTech1 天前
一站式租车平台革新:从信用免押到全流程可视化管理的技术实践
大数据·人工智能·微信小程序·小程序·软件需求
CHU7290351 天前
一番赏盲盒抽卡机小程序:探索惊喜与互动的多元功能体验
小程序
换日线°1 天前
微信小程序对接位置服务(腾讯、高德)完成路径规划
前端·微信小程序·vue
2501_915918411 天前
Wireshark、Fiddler、Charles抓包工具详细使用指南
android·ios·小程序·https·uni-app·iphone·webview
苏苏哇哈哈1 天前
微信小程序实现仿腾讯视频小程序首页圆角扩散轮播组件
微信小程序·小程序·轮播图
code袁1 天前
基于微信小程序的宿舍维修小程序的设计与实现
微信小程序·小程序·毕业设计·springboot·notepad++·宿舍维修小程序
说私域1 天前
AI智能客服S2B2C商城小程序在客户服务场景中的应用与价值——以顾客反馈处理为例
人工智能·小程序·流量运营·私域运营
黄菊华老师1 天前
微信小程序毕业设计:渔具商城小程序毕设源码作品和开题报告
微信小程序·小程序·课程设计·渔具商城小程序