js下载文件可以通过a标签的链接直接下载或者请求接口返回文件来下载
a标签的链接直接下载:直接将文件的地址放在a标签里面就能下载了
请求接口返回文件:这个则需要使用js代码转换一下,将后台返回的乱码转化成你想要的文件形式
let blob = new Blob([res.data], {type: 'application/vnd.ms-excel'});//res.data是后台返回的内容
let objectUrl = URL.createObjectURL(blob);
window.location.href = objectUrl;
或者
一定要设置{responseType:'blob'}
this.axios.get("*******" + id,{responseType: 'blob'}).then(res => {
if (res.status == 200) {
var downloadElement = document.createElement('a');
let url = URL.createObjectURL(res.data);
downloadElement.href = url;
downloadElement.download = '档案报表.xlsx'; //下载后文件名
document.body.appendChild(downloadElement);
downloadElement.click(); //点击下载
document.body.removeChild(downloadElement); //下载完成移除元素
window.URL.revokeObjectURL(href);
this.$Message.success("下载成功");
} else {
this.$Message.info("下载失败")
}
})
通常我们得到后台返给我们文件的链接,就直接用a标签+download属性就可以下载了。
但是在项目中我发现一个问题,就是只有word文档能下载,图片和txt文件只能浏览器预览download属性也不生效。
不知道这是不是bug。
百度查资料说有可能是跨域问题,也有可能是链接为ip地址(可以换成域名)