微信小程序文件下载 wx.downloadFile()、 wx.saveFile() 和 wx.openDocument()

时间:2024-02-18 20:51:27

  最近编写了一个小程序,其中涉及到了文件下载功能,通过微信官方文档查得可以使用 API 中的 wx.saveFile(),官方文档中的例子是这样的:

wx.saveFile({
    tempFilePath: tempFilePaths[0],
    success (res) {
        const savedFilePath = res.savedFilePath
    }
})

  

  等到我调用时发现,一直没反应,我是这样写的:

wx.saveFile({
    tempFilePath: fileUrl,
    success (res) {
        Toast(\'下载成功\')
    }
})

  

  后又添加了 fail 回调函数验证才知道下载失败了:

wx.saveFile({
    tempFilePath: fileUrl,
    success (res) {
        Toast(\'下载成功\')
    },
    fail(error){
        Toast(\'下载失败\')
    }
})

  

  这样我就关注到官方文档有这样一行:

 

 

  接下来就考虑是路径出了问题,那么这个临时路径是什么呢?在接下来的查询中我得知,得要先通过 wx.downloadFile 生成个本地的临时路径才行,就有了下面的代码:

wx.downloadFile({
    url: fileUrl,
    success (res) {
        wx.saveFile({
            tempFilePath: res.tempFilePath,
            success (res) {
                Toast(\'下载成功\')
            },
            fail(error){
                Toast(\'下载失败\')
            }
        })
    }
})

  

  这样就可以下载成功了!!!但是,这就又发现了一个问题,下载好的文档不知道去哪里查找。

  下面我们就换一种方式,使用 wx.OpenDocument() 直接将下载好的文件打开,就能找到位置了:

mpvue.downloadFile({
    url: this.fileUrl,
    success (res) {
        mpvue.openDocument({
            filePath: res.tempFilePath,
            success(){
                Toast(\'文件打开成功\')
            }
        })
    }
})

  

  通过这种直接打开文件的方式,我们就可以找到文件位置了。