php - ajax请求下载文件 - 异步下载文件




使用“AJAX”下载CSV文件 (4)

编辑我刚刚尝试使用10MB文件,似乎val()太慢,无法插入数据。 Hurrumph。

好的,所以我给了另一个去。 这可能是也可能不是完全疯了! 我们的想法是创建一个AJAX请求来创建数据,然后使用回调将数据插入到当前页面上的隐藏表单中,该页面具有第三个“下载”页面的操作; 插入后,表单自动提交,下载页面发送标题并回显POST,等等,下载。

一直以来,在原始页面上,您已经指示文件正在准备中,并且在完成时指示符已更新。

注意:此测试代码未经过广泛测试,并且没有真正的安全检查(或根本没有)。 我用1.5MB的CSV文件对它进行了测试,这个文件非常合理。

的index.html

<a id="downloadlink" href="#">Click Me</a>
<div id="wait"></div>
<form id="hiddenform" method="POST" action="download.php">
    <input type="hidden" id="filedata" name="data" value="">
</form>

test.js

$(document).ready(function(){
  $("#downloadlink").click(function(){       // click the link to download
      lock();                                // start indicator
      $.get("create.php",function(filedata){ // AJAX call returns with CSV file data
          $("#filedata").val(filedata);      // insert into the hidden form
          unlock();                          // update indicator
          $("#hiddenform").submit();         // submit the form data to the download page
      });
  });

  function lock(){
      $("#wait").text("Creating File...");
  }

  function unlock(){
      $("#wait").text("Done");
  }
});

create.php

<?php
//create $data
print $data;
?>

的download.php

<?php
header("Pragma: public");
header("Expires: 0"); 
header("Cache-Control: must-revalidate, post-check=0, pre-check=0");
header("Content-Type: text/x-csv");
header("Content-Disposition: attachment;filename=\"search_results.csv\""); 

if($_POST['data']){
    print $_POST['data'];
}
?>

我正在尝试为我的网站完成一个相当简单的任务,但我不确定如何去做。我希望用户查看一个表,然后单击一个按钮,此时用户可以保存该表的内容为csv文件。此请求有时可能非常复杂,因此我生成一个进度页面以提醒用户。

除了实际生成csv文件之外,我发现了大多数事情。 (我使用jQuery和PHP)

点击运行jQuery代码:

hmis_query_csv_export: function(query_name) {
    $.uiLock('<p>Query Loading.</p><img src="/images/loading.gif" />')
    $.get({
        url: '/php_scripts/utils/csv_export.php',
        data: {query_name: query_name},
        success: function(data) {
            $.uiUnlock();
        }
    });}

相关的PHP:

header("Content-type: text/x-csv");
header("Content-Disposition: attachment; filename=search_results.csv");
//
//Generate csv
//
echo $csvOutput
exit();

这样做是将文本作为PHP文件发送,但它不会生成下载。 我究竟做错了什么?


为了回应和扩展其他人所说的内容,你无法使用AJAX真正发送文件。 其中一个原因是(并且有人纠正我,如果我错了,请)您当前所在的页面已经发送了其内容标题; 你不能再将它们发送到同一个窗口,即使有一个AJAX请求(这是你的PHP文件试图做的)。

我之前在项目中所做的是简单地将链接(带有target =“_ blank”或javascript重定向)提供给单独的下载PHP页面。 如果您正在使用Apache,请查看mod_xsendfile。


完成此任务的最佳方法是使用数据URI,如下所示:

  1. 按正常方式对服务器进行AJAX调用
  2. 在服务器端生成CSV
  3. 返回数据(裸露或JSON结构内部)
  4. 使用返回的数据在Javascript中创建数据URI
  5. 将window.location.href设置为Data URI

请参阅此链接以获取相关说明(特别是第3段): http://en.wikipedia.org/wiki/Data_URI_schemehttp://en.wikipedia.org/wiki/Data_URI_scheme

这样,您不需要在服务器上保存任何文件,也不需要使用iframe或隐藏的表单元素或任何此类黑客。


我不认为您可以使用AJAX / JS请求进行浏览器下载。 尝试使用隐藏的iframe导航到生成CSV的页面





csv