看标题,大家就知道了,上次发布的文章把我们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媒体下载保存到相册
本文转自枫瑞博客