前后端分离ajax接收文件流的实践

最新推荐文章于 2025-06-20 11:45:36 发布

原创最新推荐文章于 2025-06-20 11:45:36 发布 · 2.3w 阅读

5 ·

CC 4.0 BY-SA版权

文章标签：

#html #javascript #jquery #ajax

jquery 专栏收录该内容

5 篇文章

订阅专栏

本文介绍了一种通过jQuery的$.post方法无法直接实现文件流下载时的替代方案——利用隐藏的HTML form元素进行POST请求，并展示了具体的JavaScript代码实现。此方法适用于需要从服务器下载特定格式文件的场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

一般ajax，post请求不能实现的原因

开始的想法：在页面上用jQuery的$.post方法发送一个请求给服务器，然后服务器根据这个参数再生成相应的一个文件流返回给客户端。但是，在$.post方法的回调函数中，只能处理xml, json, script, or html类型，对返回的文件流却没办法弹出对话框让用户下载了。

另类实现方法

经过百度，看到了很多人采用隐藏form提交的方式，再用response来推就可以


function exportRecord() {
    var searchData = getData();
    var json  = {
        "sid":$.cookie('sid'),
        "searchJson":searchData
    };
    var form = $("<form>");
    form.attr('style', 'display:none');
    form.attr('target', '');
    form.attr('method', 'post'); //请求方式
    form.attr('action', IP+'exportRecord.do');//请求地址

    var input1 = $('<input>');//将你请求的数据模仿成一个input表单
    input1.attr('type', 'hidden');
    input1.attr('name', 'json');//该输入框的name
    input1.attr('value',JSON.stringify(json));//该输入框的值

    $('body').append(form);
    form.append(input1);
    
    form.submit();
    form.remove();

 }