Ajax 文件下载问题

Posted

技术标签:

【中文标题】Ajax 文件下载问题【英文标题】:Ajax File download Issue 【发布时间】:2010-12-05 01:19:47 【问题描述】:

我正在我的应用程序中下载一个动态文件,使用 iframe 模拟 ajax。我正在做的是,当发出下载请求时,我将创建一个动态的不可见 iframe,并将我的 iframe 的 src 设置为下载 url。我能够成功下载文件,但要求是显示下载下载开始后的指示器,并且在下载对话框出现后应该立即完成。我在 iframe 创建后提供回调以显示下载指示器,该指示器正在成功工作,并在 iframe 的“onload”上提供了另一种方法,期待当下载对话框出现时,它将被调用。但不幸的是,这不起作用,因此即使在下载完成后,我的进度指示器仍然存在。我无法删除它。然后我意识到,由于响应的内容类型不是 html,它将由一个单独的进程提供服务,这会导致下载对话框,因此我的 onload 方法永远不会被调用。请告诉我一个解决方案。

【问题讨论】:

【参考方案1】:

您可以使用 Flash 下载管理器 - 谷歌会显示其中的一大堆。

您的另一个选择是使用真正的 AJAX。只需向下载 URI 发出请求,当您收到响应时,请使用 responseBody 而不是 XMLHTTPRequest 对象的 responseText 属性。

您需要一种将其写入硬盘驱动器的方法,这可以在具有宽松安全约束的 IE 和 ActiveXObject "Scripting.FileSystemObject" 中完成 您也许可以使用数据 uri 方法:http://en.wikipedia.org/wiki/Data_URI_scheme 和base64 编码,但我不确定这是否可行。

否则,您将返回闪存将通过 ajax 下载的数据写入磁盘。

如果您知道动态下载的大小并且规范中不需要确切的时间,那么您可以在下载之前进行网速检查,在计算出的下载文件所需的时间中添加一些缓冲时间,并且只显示给定时间段的对话框。非常骇人听闻,但话说回来,这个计划似乎有点营销要求它成为它应该成为的

【讨论】:

【参考方案2】:

看看这个,可能对你有帮助

http://code.msdn.microsoft.com/AjaxFileDownload

【讨论】:

【参考方案3】:

看看这个,可能对你有帮助

http://bytes.com/topic/javascript/answers/610641-file-download-ajax

【讨论】:

这就是我一直在寻找的。谢谢 ! :)【参考方案4】:

您应该在发出下载请求时在客户端中启动一个计时器,以指定的时间间隔测试 iframe 的状态:

if ( ( iframe.document && iframe.document.readyState == 'complete' )
    || iframe.contentDocument )

    stopTimer();
    closePopupDialog();

【讨论】:

上面一个非常接近解决方案,但就我而言,即使在下载后,readyState 也从未达到“完成”,它仍然处于“交互”状态。知道可能是什么问题吗? ? 刚刚知道,内容处置在其中发挥了作用。查看 this 此方法不幸 不起作用,因为跨浏览器的 readyState 行为不稳定。例如 Chrome 永远不会改变。【参考方案5】:

我创建了jQuery File Download plugin (Demo),它也解决了这个问题并提供了一些其他不错的功能。它基本上为您提供了文件下载(甚至包括回调)的“完整的类似 Ajax”的体验,这对于文件下载来说通常是不可能的。它的工作原理与 iframe 的其他一些答案非常相似,但有一些很酷的功能,我发现它们非常方便:

无论下载成功还是出错,用户都不会离开他们启动文件下载的同一页面 successCallback 和 failCallback 函数可让您明确了解在任一情况下的 UI 行为 结合 jQuery UI,开发人员可以轻松地显示一个模式,告诉用户正在下载文件,在下载开始后解散模式,甚至以友好的方式通知用户发生了错误。有关此示例,请参阅 Demo。

这是一个简单的用例演示,使用带有 Promise 的插件 source。 demo page 还包括许多其他“更好的用户体验”示例。

$.fileDownload('some/file.pdf')
    .done(function ()  alert('File download a success!'); )
    .fail(function ()  alert('File download failed!'); );

【讨论】:

以上是关于Ajax 文件下载问题的主要内容,如果未能解决你的问题,请参考以下文章

使用 Ajax 从 Servlet 下载文件

ajax访问json文件缓存问题

Ajax 文件上传

用于下载文件的php代码不适用于ajax [重复]

Asp.net 使用 Ajax 上传多个文件

Ajax 文件上传