借鉴老哥1的文章

借鉴老哥2的文章
最近实现前端文件流下载，走了好多弯路，坑坑洼洼的 好在爬出来了。
提到文件流下载 就有get和post两种，其中get很简单。直接调取接口,
然后window.open打开全路径即可实现下载。

      const action = `/api/user-service${api}?${qs.stringify(params)}`;
      window.open(action, '_target');

然后是post方法下载：

js中有个Blob对象,一个 Blob对象表示一个不可变的, 原始数据的类似文件对象。Blob表示的数据不一定是一个JavaScript原生格式 blob对象本质上是js中的一个对象，里面可以储存大量的二进制编码格式的数据。

创建一个blob对象

var blob = new Blob(['后台返回的二进制文件'],{type : '该文件是什么类型的文件(MIME)'});

3.常用的文件类型有(MIME),根据需要返回怎样的文件,就填写怎样的MIME类型,也可以不写,写的话指定了下载的文件格式,不写,文件是什么格式,下载就是什么格式,根据项目需求.

后缀名       MIME名称
*.3gpp    audio/3gpp, video/3gpp
*.ac3    audio/ac3
*.asf       allpication/vnd.ms-asf
*.au           audio/basic
*.css           text/css
*.csv           text/csv
*.doc    application/msword    
*.dot    application/msword    
*.dtd    application/xml-dtd    
*.dwg    image/vnd.dwg    
*.dxf      image/vnd.dxf
*.gif            image/gif    
*.htm    text/html    
*.html    text/html    
*.jp2            image/jp2    
*.jpe       image/jpeg
*.jpeg    image/jpeg
*.jpg          image/jpeg    
*.js       text/javascript, application/javascript    
*.json    application/json    
*.mp2    audio/mpeg, video/mpeg    
*.mp3    audio/mpeg    
*.mp4    audio/mp4, video/mp4    
*.mpeg    video/mpeg    
*.mpg    video/mpeg    
*.mpp    application/vnd.ms-project    
*.ogg    application/ogg, audio/ogg    
*.pdf    application/pdf    
*.png    image/png    
*.pot    application/vnd.ms-powerpoint    
*.pps    application/vnd.ms-powerpoint    
*.ppt    application/vnd.ms-powerpoint    
*.rtf            application/rtf, text/rtf    
*.svf           image/vnd.svf    
*.tif         image/tiff    
*.tiff       image/tiff    
*.txt           text/plain    
*.wdb    application/vnd.ms-works    
*.wps    application/vnd.ms-works    
*.xhtml    application/xhtml+xml    
*.xlc      application/vnd.ms-excel    
*.xlm    application/vnd.ms-excel    
*.xls           application/vnd.ms-excel    
*.xlt      application/vnd.ms-excel    
*.xlw      application/vnd.ms-excel    
*.xml    text/xml, application/xml    
*.zip            aplication/zip    

*.xlsx     application/vnd.openxmlformats-officedocument.spreadsheetml.sheet

最终代码实现，注意采坑点，

1. 一定要在请求的res里清楚的拿到二进制流文件，一般是res或者res.data,可以console.log打印试试。
2. 拿数据时，切记设置post请求的 responseType: ‘blob’,
3. 请求拿到后，创建blob对象要知道文件具体格式，如上所列，如果是excle则，

const blob = new Blob([res.data], {
   type: 'application/vnd.ms-excel',
 });

总结方法：

    /**
     * 导出
     */
    exportExcleFun() {
      axios({
        method: 'post',
        url: '/api/lostFound-service/travel/deposit/export',
        responseType: 'blob',
        data: this.model,
      })
        .then((res) => {
          // console.log(res.data);
          const blob = new Blob([res.data], {
            type: 'application/vnd.ms-excel',
          });
          const url = window.URL.createObjectURL(blob);
          this.download(url, '物品寄存列表');
          // window.location.href = url;
        });
    },

      /**
       * post方式导出。
       * @param {blob路径} blobUrl
       * @param {*} name
       */
      download(blobUrl, name) {
        const link = document.createElement('a');
        link.style.display = 'none';
        link.href = blobUrl;
        link.download = `${name}.xlsx`;
        document.body.appendChild(link);
        link.click();
        document.body.removeChild(link);
      },

附录：
这是我请求的preview数据

这是我打印的cosole.log();

可见数据在res.data中，所以上述

const blob = new Blob([res.data], {
   type: 'application/vnd.ms-excel',
 });

应该取值res.data。