我做的是异步请求下载文件,代码如下:
/**
* 下载文件
*/
download_file(i){
window.console.log(this.file_list_data[i].id);
let that = this;
this.$axios({
method: 'get'
,url:url
,headers:{'token':localStorage.getItem('token'),'Content-Type': 'application/x-www-form-urlencoded'}
,responseType:'blob'
,params:{
file:that.file_list_data[i].id,//携带请求数据
}
})
.then(function (res) {
if (res.status!=200) {
//that.$Message.error("请求服务异常,请联系管理员:"+res.status);//请求失败提示
return false;
}
window.console.log(res.headers)
window.console.log('Content-Type:',res.headers['content-type'])
/**
* 下载的文件后缀
*/
let file_type='';
switch (res.headers['content-type']) {
case 'application/pdf':
file_type='.pdf';
break;
case 'image/jpeg':
file_type='.jpg ';
break;
case 'image/gif':
file_type='.gif ';
break;
case 'image/png':
file_type='.png ';
break;
case 'application/x-zip-compressed':
file_type='.zip ';
break;
default:
return false;
break;
}
const content = res.data
const blob = new Blob([content])
const fileName = that.file_list_data[i].name+file_type;
if ('download' in document.createElement('a')) { // 非IE下载
const elink = document.createElement('a')
elink.download = fileName
elink.style.display = 'none'
elink.href = URL.createObjectURL(blob)
document.body.appendChild(elink)
elink.click()
URL.revokeObjectURL(elink.href) // 释放URL 对象
document.body.removeChild(elink)
} else { // IE10+下载
navigator.msSaveBlob(blob, fileName)
}
})
.catch(function (error) {
//that.$Message.error('请求服务异常');//异常提示
window.console.log(error);
});
}
其中获取响应headers的是:
res.headers['content-type']//此处获取的是文件类型
//如果要获取其他的值将上述“''”内的值换为要获取的头标识,注意此处获取 key需全小写