上传formdata数据
// 方式 一
var formData = new FormData()
formData.append('username', file)//username 为key名，例：file:xxxx.xlsx
let config = {
headers: {
'Content-Type': 'multipart/form-data'
}
}
axios.post('url', formData,config)
.then( res => {
console.log(res)
this.$refs.uploadExcel.clearFiles();
// console.log(res)//返回带headers的全部信息
if (res.code == 0){
this.tongMessage("success", "导入成功");
}
}).catch( res => {
console.log(res)
})
// 方式 二
import qs from 'qs';
let config = {
headers: {
'Content-Type': 'multipart/form-data'
}
}
const data = qs.stringfy({username: 'test'})
axios.post('url', data,config)
.then( res => {
console.log(res)
}).catch( res => {
console.log(res)
})下载Excel文件
普通方法下载
axios.get('url', {
parmas:{},
responseType: 'blob', //定义接口响应的格式,很重要
})
.then( res => {
this.$refs.uploadPDF.clearFiles(); //在每一次上传请求结束后清除缓存
console.log(res) //返回带headers的全部信息，需要修改axios return res.data 为 return res
const fileName = res.headers['content-disposition'].split('=')[1];
const link = document.createElement("a"); //创建一个a标签用来跳转
link.style.display = "none";
let blob = new Blob([res.data], {
type:"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
}); //拿到文件流下载对象 res为接口返回的文件流 设置下载格式.xlsx
let objectUrl = URL.createObjectURL(blob); //生成文件流下载链接
link.href = objectUrl; //a标签 href 赋值 链接
link.download =decodeURI(fileName);
link.click(); // 下载文件
URL.revokeObjectURL(objectUrl); // 释放内存
document.body.removeChild(link); //移除标签节点
}).catch( res => {
console.log(res)
})采用 FileReader 实例对象调用Api ，处理文件流
this.$axios({
url: "url",
method: "GET",
responseType: 'blob', //设置响应格式
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
})
.then(function (res) {
const reader = new FileReader(); // 实例化 FileReader
reader.readAsDataURL(res.data); //将读取到的文件编码成DataURL
reader.onload = (e) => { //调用API onload 文件读取成功时触发
//模拟a标签点击
let a = document.createElement('a'); //创建a标签，
a.download = Date.parse(new Date()) + '.jpeg'; //设置格式
a.href = e.target.result; //下载文件流链接
document.body.appendChild(a); //将标签DOM，放置页面
a.click();
document.body.removeChild(a); //移除标签节点
};
reader.onerror = (e) => {
this.$message({
message: '解析文件发生错误',
type: 'warning'
});
};
reader.onabort= (e) => {
this.$message({
message: '解析文件发生意外终止',
type: 'warning'
});
}
})
.catch(function (error) {
console.log(error);
});下载word
downLoad(data) {
let obj = {
reportDetailId: data.reportDetailId
}
this.$axios.post(this.dataQualityApi.getUrl("reportDownLoad"), obj,{responseType: 'blob'})
.then((res) => {
this.downloadFile(res, '报告结果', 'docx');
});
},
downloadFile(content, fileName, type) {
let blob = new Blob([content], {
type: `application/${type}`,
});
if (window.navigator && window.navigator.msSaveOrOpenBlob) {
window.navigator.msSaveOrOpenBlob(blob, fileName);
} else {
const aLink = document.createElement("a");
aLink.download = fileName+'.'+type;
aLink.href = URL.createObjectURL(blob);
aLink.click();
URL.revokeObjectURL(blob);
}
},使用node中的fs下载
首先，axios 需要配置config["responseType"] = "arraybuffer";
fs.writeFileSync(path, Buffer.from(res));//res为后端返回的二进制流，通过 responseType:"arraybuffer" 转为buffer您可能感兴趣的文章：
