uni-app将uni.downloadFile媒体下载保存到相册

看标题，大家就知道了，上次发布的文章把我们uni.downloadFile和uni.saveFile文件保存到手机永久储存，文章末尾也提到了，如果是媒体文件那么我们就保存到相册，是可以直接调用的。如果是自定义文件夹就要调用5+ 的api咯，虽然我也不会哈哈，如果大家看到上次的文章应该就不难了，只是多了一个uni.saveImageToPhotosAlbum

前提引导（建议先看上个文章：uni-app下载文件永久保存uni.downloadFile和uni.saveFile）

1.建立项目

新建项目-选择uni-app （老图哈哈）

 

2.属性说明

uni.saveImageToPhotosAlbum（保存图片到系统相册）

平台差异说明

5+App	H5	微信小程序	支付宝小程序	百度小程序	头条小程序
√	x	√	x	√	√

OBJECT 参数说明

参数名	类型	必填	说明
filePath	String	是	图片文件路径，可以是临时文件路径也可以是永久文件路径，不支持网络图片路径
success	Function	否	接口调用成功的回调函数
fail	Function	否	接口调用失败的回调函数
complete	Function	否	接口调用结束的回调函数（调用成功、失败都会执行）

success 返回参数说明

参数名	类型	说明
errMsg	String	调用结果

好像自动会给相册权限哈

 

官方语法

 success: function (res) {
        uni.saveImageToPhotosAlbum({
            filePath: res.tempFilePaths[0],
            success: function () {
                console.log('save success');
            }
        });
    }

3.结合下载

上文说过，我们uni.downloadFile有一个tempFilePath是临时路径的，所以我们将tempFilePath给filePath就好了

写一个按钮

<button class="mini-btn in-xz" type="default" size="mini" @tap="xiazai">下载</button>

触发的函数

methods: {
	onxiazai() {
		const downloadTask = uni.downloadFile({
			url: 'https://cloud.video.taobao.com//play/u/2384606604/p/2/e/6/t/1/237850440299.mp4',
			success: (res) => {
				if (res.statusCode === 200) {
					uni.showToast({
						title: "视频连接正确",
						icon: "none"
					});
					uni.saveImageToPhotosAlbum({
						filePath: res.tempFilePath,
							success: function() {
								uni.showToast({
									title: "保存成功",
									icon: "none"
							});
						},
						fail: function() {
							uni.showToast({
								title: "保存失败，请稍后重试",
								icon: "none"
							});
						}
					});
				}
			}
		});
				
		downloadTask.onProgressUpdate((res) => {
			console.log('下载进度' + res.progress);
			console.log('已经下载的数据长度' + res.totalBytesWritten);
			console.log('预期需要下载的数据总长度' + res.totalBytesExpectedToWrite);
		});
	}
}

效果图就不发了 自己自行测试，uni-app将uni.downloadFile媒体下载保存到相册

本文转自枫瑞博客