关于javascript:POST请求-下载文件

通过 axios 发送 POST 申请 下载文件。

这时候的 Content-Type: application/json;charset=UTF-8

先贴

axios({
  method: 'post',
  url: 'xxx/xxx',
  data: {***},
  responseType: 'blob', // 这里很重要，如果没有，respons.data 为 ''，传了返回的 data 是 Blob 格局。}).then(response => {const disposition = response.headers['content-disposition'];
  if (disposition && disposition.indexOf('attachment') !== -1) {postDownload(response.data, '结算单.xls');
  }
}).catch((error) => {
    // 这里 catch 我没试过，抄的。。也不晓得对不对
    if(error.request.responseType === 'blob') {let errInfo = {};
        let reader = new FileReader();
        reader.readAsText(err.response.data, 'UTF-8');
        reader.onload = function () {errInfo = JSON.parse(reader.result);
          data.error && data.error.call(this, errInfo)
        };
     }
     else {data.error && data.error.call(this, err.response.data)
     }
})

与后盾沟通好 response header 的设置，并规定好 fileName 的编码方式，不便前端拿到后解析

   content-disposition: attachment;fileName=%E9%81%A5%E6%84%9F%E8%A7%A3%E8%AF%91%E6%95%B0%E6%8D%AE.xls
   content-type: application/octet-stream

我这边的后端也是抄的局部代码 返回的 content-disposition 里的 fileName 他也不晓得是什么编码。。
content-disposition: “attachment;filename=结算单.xls” 我解析不了 就写死了

这个是 传入（blob, filename）下载的函数，这是从别处抄的

function postDownload(blob, filename) {if (typeof window.navigator.msSaveBlob !== 'undefined') {
      // IE
      window.navigator.msSaveBlob(blob, filename);
    } else {
      const URL = window.URL || window.webkitURL;
      const downloadUrl = URL.createObjectURL(blob);
      if (filename) {// use HTML5 a

        
  文件名称：
        
  文件大小：
        
  下载声明：本站部分资源来自于网络收集，若侵犯了你的隐私或版权，请及时联系我们删除有关信息。
        
 下载地址：
    
 attribute to specify filename
        const a = document.createElement('a');
        // safari doesn't support this yet
        if (typeof a.download === 'undefined') {window.location = downloadUrl;} else {
          a.href = downloadUrl;
          a.target = '_blank';
          a.download = filename;
          document.body.appendChild(a);
          a.click();}
      } else {window.location = downloadUrl;}
      setTimeout(() => { URL.revokeObjectURL(downloadUrl); }, 100); // cleanup
    }
  }

表单 post 下载

我感觉更简略。和第一种略有区别，这个我没用过，先贴着，当前用失去。
原理：创立一个暗藏 form 表单，通过 form 表单的提交刷新性能，实现下载。代码如下：

downloadExcel(url, obj) {let tempForm = document.createElement('form');
    // var token = window.token || ''
    // if (url && token) {//     if (url.indexOf('?') !== -1) {
    //         url = url + '&token=' + token;
    //     } else {
    //         url = url + '?token=' + token;
    //     }
    // }
    tempForm.action = url;
    tempForm.method = 'post';
    tempForm.onsubmit = "return false";
    tempForm.style.display = 'none';
    for (let st in obj) {if (obj.hasOwnProperty(st)) {let opt = document.createElement('textarea');
            opt.name = st;
            opt.value = obj[st];
            tempForm.appendChild(opt);
        }
    }
    document.body.appendChild(tempForm);
    tempForm.submit();
    return tempForm;
}

这时候的 Content-Type: application/x-www-form-urlencoded; charset=UTF-8