脚本宝典收集整理的这篇文章主要介绍了VUE+ElementUI+springboot实现文件导出 文件导出时前端不弹出下载提示框，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。

1 整体思路

网页上的文件导出功能可以分为三个步骤

①根据业务查询数据库，获得List数组

②将List数组、文件保存的路径、文件名（可以由UUID生成，也可以由前端用户给定）传给转Excel的工具类，生成Excel文件

③实现文件下载功能（后端+前端）

 

 

2 后端

JAVA读写Excel和word

1.2 方式二 通过将文件转为流存入ResponseEntity传给前端

 

代码简述，不用记，直接把代码复制过去改一下就行了

 

/**
 * 实现文件导出 即 查询+转Excel+文件下载
 * @return
 */
@PostMapping("test")
public ResponseEntity<byte[] > test() throws Exception{
    //查询
    List<SalesOrderVO> salesOrderVOS = iSalesOrderService.searchAllOrder();
    //自定义Excel文件保存路径
    String path="C:\Users\Administrator\Desktop\";
    //自定义文件名称
    UUID uuid = UUID.randomUUID();
    //生成excel文件
    ExcelReaderDemo.write(salesOrderVOS,path,uuid.toString());

    //生成路径
    String realPath=path+uuid.toString()+".xls";
    //2.将文件转成流对象
    FileInputStream fileInputStream = null;
    fileInputStream = new FileInputStream(realPath);
    //3.创建一个byte数组 buffer
    byte[] buffer = new byte[fileInputStream.available()];
    //4.流对象.read（byte数组） 将流对象写入byte数组
    fileInputStream.read(buffer);
    //5.设置请求头，触发浏览器下载
    HttpHeaders httpHeaders = new HttpHeaders();
    //6.从完整的路径中截取文件名作为要传输的文件的名字
    // 可以改为由前端传递名字，或者用UUID随机
    String fileName = realPath.substring(realPath.lastIndexOf("\") + 1);
    //7.固定写法
    httpHeaders.setContentDispositionFormData("attachment", URLEncoder.encode(fileName, "utf-8"));
    return new ResponseEntity<byte[]>(buffer, httpHeaders, HttpStatus.OK);
}

 

3 前端

前端一般用VUE+ElementUI实现

3.1 页面布局代码

一个按钮 通过click事件触发js方法

 

3.2 js方法 非AJAX 非token

前端有两种方式，方式一简单粗暴，方式二比较安全

下面的代码仅供参考，因为没有使用AJAX，也没有携带token

实际开发还需要根据业务需求，将用户设定的一些信息（条件查询、文件名）传给后端，而且对于异步请求、token处理均有要求

 

3.3 前端不弹出下载提示框

导出Excel文件，前端不弹出下载提示框_w441089的博客-CSDN博客

如果前端使用了AXIOS实现AJAX，即在当前页面发送请求，可能会遇到请求后端后没反应的情况，而使用swagger或者postman测试后端又没问题，那么可能是前端AJAX的问题

 

Java后台导出Excel表，没有出现下载提示问题解决_A-bing的博客-CSDN博客

摘录：“问题源头应该是前端用的是ajax方式请求路径，要想出现下载Excel的弹窗，我个人理解应该是等同于重新打开一个窗口，而ajax默认不动页面直接将值返回，所以没有提示下载。”

 

解决办法：

不使用AJAX请求

 

如果必须使用AJAX请求，还要带token，参见下面的连接

vue中使用axios实现带token下载文件_bossjing的博客-CSDN博客

脚本宝典总结

以上是脚本宝典为你收集整理的VUE+ElementUI+springboot实现文件导出 文件导出时前端不弹出下载提示框全部内容，希望文章能够帮你解决VUE+ElementUI+springboot实现文件导出 文件导出时前端不弹出下载提示框所遇到的问题。

如果觉得脚本宝典网站内容还不错，欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。