微客导航 » 文章资讯 » React获取Java后台文件流并下载Excel文件流程解析

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

2023-07-22 22:49:14 270

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

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

publicvoidexportExcel(HttpServletResponseresponse,StringfileName,StringsheetName,
ListtitleRow,List>dataRows){
OutputStreamout=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(Exceptione){
if(Objects.nonNull(out)){
try{
out.close();
}catch(IOExceptione1){
log.error("导出失败",e);
}
}
throwExceptions.fail(ErrorMessage.errorMessage("500","导出失败"));
}
}

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

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,29Mar202010:59:54GMT
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=>{
	//创建下载的链接
consturl=window.URL.createObjectURL(newBlob([res.data],
		//设置该文件的mime类型，这里对应的mime类型对应为.xlsx格式
{type:'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'}));
constlink=document.createElement('a');
link.href=url;
	//从header中获取服务端命名的文件名
	constfileName=decodeURI(res.headers['filename']);
link.setAttribute('download',fileName);
document.body.appendChild(link);
link.click();
});
};

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

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
3162201930
czq8825@qq.com

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

热门推荐

随机推荐