前端下载

• • 如何用ajax请求二进制文件流下载文件
  • Blob-type

如何用ajax请求二进制文件流下载文件

用jquery封装的$ajax请求的话设置responseType属性是无效的，需要使用原生xhr请求设置

var url = ''
var param ={}
var xhr = new XMLHttpRequest()
xhr.open('post', url);
xhr.responseType = 'blob';     //要加blob类型
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.onreadystatechange = function() {
    if (xhr.readyState == 4 &&  xhr.status == 200) {
        console.log(xhr)
        var blob = new Blob([xhr.response],{ type: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document' });
        var url = window.URL.createObjectURL(blob);
        var link = document.createElement('a');
        link.href = url;
        link.style.display = 'none';

        var fileName = '文件.docx';
        var downloadFileName = decodeURIComponent(fileName);

        link.setAttribute('download', downloadFileName);
        $('body').append(link);
        link.click();
        window.URL.revokeObjectURL(url);
    }
}

var arr = [];
for (var k in param){
    arr.push(k+'='+param[k]);
}
xhr.send(arr.join('&')); // 发送请求

Blob-type