VUE前端通过URL下载文件

res.url是一个文件地址
普通文件下载直接window.location.href = res.url即可下载文件
但是pdf文件这样会直接打开预览,无论是用weindow.open()还是 a 标签
使用download.js可以免打开直接弹出下载框

vue使用方法：
首先命令行

npm install downloadjs -S

在需要使用的页面xxx.vue文件的script标签内

import download from 'downloadjs'

在你需要下载的方法内

downloadPdf(){
    download(res.url)
},

如果不喜欢这种方法还可以使用将URL转换为blob地址

let url = res.url;//路径地址
let link = document.createElement('a');
fetch(url).then(res => res.blob()).then(blob => { // 将链接地址字符内容转变成blob地址
    link.href = URL.createObjectURL(blob);
    link.download = res.filename; //文件名
    document.body.appendChild(link);
    link.click()
})

VUE前端通过URL下载文件

已有 3 条评论