封装好的代码,代码量很少但调用很方便,有完整的事件监听,将它保存为 saveFileUtil.js
其实代码还是偷懒了,比如 wx.downloadFile 里面只有 success 监听,没有 fail,自己改一下吧。
listener.onComplete 其实是绑定在 wx.saveVideoToPhotosAlbum(保存视频到相册,wx.downloadFile 才是下载动作)
其实你也可以让 fail 走 listener.onComplete 监听,直接 fail: listener.onComplete,
function downloadFile(url, listener) {
listener.onStart && listener.onStart()
const task = wx.downloadFile({
url,
success: res => {
if (res.statusCode == 200) {
wx.saveVideoToPhotosAlbum({
filePath: res.tempFilePath,
success: listener.onComplete,
fail: listener.onComplete
})
}
},
// fail: listener.onComplete,
})
listener.onProgress && task.onProgressUpdate(listener.onProgress)
}
exports.downloadFile = downloadFile
以下是调用
const downFileUtil = require('saveFileUtil') // 注意文件实际的路径
@param videoUrl 视频地址
@param listener 事件监听,object
downFileUtil.downloadFile(videoUrl, {
onStart() {
// 开始下载
},
onComplete(res) {
// 下载完成或者失败都会调用这里
console.log(res)
},
onProgress(res) {
// 进度变化,建议有,体验更好
// 这里调用原生的进度提示,你可以自己实现
wx.showLoading({
title: res.progress + "%"
})
}
})
当然,不只是保存视频,如果是保存图片,或者下载其它文件都可以,重新封装了以下
function downloadFile(url, listener) {
return new Promise((resolve, reject) =>{
listener.onStart && listener.onStart()
const task = wx.downloadFile({
url,
success: res => {
if (res.statusCode == 200) {
resolve(res)
}
}
})
listener.onProgress && task.onProgressUpdate(listener.onProgress)
})
}
function downloadVideo(url, listener) {
downloadFile(url, listener).then(res => {
wx.saveVideoToPhotosAlbum({
filePath: res.tempFilePath,
success: listener.onComplete,
fail: listener.onComplete
})
})
}
function downloadImage(url, listener) {
downloadFile(url, listener).then(res => {
wx.saveImageToPhotosAlbum({
filePath: res.tempFilePath,
success: listener.onComplete,
fail: listener.onComplete
})
})
}
function downloadVoice(url) {
}
module.exports = {
downloadFile,
downloadVideo,
downloadImage,
downloadVoice,
}
调用演示。下载视频图片和上面演示代码一样,但下载是用的是 downloadVideo 下载图片用的 downloadImage,下载其它文件如下使用
const downFileUtil = require('saveFileUtil')
// 下载视频
downFileUtil.downloadVideo(videoUrl, {
onStart() {
// 开始下载
},
onComplete(res) {
// 下载动作完成
},
onProgress(res) {
// 进度变化
}
})
// 下载图片
downFileUtil.downloadImage(imageUrl, {
onStart() {
// 开始下载
},
onComplete(res) {
// 下载动作完成
},
onProgress(res) {
// 进度变化
}
})
// 下载其它文件
downFileUtil.downloadFile(url, {
onStart() {
// 开始下载
},
onComplete(res) {
// 下载动作完成
// 下载文件此方法作废
},
onProgress(res) {
// 进度变化
}
}).then(res => {
// 下载动作完成
// TODO...
})