ajax请求不能下载文件 皇冠体育源码下载搭建

皇冠体育源码下载搭建
地址一:【hubawl.com】狐霸源码论坛
地址二:【bbscherry.com】

现在假如工作中的您接到一个需求,需求内容是:前端提供时间输入框,点击“导出”按钮即可实现满足该段时间内的数据(实际数据来自于数据库)导出。

当然实现上述功能的方式有很多种,最简单也最常用的就是利用form表单实现。

代码如下:HTML代码

<form action="${doadmin}/kvop/order/mailVbsBillQuerySaveData.html" method="post" class="form form-horizontal" id="form">
<div class="row cl">
<label style="margin-top:13px" class="form-label col-xs-1 col-sm-1">推送时间:
</label>
<div style="margin-top:10px" class="formControls col-xs-3 col-sm-3">
<input type="text" onfocus="WdatePicker()" id="startDate" name="startDate"
class="input-text Wdate" style="width:120px;"> -
<input type="text" onfocus="WdatePicker()" id="endDate" name="endDate"
class="input-text Wdate" style="width:120px;">
</div>

<div class="row cl text-c">
    <button type="reset" class="btn btn-secondary radius"><i class="Hui-
             iconfont">&#xe6e2;</i> 清空</button> &nbsp;&nbsp;&nbsp;
    <button type="button" class="btn btn-success radius" onclick="gotoPage()">导出
    </button>
</div>
</div>

</form>
JS代码:

function gotoPage() {
var startDate = $.trim($("#startDate").val()); //审核时间起
var endDate = $.trim($("#endDate").val()); //审核时间止
if (startDate == '' || startDate == undefined || startDate == null) {
layer.msg('请输入开始时间!', {icon: 2,time: 3000});
return false;
}
if (endDate == '' || endDate == undefined || endDate == null) {
layer.msg('请输入结束时间!', {icon: 2,time: 3000});
return false;
}
document.getElementById("form").submit();
}
但是作为年少的我,第一时间选择使用的是Ajax进行提交发起下载功能。

我分别测试了很多种方式:

1、通过流来进行导出。2、通过excel进行导出 。3、通过从FTP读取文件进行导出。

最后的结果是:失败。

现象是:每次点击“导出”按钮的时候,报错:调用接口异常。

然后脑中一闪过一个想法:是不是ajax不支持文件下载呢?

然后我上网查阅,结果真的符合我的这个想法。

Why?

ajax请求只是个“字符型”的请求,即请求的内容是以文本类型存放的。文件的下载是以二进制形式进行,虽然可以读取到返回的response,但只是读取,无法执行。也就是说js无法调用到浏览器的下载处理机制和程序。

福利内容

在下载的时候,直接使用中文的文明名称会下载的时候,会出现中文名称消失或者乱码,可以使用下面的方式进行解决

response.setHeader("Content-Disposition", "attachment;filename="+ java.net.URLEncoder.encode("逾期的订单数据", "UTF-8")+".xls");

猜你喜欢

转载自blog.51cto.com/13917320/2157222