专栏首页后端开发随笔ajax方式下载文件

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/

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 验证调用HttpServletResponse.getWriter().close()方法是否真的会关闭http连接

    线上项目突然遭到大量的非法参数攻击,由于历史问题,之前的代码从未对请求参数进行校验。 导致大量请求落到了数据访问层,给应用服务器和数据库都带来了很大压力。 ...

    2Simple
  • protobuf使用简介

    环境:windows,java 1. protobuf概述 protobuf是Google开发一种数据描述格式,能够将结构化数据序列化,可用于数据存储,通...

    2Simple
  • 配置tomcat限制指定IP地址访问后端应用

    1. 场景 后端存在N个tomcat实例,前端通过nginx反向代理和负载均衡。 tomcat1 tomcatN | ...

    2Simple
  • 大数据可视化服务平台Davinci上榜2019年度最受欢迎中国开源软件

    由宜信科技中心数据中台部自主研发并开源的可视化服务平台Davinci(达芬奇)入选榜单【2019年度最受欢迎中国开源软件】,并在“企业软件”这一细分类目中位列第...

    宜信技术学院
  • 宜信开源|Davinci:可视应用平台介绍与展望

    导读:通过图形化手段清晰地传达数据,促进信息的传递与沟通,是数据可视化的基础要素,也是设计美学和功能相结合的具体表现形式。Davinci便是这样一款可视应用平台...

    宜信技术学院
  • 京东商品详情页应对“双11”大流量的技术实践

    【编者按】此文是根据京东资深Java工程师张开涛11月21日在msup主办的 into100沙龙第14期《京东商品详情页应对大流量的一些实践》演讲中的分享内容整...

    CSDN技术头条
  • 数据结构与算法中C++常用语法

    注:任何人对本文进行引用都要标明作者是Mark Allen Weiss (维斯)  译者: 张怀勇

    Enjoy233
  • 目标检测第2步-数据准备

    在进行本文操作之前,需要先安装好tensorflow的gpu版本。 本文作者的环境:python3.6、Windows10、tensorflow_gpu1.10...

    伏草惟存
  • NUMA特性对MySQL性能的影响测试

    非对称存储访问结构(NUMA,NonUniform Memory Access)是最新的内存管理技术,是对多处理器结构(SMP,Symmetric MultiP...

    莫晓东do
  • 程序员:不能逃避的synchronize和volatile

    首先是我们彼此都要保持一致的观点:原子(Atomic)操作指相应的操作是单一不可分割的操作

    Java猫说

扫码关注云+社区

领取腾讯云代金券