在web项目中需要下载文件,由于传递的参数比较多(通过参数在服务器端动态下载指定文件),所以希望使用post方式传递参数。
通常,在web前端需要下载文件,都是通过指定<a>标签的href属性,访问服务器端url即可下载并保存文件到本地。
但是这种方式使用的是HTTP GET方法,参数只能通过URL参数方式传递,无法使用POST方式传递参数。
于是,想到使用ajax方式下载文件。

实验:ajax方式下载文件时无法触发浏览器打开保存文件对话框,也就无法将下载的文件保存到硬盘上!
原因:ajax方式请求的数据只能存放在javascipt内存空间,可以通过javascript访问,但是无法保存到硬盘,因为javascript不能直接和硬盘交互,否则将是一个安全问题。

那么,如果想实现post方式提交参数下载文件,应该怎么实现呢?
可以通过模拟表单提交的方式实现post传递数据。

<div>
<a href="<%=request.getContextPath()%>/ajaxDownloadServlet.do?fileName=testAjaxDownload.txt">同步下载文件</a><br />
<a href="#" onclick="downloadFilebyAjax()">ajax下载文件</a> <br />
<a href="#" onclick="downloadFileByForm()">模拟表单提交下载文件</a>
</div>
<script type="text/javascript">
// 直接通过ajax请求文件数据
// jquery下载文件时不能触发浏览器弹出保存文件对话框!
// 可以在javascript中访问下载的文件数据
function downloadFilebyAjax() {
console.log("ajaxDownloadDirectly");
var url = "http://localhost:8080/ajaxDownloadServlet.do";
$.ajax({
url: url,
type: 'post',
data: {'fileName': "testAjaxDownload.txt"},
success: function (data, status, xhr) {
console.log("Download file DONE!");
console.log(data); // ajax方式请求的数据只能存放在javascipt内存空间,可以通过javascript访问,但是无法保存到硬盘
console.log(status);
console.log(xhr);
console.log("=====================");
}
});
} // 模拟表单提交同步方式下载文件
// 能够弹出保存文件对话框
function downloadFileByForm() {
console.log("ajaxDownloadSynchronized");
var url = "http://localhost:8080/ajaxDownloadServlet.do";
var fileName = "testAjaxDownload.txt";
var form = $("<form></form>").attr("action", url).attr("method", "post");
form.append($("<input></input>").attr("type", "hidden").attr("name", "fileName").attr("value", fileName));
form.appendTo('body').submit().remove();
}
</script>

servlet实现:

@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
logger.info("ajax download file");
String fileName = req.getParameter("fileName");
File file = new File(System.getProperty("user.home"), fileName); resp.setContentType("application/octet-stream");
resp.setHeader("Content-Disposition","attachment;filename=" + fileName);
resp.setContentLength((int) file.length()); FileInputStream fis = null;
try {
fis = new FileInputStream(file);
byte[] buffer = new byte[128];
int count = 0;
while ((count = fis.read(buffer)) > 0) {
resp.getOutputStream().write(buffer, 0, count);
}
} catch (Exception e) {
e.printStackTrace();
} finally {
resp.getOutputStream().flush();
resp.getOutputStream().close();
fis.close();
}
}

【参考】
https://gist.github.com/DavidMah/3533415
http://marcanguera.net/blog/2013/07/01/download-file-via-ajax/

