使用jQuery Ajax调用下载并保存文件

我想使用jQuery，特别是Ajax调用，从浏览器下载并保存一个文件

我找到了这篇文章：并用隐藏的iFrame测试了Andrew Dunn提供的解决方案。在一个简单的情况下，它工作正常，服务器运行良好，提供了内容配置：附件。。。标题，我得到另存为弹出窗口，一切正常

然而，我的情况更复杂：假设请求不仅仅是一个简单的URL；必须提供额外的请求头，可能它甚至不是一个GET方法，而是一个带有一些奇特的JSON负载的POST。这意味着我应该能够“替换”浏览器内置的get页面机制，并提供我的AJAX请求

为了简单起见，假设我只需要为请求提供一个基本的身份验证头。但请记住，我可能需要更复杂的请求

我对JavaScript和jQuery不太熟悉，所以我疯狂地在谷歌上搜索，最终找到了一个几乎完全相同的解决方案。这个想法：

• 将隐藏的iframe添加到页面
• 将表单添加到框架中
• 定义表单的提交函数，该函数将调用我的AJAX函数，我可以在其中添加所需的身份验证（或任何其他所需的头…）
• 以编程方式调用submit

以下是相关代码片段：

function getFile(url)
{

//Creating the iframe
  iframe = document.createElement('iframe');
  iframe.id = hiddenIFrameID;
  iframe.style.display = 'none';
  document.body.appendChild(iframe);

// Adding the form to the frame
  var externalHtml = '<form id="downloadForm" action="javascript: void(0);"></form>';
  $(document.getElementById(hiddenIFrameID)).contents().find('body').html(externalHtml);
  var formObj = $(document.getElementById(hiddenIFrameID));
  var form = formObj.contents().find('#downloadForm');

// set the submit action to call my ajax function
  form.submit(function () { getURL(url); });

// execute form's submit
  form.submit();
}

function getURL(url)
{
  var response;
  var jqXHR =
    $.ajax(
      {
        type: "GET",
        url: url,
        async: false,
       // authentication, etc
      }
    );
  jqXHR.done( function (data) { response = data;});
  return response;
}

函数getFile（url）
{
//创建iframe
iframe=document.createElement（'iframe'）；
iframe.id=hiddenIFrameID；
iframe.style.display='none'；
document.body.appendChild（iframe）；
//将窗体添加到框架中
var externalHtml=''；
$（document.getElementById（hiddenIFrameID））.contents（）.find（'body'）.html（externalHtml）；
var formObj=$（document.getElementById（hiddenIFrameID））；
var form=formObj.contents（）.find（“#downloadForm”）；
//设置提交操作以调用my ajax函数
submit（函数（）{getURL（url）；}）；
//执行表单的提交
表单提交（）；
}
函数getURL（url）
{
var反应；
var jqXHR=
$.ajax(
{
键入：“获取”，
url:url，
async:false，
//认证等
}
);
jqXHR.done（函数（数据）{response=data；}）；
返回响应；
}

正如我提到的，一切几乎都能工作！通过FireBug，我可以看到，请求已经发出，服务器回复200，发送回文件，回复的内容处置头与简单案例中的相同。。。但我没有看到“保存我们”弹出窗口，下载的文件只是“消失”。顺便说一句，它甚至没有在iFrame中渲染，为了测试，我使该帧可见，并且没有加载任何内容

我有一种感觉，一些非常琐碎的东西丢失了。也许我需要对返回的数据做些什么。。。有什么想法吗？如果您有更好的方法解决这个问题，我也将不胜感激。

@Istvan Klss 我提供的答案基于这样一个假设，即URL直接指向服务器中的文件（或生成的文件）

在这种情况下，您只需将当前页面重定向到该url即可。 由于它不是一个html页面，它将启动浏览器的下载机制

我正在更新

获取URL

功能

function getURL(url)
{
  window.location.href = url;
}

---

文件类型是什么？如果它是PDF，它可能会显示在iframe内部，而iframe是隐藏的。尝试使用不同的文件类型，看看这是否会有所不同？