欢迎来到代码驿站!

JAVA代码

当前位置:首页 > 软件编程 > JAVA代码

React获取Java后台文件流并下载Excel文件流程解析

时间:2021-07-02 09:00:04|栏目:JAVA代码|点击:

记录使用blob对象接收java后台文件流并下载为xlsx格式的详细过程,关键部分代码如下。

首先在java后台中设置response中的参数:

public void exportExcel(HttpServletResponse response, String fileName, String sheetName,
            List<String> titleRow, List<List<String>> dataRows) {
  OutputStream out = null;
  try {
    // 设置浏览器解析文件的mime类型,如果js中已设置,这里可以不设置
    // response.setContentType("application/vnd.ms-excel;charset=gbk");
    // 设置此项,在IE浏览器中下载Excel文件时可弹窗展示文件下载
    response.setHeader("Content-Disposition", 
              "attachment;filename=" + URLEncoder.encode(fileName, "UTF-8"));
   	// 允许浏览器访问header中的FileName
   	response.setHeader("Access-Control-Expose-Headers", "FileName");
    // 设置FileName,转码防止中文乱码
    response.setHeader("FileName", URLEncoder.encode(fileName, "UTF-8"));
    
    out = response.getOutputStream();
    ExcelUtils.createExcelStream(out, sheetName, titleRow, dataRows);
    out.close();
  } catch (Exception e) {
    if (Objects.nonNull(out)) {
      try {
        out.close();
      } catch (IOException e1) {
        log.error("导出失败", e);
      }
    }
    throw Exceptions.fail(ErrorMessage.errorMessage("500", "导出失败"));
  }
}

此时在浏览器的调试面板中可以看到导出接口的response header参数如下:

access-control-allow-credentials: true
access-control-allow-methods: GET,POST,PUT,DELETE,OPTIONS
access-control-allow-origin: http://local.dasouche-inc.net:8081
access-control-expose-headers: FileName
connection: close
content-type: application/vnd.ms-excel;charset=gbk
date: Sun, 29 Mar 2020 10:59:54 GMT
filename: %E4%B8%BB%E6%92%AD%E5%88%97%E8%A1%A8166296222340726.xlsx

接下来我们在前端代码中获取文件流:

handleExport = () => {
  axios.post(`下载文件的接口请求路径`, {}, {
    params: {
      参数名1: 参数值1,
      参数名2: 参数值2
    },
    // 设置responseType对象格式为blob
    responseType: "blob"
  }).then(res => {
	   // 创建下载的链接
    const url = window.URL.createObjectURL(new Blob([res.data],
		// 设置该文件的mime类型,这里对应的mime类型对应为.xlsx格式                          
      {type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'}));
    const link = document.createElement('a');
    link.href = url;
   	// 从header中获取服务端命名的文件名
   	const fileName = decodeURI(res.headers['filename']);
    link.setAttribute('download', fileName);
    document.body.appendChild(link);
    link.click();
  });
};


至此就可以愉快地下载xlsx格式的文件啦~

上一篇:Java编程实现月食简单代码分享

栏    目:JAVA代码

下一篇:java实现简单银行家算法

本文标题:React获取Java后台文件流并下载Excel文件流程解析

本文地址:http://www.codeinn.net/misctech/151506.html

推荐教程

广告投放 | 联系我们 | 版权申明

重要申明:本站所有的文章、图片、评论等,均由网友发表或上传并维护或收集自网络,属个人行为,与本站立场无关。

如果侵犯了您的权利,请与我们联系,我们将在24小时内进行处理、任何非本站因素导致的法律后果,本站均不负任何责任。

联系QQ:914707363 | 邮箱:codeinn#126.com(#换成@)

Copyright © 2020 代码驿站 版权所有