ajax方式下载文件的更多相关文章

  1. 呵呵哒,LNMP下通过fread方式下载文件时,中文名称文件找不到文件

    哎,整整折腾一个下午. 本来好好的,thinkphp 自动的uniq方式保存的文件名,非要使用原文件名,真心蛋疼~~ 然后就只好写个脚本 把原来的所有文件都重新命名一下 - - 然后把数据库对应字段也 ...

  2. Http方式下载文件

    代码: using System; using System.Collections.Generic; using System.IO; using System.Linq; using System ...

  3. C# Http方式下载文件到本地类改进版

    在上文基础上增加了远程文件是否存在和本地文件是否存在的判断. 类代码: using System; using System.Collections.Generic; using System.Lin ...

  4. C# Http方式下载文件到本地类

    直接上代码: using System; using System.Collections.Generic; using System.Linq; using System.Text; using S ...

  5. C# Http方式下载文件到本地

    下文代码是从网络(http://www.cnblogs.com/hayden/archive/2012/04/26/2472815.html)得来,亲测好用.我中修改了下格式和注释,版权属于原作者“舒 ...

  6. ajax下post提交方式下载文件的处理(转)

    ajax是不能直接下载文件的,所以一般都是通过一个超链接的形式去下载一个文件 但是当牵扯到需要发送很多数据到服务器上再下载的时候超链接的形式就有些不好看了, /*=================== ...

  7. 关于Ajax无法下载文件到浏览器本地的问题

    最近在做网站的时候遇到这样一个功能,在如图所示的页面中,需要用户点击链接的时候,能够以异步Ajax的方式判断服务器中是否存储有相应的Excel文件,如果没有的话就提示用户没有找到,如果有的话就下载到用 ...

  8. 如何应对POST方式下载文件的接口

    jQuery的下载,需要承载一个插件去做 今天遇到一个问题,后台给的接口由于需要前端传入过多的参数,只能接受用post去下载文件.正常情况下第一反应是用xhr对象去发送post请求,结果并没有触发浏览 ...

  9. asp.net已流的方式下载文件

    string filePath = context.Server.MapPath("~/" + uploadFolder+"/"+file_name);//路径 ...

随机推荐

  1. 天哪又要搬家啦qvq

    CSDN现在怎么这么好看了qvq 搬家回去的欲望日渐强烈... update:2019/02/25 被csdn的侧栏广告烦死了

  2. Codeforces Round #489 (Div. 2) E. Nastya and King-Shamans(线段树)

    题意 给出一个长度为 \(n\) 的序列 \(\{a_i\}\) , 现在会进行 \(m\) 次操作 , 每次操作会修改某个 \(a_i\) 的值 , 在每次操作完后你需要判断是否存在一个位置 \(i ...

  3. 「JLOI2015」城池攻占 解题报告

    「JLOI2015」城池攻占 注意到任意两个人的战斗力相对大小的不变的 可以离线的把所有人赛到初始点的堆里 然后做启发式合并就可以了 Code: #include <cstdio> #in ...

  4. SQL表的基本操作

    1.创建表: create table 表名 ( [列名] [数据类型] [约束], [列名] [数据类型] [约束], ) 2.修改基本表: alert table[表名] [add 新列名 数据类 ...

  5. B1016. 部分A+B

    正整数A的“DA(为1位整数)部分”定义为由A中所有DA组成的新整数PA.例如:给定A = 3862767,DA = 6,则A的“6部分”PA是66,因为A中有2个6. 现给定A.DA.B.DB,请编 ...

  6. 【CF1141F2】Same Sum Blocks

    题解:发现可以通过枚举区间将区间和相同的元组记录在一个表中,对于答案来说,在同一个表中的元组的选择才会对答案产生贡献.发现每一个表中都是一个个区间,问题转化成了对于每一个表来说,选择若干个不相交的区间 ...

  7. TCHAR和CHAR类型的互转,string 转lpcwstr

    https://www.cnblogs.com/yuguangyuan/p/5955959.html 没有定义UNICODE,所以它里面的字符串就是简单用" "就行了,创建工程的时 ...

  8. Vue+koa2开发一款全栈小程序(3.vue入门、Mpvue入门)

    1.Vue-cli 1.新建一个vue项目 打开cmd 官方命令行工具 npm install -g vue-cli //安装脚手架 cd到你想要存放demo的目录下,然后 vue init webp ...

  9. 中性SNP的突变年龄评估(estimate the average age of a neutral two-allele polymorphism)

    假设中性突变的频率分别为P和1-P,则其突变年龄为:-4Ne[p*( logep)+(1-p)* loge (1-p)] The average age of a neutral two-allele ...

  10. easyUI,重新渲染

    Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法 可以使用$.parser.parse();这个方法进行处理: 例如: $.parser.parse(); 表示对整个页面重新 ...