轻松实现POST 和 GET 两种方式导出下载文件

注：

        因GET请求参数URL有长度限制，当你传入参数太多的话会导出下载失败，所以导出如果需要传的参数过多时，此时都需要使用POST请求来规避浏览器长度限制进行导出下载

POST方式：

• 后端将查询到的数据作一些处理之后，将数据写入到请求的响应体中，前端在请求接口之后，在回调函数中，将响应体中的二进制流转化为Blob对象，然后创建一个下载链接进行下载。

•      import { exportData } from '@/service/api/meta';  //引入接口
       
       exportData({tableName:this.tableName}).then(res =>{
          const blob = new Blob([res]);  //res为接口返回的二进制流
          const a = document.createElement('a');
          const bUrl = window.URL.createObjectURL(blob);
          a.href = bUrl;
          a.setAttribute('download', '文件目录.xlsx')
          document.body.appendChild(a);
          a.click()
          document.body.removechild(a);
       })

 

GET方式：

• 实现方式和POST基本一致，后端只需要修改一下接口的请求方式和response的contentType；前端就只需要提供一个链接即可。

•     // exportExcel 点击事件
      function exportExcel() {
        window.location.href = "http://localhost:8080/api/export"
      }