由于jQuery的ajax函数、及ajaxSubmit等函数的返回类型(dataType)只有xml、text、json、html等类型,没有“流”类型,故我们要实现ajax下载时,不能够使用相应的ajax函数进行文件下载。
请看实例:
1. form 通过js生成一个form,用这个form提交参数,并返回“流”类型的数据。在实现过程中,页面也没有进行刷新 缺点:无法传递header
var form = $('<form>');
form.attr('style','display:none');
form.attr('method','post');
form.attr('target', '_self');
form.attr('action',url);
for (var obj in data) {
if (data.hasOwnProperty(obj)) {
var input = $('<input>');
input.attr('tpye','hidden');
input.attr('name',obj);
input.attr('value', data[obj]);
form.append(input)
}
}
$('body').append(form);
form.submit();
form.remove();
2.axios axios ie9+ window.navigator.msSaveBlob ie10+ 此方法只兼容ie10+
var config = {
headers: {
'token': token,
'Content-Type': 'multipart/form-data',
},
responseType: 'blob',
}
axios.post(url, data,config).then( res => {
if ('download' in document.createElement('a')) { // 非IE下载
var url = window.URL.createObjectURL(res.data)
var link = document.createElement('a')
link.style.display = 'none'
link.href = url;
link.download = fileName;
document.body.appendChild(link)
link.click();
window.URL.revokeObjectURL(link.href) // 释放URL 对象
document.body.removeChild(link)
} else { // IE10+下载
window.navigator.msSaveBlob(res.data, fileName)
}
}).catch( res => {
console.log(res)
})
网友评论