3

这是一个以各种不同方式提出的常见问题，我在下面收集了一些链接并解释了它们为什么不起作用。我正在寻找以下问题的完整解决方案。

在我正在开发的 Web 应用程序中，需要下载具有以下要求的 AJAX-esque 文件

  1. 用户可以单击链接下载文件，而无需被定向到新页面，将收到一个正常的“另存为..”对话框，我们都习惯于在 Web 浏览器中下载文件
  2. 如果由于某种原因服务器无法提供文件，则应调用 javascript 回调。同样，如果服务器成功提供文件
  3. 需要能够修改HTTP请求头来指定，例如请求中的Content-Type HTTP头
  4. 支持所有 A 级浏览器

目前研究的东西：

一个。jquery.fileDownload通过使用表单提交、隐藏 iframe 和让服务器设置特定 cookie 的组合非常优雅地解决了需求 1、2 和 4。我对这个项目非常熟悉（也为它做出了贡献）。但不支持要求 3，因为 HTML 表单提交和 iframe（此库使用）不允许为请求的服务器资源指定 HTTP 标头。（jdownloader也使用了类似的 iframe/form 技术，但它也没有解决要求 3）。

湾。可以使用 XMLHttpRequest 从文件中检索二进制数据（针对不同的浏览器（链接 1、链接 2、链接 3、链接 4、链接 5、链接 6、链接 7、链接 8）进行各种黑客攻击。但没有一个满足要求 1. 二进制数据可以保存在 javascript 变量中，但是无法调用浏览器的“另存为...”对话框来允许用户将此二进制数据保存到硬盘上的文件中

C。此链接（在“下载 + 将文件保存到 HTML5 文件系统”标题下）具有使用 XHR2 的完整端到端解决方案并满足要求 1、2 和 3。但它的支持很差（使用非常新的 HTML5 FileWriter ）。

有没有完整的解决方案？

编辑 我们有更多的选择 - 我计划测试。也许唯一的选择是通过将所有黑客/解决方案收集在一起来为这个问题开发一个库，以便创建一个通用的解决方案。

  1. 根据以下fibertech的解决方案：使用上面的解决方案（b）将文件保存到变量中，然后：

    对于 Internet Explorer：使用 IE 的 execCommand() 保存此数据

    对于其他人：使用数据uris（链接2）和<a>标签的HTML5下载属性来指定名称（链接1，链接2，链接3，链接4）

  2. 此链接提到与使用画布的文件下载能力有关

  3. 下载（还有这个链接）

  4. 一个看似相关的链接，与网络工作者有关，但正在使用 Blob 和FileApi来生成文件。

4

1 回答 1

0

仅 IE 解决方案：

function SaveContents(element) {
    if (typeof element == "string")
        element = document.getElementById(element);
    if (element) {
        if (document.execCommand) {
            var oWin = window.open("about:blank", "_blank");
            oWin.document.write(element.value);
            oWin.document.close();
            var success = oWin.document.execCommand('SaveAs', true, element.id)
            oWin.close();
            if (!success)
                alert("Sorry, your browser does not support this feature");
        }
    }
}

所需的 HTML 示例：

<textarea id="myText"></textarea><br />
<button type="button" onclick="SaveContents('myText');">Save</button>

这会将给定 textarea 的内容保存到名称等于 textarea 的 ID 的文件中。

至于其他浏览器，你可以阅读：Does execCommand SaveAs work in Firefox?

测试用例和工作示例： http: //jsfiddle.net/YhdSC/1/（仅限 IE..）

于 2013-02-13T13:50:10.993 回答