<el-button size="small" type="pimary" @click="downLoadd">导出</el-button>
downLoadd() {
let that = this;
var xhr = new XMLHttpRequest();
xhr.open(
"post",
that.$Config.download + "/" + that.warehouseId + "/" + that.regTime,
true
);
xhr.responseType = "blob"; // 返回类型blob
xhr.setRequestHeader("Content-Type", "application/json"); //设置提交的数据为json格式
//多个setRequestHeader合并为一个
xhr.setRequestHeader("token", that.token);
xhr.onload = function() {
// 请求完成,数据接收完毕
// console.log("打印",this.status)
console.log("this", this);
console.log("xhr", xhr);
if (this.status === 200) {
// 返回200
var blob = this.response;
// 设置文件名
console.log(xhr.getResponseHeader("content-disposition"));
let temp = xhr
.getResponseHeader("content-disposition")
.split(";")[1]
.split("filename=")[1];
var fileName = decodeURIComponent(temp);
var reader = new FileReader();
reader.readAsDataURL(blob); // 转换为base64,可以直接放入a标签href---URL以base64编码的字符串表示文件的数据。
reader.onload = function(e) {
// 转换完成,创建一个a标签用于下载
var a = document.createElement("a");
a.download = fileName;//指定文件名
a.href = e.target.result;
$("body").append(a); // 修复firefox中无法触发click
a.click();
$(a).remove();
};
} else {
alert("文件下载失败,请稍后再试");
}
};
xhr.send();
},
vue原生js利用xhr异步下载文件
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。