ajax post下载文件/流

Posted 2023-04-27

我现在有一个需求
表单form1，有很多个input，都是本文。我需要写一个js方法。来模拟提交这个表单，action="do.php"，然后提交后弹出一个保存对话框，让用户进行下载，但是我发现我没法用ajax 来弹出这个保存对话框，按照网上高手说的用临时的一个form提交后来弹出保存对话框，我现在就是不知道该如何去编写这个临时的form。。
var data1 = $('#form1').serialize();
window.open("List.ashx?cmd=DaoChu&" + data1 + JSON.stringify(columns) + "&ckColums:" + liger.get("ck2").getValue());

我最先是用的window.open来做，但是现在data1的数据很大，这样做肯定不行了。。该成 ajax 就不能弹保存对话框

Form里面有你很多的input

其实只要在你Form里面隐藏一个iframe

<iframe name="downloadFrame" style="display: none;" frameborder="0"></iframe>

然后 提交表单 把target指向这个Iframe就行了

$("#formId").attr("action","下载的URL");

$("#formId").attr("target","downloadFrame");//iframe的名字

$("#formId").submit();

Ajax 即“Asynchronous javascript And XML”（异步 JavaScript 和 XML），是指一种创建交互式网页应用的网页开发技术。

Ajax = 异步 JavaScript 和 XML（标准通用标记语言的子集）。

Ajax 是一种用于创建快速动态网页的技术。

Ajax 是一种在无需重新加载整个网页的情况下，能够更新部分网页的技术。[1] 

通过在后台与服务器进行少量数据交换，Ajax 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下，对网页的某部分进行更新。

传统的网页（不使用 Ajax）如果需要更新内容，必须重载整个网页页面。

该技术在 1998 年前后得到了应用。允许客户端脚本发送HTTP请求（XMLHTTP）的第一个组件由Outlook Web Access小组写成。该组件原属于微软 Exchange Server，并且迅速地成为了 Internet Explorer 4.0 的一部分。部分观察家认为，Outlook Web Access 是第一个应用了 Ajax 技术的成功的商业应用程序，并成为包括Oddpost 的网络邮件产品在内的许多产品的领头羊。但是，2005 年初，许多事件使得 Ajax 被大众所接受。Google 在它著名的交互应用程序中使用了异步通讯，如Google、Google 地图、Google 搜索建议、Gmail等。Ajax 这个词由《Ajax: A New Approach to Web Applications》[2]  一文所创，该文的迅速传播加强了人们使用该项技术的意识。另外，对Mozilla/Gecko 的支持使得该技术走向成熟，变得更为易用。

Ajax 前景非常乐观，可以提高系统性能，优化用户界面。Ajax 现有直接框架 AjaxPro，可以引入 AjaxPro.2.dll 文件，可以直接在前台页面 JavaScript 调用后台页面的方法。但此框架与表单验证有冲突。另外微软也引入了 Ajax 组件，需要添加 AjaxControlToolkit.dll 文件，可以在控件列表中出现相关控件。

参考技术A <form action="" method="post" name="aa" target="_blank"></form>
<input type="button" onClick="a()">
<script>
// 用户单击 不会提示拦截弹出窗口
function a()
document.forms['aa'].submit();
</script>

在本页面 打开rar 等类型文件会自动提示下载的, 如果要自定义下载文件名字,那需要php 的文件

用上面这个把

这个可以在新窗口打开, 不能设置新窗口大小, 如果要实现新窗口大小可以用

$.ajax()

来模拟一个,原理: 用js 创建一个div 模拟新页面

//先把 submit 按钮 js 修改成 button
$.ajax("url",
    data:"提交参数",
    dataType:"json",  //xml  html   script  jsonp
    success:function(data, textStatus, jqXHR)
    //操作,弹出层,模拟新页面操作
    //data 可能是 xmlDoc, jsonObj, html, text, 等等...
  //textStatus   返回状态
    
);

 

php 下载页面,

$file_dir = dirname(__FILE__).'/';
$file_name = "demo.txt";
$file_name_new = "demo2.txt";  //自定下载文件名称

if   (!file_exists($file_dir.$file_name))      //检查文件是否存在 
  echo   "文件找不到"; 
  exit;   
     else    
$file = fopen($file_dir . $file_name,"r"); // 打开文件
// 输入文件标签
header("Content-type: application/octet-stream");
header("Accept-Ranges: bytes");
header("Accept-Length: ".filesize($file_dir . $file_name));
header("Content-Disposition: attachment; filename=" . $file_name_new);
// 输出文件内容
echo fread($file,filesize($file_dir . $file_name));
fclose($file);
exit();

参考技术B

Form里面有你很多的input

其实只要在你Form里面隐藏一个iframe

<iframe name="downloadFrame" style="display: none;" frameborder="0"></iframe>

然后 提交表单 把target指向这个Iframe就行了

$("#formId").attr("action","下载的URL");
$("#formId").attr("target","downloadFrame");//iframe的名字
$("#formId").submit();

本回答被提问者采纳

Ajax请求导出Excel的问题

原文地址：http://yuwenlin.iteye.com/blog/2275289

1.Ajax请求导出Excel的问题描述：

　　前端发起Ajax请求get或post，后台使用Poi生成excel文件，最后用response输出excel文件流。整个调用过程都没有报任何错，excel文件也生成在本地，但浏览器没有弹出文件下载，毫无反应。

2.解决：

　　开始一直以为是浏览器兼容性，或后台输出文件流代码有问题，调了半天，也都一样，不报任何错。后来上网搜发现在类似的问题，Ajax导出excel没反应，网上有人说不能使用ajax，换成地址重定向location.href就行，一换还真好使。就是ajax请求的问题。

3.总结：

　　导出excel为什么不能用ajax请求？

　　因为导出excel，实际上是文件下载，后台需要往前端（浏览器）写文件流的。而Ajax请求获取数据都是“字符串”，整个交互传输用的都是字符串数据，它没法解析后台返回的文件流，但浏览器可以。

4.Ajax与Form表单提交的区别：

　　Ajax提交不会自动刷新页面，需要手动处理。

　　Form表单提交在数据提交后会刷新页面，如果是Post提交，点击刷新浏览器会提示 是否再次提交。