项目中有个接口,会返回一个文件流,正常情况可以正常使用,但是报错情况下缺少提示。报错信息存放在message中。因为设置了responseType,所以需要多解析一次。
// 原版
var oReq = new XMLHttpRequest();
oReq.open("POST","url/test", true);
oReq.responseType = "blob";
oReq.onload = function (oEvent) {
if(oReq.status === 200){
const content = oReq.response;
const blob = new Blob([content],{type : 'application/pdf'});
let blobUrl = window.URL.createObjectURL(blob);
_this.pdfUrl = blobUrl;
console.log('this.pdfUrl',_this.pdfUrl)
} else{
console.log(oReq,oEvent)
_this.$message.error('文件加载失败')
}
if(typeof (callback) == "function"){
callback();
}
};
oReq.setRequestHeader("content-type","application/json");
oReq.setRequestHeader("Accept","application/json")
oReq.send(data);
res.response 内容
// 修改后
var xhr = new XMLHttpRequest();
xhr.open("POST","url/test", true);
xhr.responseType = "blob";
xhr.onload = function (oEvent) {
if(xhr.status === 200){
const content = xhr.response;
const blob = new Blob([content],{type : 'application/pdf'});
let blobUrl = window.URL.createObjectURL(blob);
_this.pdfUrl = blobUrl;
console.log('this.pdfUrl',_this.pdfUrl)
}
else{
try{
let fileReader = new FileReader();
fileReader.onload = function() {
const jsonData = JSON.parse(fileReader.result);
_this.$message.error(jsonData.msg)
};
fileReader.readAsText(xhr.response);
}catch(e) {
_this.$message.error('文件加载失败')
}
}
if(typeof (callback) == "function"){
callback();
}
};
xhr.setRequestHeader("content-type","application/json");
xhr.setRequestHeader("Accept","application/json")
xhr.send(data);