关于使用ajax导出excel问题
最近有个需求是在页面导入文件,后端进行处理后返回处理结果的excel,前端使用的是ajax。我最开始的做法是:在原有代码后加一段导出excel的代码,结果代码能正常运行,但页面始终没有返回我需要的excel。
而后开始百度编程模式,得出以下结论:
ajax是无法直接导出excel的,因为ajax的返回值只能是字符流,而导出excel是后台往浏览器中写入二进制的字节流
导出excel有以下两种方式:
方法一:window.location.href() & form表单.submit().
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 | <a href= "javascript:void(0)" onclick= "exportExcel()" >导出</a> // 导出,使用这种方式可以,使用ajax请求不可以导出excel function exportExcel(){ var form = $( "<form>" ); form.attr( 'style' , 'display:none' ); form.attr( 'target' , '' ); form.attr( 'method' , 'post' ); form.attr( 'action' , '${pageContext.request.contextPath}/user/export' ); var input1 = $( '<input>' ); input1.attr( 'type' , 'hidden' ); input1.attr( 'name' , 'item' ); input1.attr( 'value' , 'test' ); /* JSON.stringify($.serializeObject($('#searchForm'))) */ $( 'body' ).append(form); form.append(input1); form.submit(); form.remove(); } |
1 2 3 4 5 | function () { var stime = $( "#layerdate" ).val(); var etime = $( "#layerdate2" ).val(); window.location.href = "${pageContext.request.contextPath}/user/export?stime=" +stime+ "&etime=" +etime; } |
方法二:ajax请求把参数缓存在后端返回给前端,前端ajax再次发起一个window.open(url?params=params)即可
1 2 3 4 5 6 7 8 9 | $.ajax({ url: '../../eldercare/excel/export?_' + $.now(), type: 'post' , dataType: "json" , contentType : 'application/json' , data : JSON.stringify( this .tableOpts), success: function (data){ window.open( '../../eldercare/excel/downFromCache?params=' +data.rows, '_self' ); }, |
注意,使用window.open()或是window.location.href()时有个前端传值限制,超过限制数会报错。
1 2 3 4 5 | Microsoft Internet Explorer (Browser):IE浏览器对URL的最大限制为2083个字符,如果超过这个数字,提交按钮没有任何反应。 Firefox (Browser):对于Firefox浏览器URL的长度限制为65,536个字符 Safari (Browser):URL最大长度限制为 80,000个字符。 Opera (Browser):URL最大长度限制为190,000个字符。 Google (chrome):url最大长度限制为8182个字符 |
吾生也有涯,而知也无涯~~~
【推荐】还在用 ECharts 开发大屏?试试这款永久免费的开源 BI 工具!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步