导出后台返回的excel文件流

概述: 大部分情况下，我们是直接访问提供的download链接来直接下载文件。但某些时候，为了保证信息安全，可能需要提交token来验证用户信息。

参考：js要怎么接收后端传的excel文件流？中jello chen的回答

在jello chen的回答中，提供了两种方法。

第一种是通过的a标签直接下载：

  <a href="<你的返回流的Action路径>" >下载</a>

转化为js代码：

      let elink = document.createElement('a');
      elink.download = "download.xls";
      elink.href = `${url}?token=${token}&${hash}`;
      elink.click();

第二种方法是通过XMLHttpRequest来实现的，代码如下（有部分修改）:

    <script type="text/javascript">
        function download(filename) {
            let oReq = new XMLHttpRequest();
            oReq.open("GET", "<你的返回流的Action路径>", true);
            oReq.responseType = "blob";

            //  设置验证密匙
            oReq.setRequestHeader("token",token);
            oReq.setRequestHeader("loginName",localStorage.getItem('username') || '');

            oReq.onload = function () {
                var content = oReq.response;
                var blob = new Blob([content]);

                //  创建a标签，下载处理过的文件流
                var elink = document.createElement('a');
                elink.download = filename;
                elink.href = URL.createObjectURL(blob);
                elink.click();
            };
            oReq.send();
        }
    </script>

然后将起转化为fetch方式：

  let newOptions = {
      loginName: localStorage.getItem('username') || '',
      'Content-Type': 'application/form-data; charset=utf-8',
      token,
  }

  fetch("<你的返回流的Action路径>", newOptions, { responseType: 'blob'})
  .then(response => {
      // 注意，该处并非response.json()
      return response.blob();
  })
  .then(res => {
      var blob = new Blob([res]);
      let elink = document.createElement('a');

      elink.download = "download.xls";
      elink.href = URL.createObjectURL(blob);
      elink.click();
  })
  .catch(e => {
    console.log('error:' + e)
  })

因为没有post方式的接口，所以没有测试post的请求。