uniapp-实现一个简单的下载任意类型文件功能

我正在参加「掘金·启航计划」

简单介绍

公司老项目需要增加文件下载功能,因为是后续增加的,所以能实现就行.

下载 wx.downloadFile

uni.downloadFile({
    url: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3',
    success: (res) => {}, //下载成功
    fail: () => {},
    complete: () => {}
})

如果下载地址能用的情况下,你能看到以下的返回参数

tempFilePath便是临时保存的目录

可在微信开发者工具中打开:详情->基本信息->文件系统.找到根目录,里面的tmp文件夹内就是刚才下载文件的地方

打开tmp文件夹就能看到下载的文件了

这样一个简单的下载已经完成了

指定文件位置和文件名字

如果需要指定下载的名字则需要用的参数filePath

filePath	string		否	指定文件下载后存储的路径 (本地路径)

uni.downloadFile({
    url: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3',
    filePath: `${wx.env.USER_DATA_PATH}/Video/ji.mp3`,
    success: (res) => {}, //下载成功
    fail: () => {},
    complete: () => {}
})

如果要使用参数filePath指定目录的话,需要用到wx.env.USER_DATA_PATH

关于wx.env.USER_DATA_PATH的文档

• 本地用户文件 本地用户文件是从 1.7.0 版本开始新增的概念。我们提供了一个用户文件目录给开发者，开发者对这个目录有完全自由的读写权限。通过 wx.env.USER_DATA_PATH 可以获取到这个目录的路径。

• 清理策略 :本地缓存文件和本地用户文件的清理时机跟代码包一样，只有在代码包被清理的时会被清理。

如果只是做到这一步还是不够的,注意我们要保存的文件目录为根目录/Video/ji.mp3,只是第一次下载的的用户的手机目录当然不会有Video这个文件夹,我们还需要一个判断

getDownLoadFilePath() {
    return new Promise((resolve, reject)=> {
        let cachePath = `${wx.env.USER_DATA_PATH}/Video/`
        let fm = wx.getFileSystemManager()
        try {
            // 访问成功则存在
            fm.accessSync(cachePath)
        } catch (error) {
            // 不存在则新建
            fm.mkdirSync(cachePath, true)
        }
        resolve(cachePath)
    });
},

然后再使用该代码

const path = this.getDownLoadFilePath()
uni.downloadFile({
    url: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-hello-uniapp/2cc220e0-c27a-11ea-9dfb-6da8e309e0d8.mp3',
    filePath: `${path}/ji.mp3`,
    success: (res) => {}, //下载成功
    fail: () => {},
    complete: () => {}
})

这样就不管你下载到那个目录都能成功了

手机的目录:/Android/data/com.tencent.mm/MicroMsg/wxafiles/wxanewfiles/{{user哈希值}}/Video

虽然有点麻烦,但是小程序能做的就这些了,我已经尽力了,明明有网页端,电脑端不用,非要用小程序就只能这样了