1.文件流形式
pdfHeaders: {
'Authorization': localStorage.getItem('Access-Token').replace(/"/g, ''),
'Content-Type': 'application/json',
},
downLoad(){
let getUrl = ''
if (process.env.NODE_ENV === "development") {
getUrl = `测试地址`
} else if (process.env.NODE_ENV === "production") (
getUrl = `生产地址`
)
//打开合同协议为文件流的方法
axios({
method: 'post',
url: getUrl,
data: this.formData,
responseType: 'blob',
headers: this.pdfHeaders,
}).then(response => {
let decodedString = decodeURIComponent(response.headers['content-disposition'].split(';')[1].split('=')[1]); 文件名在响应头里，需要后端设置Access-Control-Expose-Headers: Content-Disposition
const url = window.URL.createObjectURL(new Blob([response.data]));
const link = document.createElement('a');
link.href = url;
link.setAttribute('download', '协议模版.pdf'); // 设置下载的文件名
document.body.appendChild(link); // 需要添加到文档中
link.click(); // 触发下载
document.body.removeChild(link); // 下载后移除链接
})
}2.文件为链接形式
a标签不能直接下载非同源的文件，因此需要特殊处理
getAuthAgreementUrl(this.formData).then(res => {
let x = new XMLHttpRequest();
x.open("GET", res.data(链接地址), true);
x.responseType = 'blob';
x.onload = function (e) {
var url = window.URL.createObjectURL(x.response)
var a = document.createElement('a');
a.href = url
a.download = '文件名';
a.click()
}
x.send();
})PS：如果有mock.js记得取消引入，mock.js会重写请求
3.Blob对象转换成String字符串
reader.onload中的定义的变量如何抛出去
第一种 在外部定义方法
let reader = new FileReader();
reader.readAsText(response.data, 'utf-8');
reader.onload = e => {
this.showError(reader.result)
}
//报错处理
showError(response) {
let temp = JSON.parse(response);
let errorMes = ''
errorMes = temp.message
this.errorMesShow = errorMes
this.$message.error(this.errorMesShow)
},
第二种Promise抛出去：
function uploadFile(file) {
return new Promise(function(resolve, reject) {
let reader = new FileReader()
reader.readAsArrayBuffer(file)
reader.onload = function() {
resolve(this.result)
}
})
}
uploadFile(file).then(function(result){
})
