ajax方式下载文件

在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/

 


更多专业前端知识,请上 【猿2048】www.mk2048.com

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/361497.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

了解Spring Web应用程序体系结构:经典方法

每个开发人员必须了解两件事&#xff1a; 架构设计是必要的。 花哨的体系结构图没有描述应用程序的真实体系结构。 真正的体系结构是从开发人员编写的代码中找到的&#xff0c;如果不设计应用程序的体系结构&#xff0c;最终将得到一个具有多个体系结构的应用程序。 这是否…

使用unicode

#include <iostream> class 我的类 { public:我的类(int 我的初始化变量){我的成员变量 我的初始化变量;}~我的类(){}int 我的成员变量;void 打印我的变量(){std::cout<<我的成员变量<<std::endl;}; };int main() {我的类 我的实例(1);我的实例.打印我的变量…

springmvc注解小示例(转)

转自&#xff1a;http://www.blogjava.net/pengo/archive/2010/11/28/339229.html 弃用了struts&#xff0c;用spring mvc框架做了几个项目&#xff0c;感觉都不错&#xff0c;而且使用了注解方式&#xff0c;可以省掉一大堆配置文件。本文主要介绍使用注解方式配置的spring mv…

解决maven项目Cannot change version of project facet Dynamic web module to 3.0

1、打开新建的servlet文件例如&#xff08;hibernate.cfg.xml&#xff09;修改头文件为 <?xml version"1.0" encoding"UTF-8"?><!DOCTYPE hibernate-configuration PUBLIC "-//Hibernate/Hibernate Configuration DTD 3.0//EN" &quo…

使用Forge插件在现有Java EE项目上启用Arquillian

技术提示&#xff03;34解释了如何创建可测试的Java EE 7应用程序。 如果要启动新的应用程序&#xff0c;这将很有用。 但是&#xff0c;如果您已经有一个应用程序并启用Arquillian怎么办&#xff1f; 这就是Forge和Forge-Arquillian附加组件派上用场的地方。 这就是我在javae…

HDOJ1166 敌兵布阵【线段树】

Problem : 1166 ( 敌兵布阵 ) Judge Status : AcceptedRunId : 5862942 Language : GCC Author : qq1203456195 #include <stdio.h> #define lson l,m,rt<<1 #define rson m1,r,rt<<1|1 #define maxn 55555 int sum[maxn<<2]; void PushUp(i…

欧拉回路

欧拉回路与欧拉路径 欧拉回路 不重复地结果每条边的回路欧拉路径 不重复地几个每条边地路径欧拉图 存在欧拉回路地图半欧拉图 存在欧拉路径地图在数学中为简单的图的一笔画完问题&#xff0c;但在有向图里&#xff0c;可以应用到单词接龙判断 判断是否存在欧拉回路 无向图有向图…

jQuery文档就绪

很多jQuery代码都有如下片段: $(document).ready(function(){//代码 })作用就是等文档结构加载完成后再去执行function中的代码&#xff0c;功能类似于window.onload事件。 代码实例如下: <!DOCTYPE html> <html> <head> <meta charset"utf-8"…

使用Java EE 7,WildFly和Docker进行连续部署–(第1部分)

此博客是开始一个新的hanginar&#xff08;G 结伴旅游 webi NAR&#xff09;&#xff0c;将突出解决方案&#xff0c;框架&#xff0c;应用服务器&#xff0c;工具&#xff0c;部署和更多的内容集中在Java EE的系列。 这些不是通常的会议风格独白演示&#xff0c;而是交互式ha…

URAL 1013 K-based Numbers. Version 3

URAL_1013 和URAL_1009的思路是一样的&#xff0c;只不过需要高精度&#xff0c;所以就直接用java写了。具体的一些思路可以参考我的URAL_1009的题解&#xff1a;http://www.cnblogs.com/staginner/archive/2012/05/01/2477513.html。 如果N再大一点的话&#xff0c;也可以用二…

爬取w3c课程—Urllib库使用

爬虫原理 浏览器获取网页内容的步骤&#xff1a;浏览器提交请求、下载网页代码、解析成页面&#xff0c;爬虫要做的就是&#xff1a; 模拟浏览器发送请求&#xff1a;通过HTTP库向目标站点发起请求Request&#xff0c;请求可以包含额外的header等信息&#xff0c;等待服务器响应…

关于SSL证书配置、升级的一些问题总结

SSL会成为网站、APP、小程序&#xff08;小程序已经强制使用https&#xff09;等项目的标配。关于SSL证书安装使用的问题今天总结下&#xff0c;以备用。 环境配置&#xff1a;windows server 2008 R2和IIS7.0 1、 安装SSL证书的环境 (温馨提示&#xff1a;安装证书前请先备份…

如何为JBoss Developer Studio 8设置集成和SOA工具

最新的JBoss Developer Studio&#xff08;JBDS&#xff09;的发布带来了有关如何开始使用尚未安装的各种JBoss Integration和BPM产品工具集的问题。 在本系列文章中&#xff0c;我们将为您概述如何安装每套工具并说明它们支持哪些产品。 这将有助于您在着手进行下一个JBoss集…

YUM常用命令介绍

1.列出所有可更新的软件清单命令&#xff1a;yum check-update 2.安装所有更新软件命令&#xff1a;yum update 3.仅安装指定的软件命令&#xff1a;yum install <package_name> 4.仅更新指定的软件命令&#xff1a;yum update <package_name> 5.列出所有可安裝的软…

WildFly 8的Camel子系统集成了Java EE –入门

就在三天前&#xff0c;围绕Thomas Diesler&#xff08; tdiesler &#xff09;的团队发布了WildFly-Camel子系统的2.0.0.CR1版本&#xff0c;它允许您将Camel Routes添加为WildFly配置的一部分。 路由可以部署为JavaEE应用程序的一部分。 JavaEE组件可以访问Camel Core API和各…

jQuery中国各个省份地图分部代码

jQuery中国各个省份地图分部代码 在线演示本地下载更多专业前端知识&#xff0c;请上 【猿2048】www.mk2048.com

封装axios的接口请求数据方法

lib文件夹中http.js文件的内容 包含了数据请求&#xff0c;路由的拦截&#xff0c;同时向外界暴露的是一个方法&#xff0c;方法内有三个参数&#xff0c;分别为请求的方式&#xff0c;地址&#xff0c;数据 1 import axios from axios;2 import qs from qs;3 4 const serverax…

Spring Boot Actuator:自定义端点,其顶部具有MVC层

Spring Boot Actuator端点允许您监视应用程序并与之交互。 Spring Boot包含许多内置端点&#xff0c;您也可以添加自己的端点。 添加自定义端点就像创建一个从org.springframework.boot.actuate.endpoint.AbstractEndpoint扩展的类一样容易。 但是Spring Boot Actuator也提供了…

jQuery自适应倒计时插件

jQuery自适应倒计时插件 在线演示本地下载更多专业前端知识&#xff0c;请上 【猿2048】www.mk2048.com

Linux三大共享文件的方法

1. Samba Samba 用于Linux 和windows之间的共享&#xff0c;ubuntu里面默认没有安装samba 在安装好samba之后&#xff0c;就用开始配置samba服务: Samba服务器主要配置文件为/etc/samba/smb.conf&#xff0c;并且可以将NetBIOS名与主机的对应关系写在/etc/samba /lmhosts文件中…