其他浏览器

Question

使用以下代码行，我可以在Firefox，Chrome，Opera的Ajax调用响应中下载文件。但是，在IE中，不支持href属性download。因此，以下在IE中不起作用。

HTML：

 <div class="fRight" style="margin-left:5px; margin-rigth:5px" >
    <input type="button" value="Request File"  id = "chReqFileBtn"  onclick = "handleClick"/>
    <a href="#" id="challengeReqFileAnchor" style="visibility: hidden"></a>
 </div>

JavaScript的：

function handleClick()
{
    var code = $('#code').val();
    var quantity = $('#quantity').val();

    var req = $.ajax(
    {
        'type': 'POST',
        'url' : $apiBasePath+'config/challenge-file',
         contentType : 'application/json',
        'data': JSON.stringify({'code':code, 'quantity':quantity}),
        'success':function(response, status, xhr)
        {
            var code = xhr.getResponseHeader('Operation-Code');

            var anch = $('#challengeReqFileAnchor');
            anch.attr(
            {
                "download" : 'request.bin',
                "href" : "data:text/plain," + response       
            });
            anch.get(0).click();
        },
        'error': function(request,status,errorThrown) 
        {
           ......
        }
    });
    $pendingReqs.push(req);  
}

我还有哪些选项可以在IE中完成相同的行为？

Answer 1

IE和iOS Safari不支持

Download attribute

IE＆LT; 10：

使用SaveAs命令execCommand可以通过使元素的内容可下载来实现这一目的。

缺点：

在Win7上运行的某些IE版本中的问题[我不知道它是否已修复Here]
需要DOM元素来包含数据

IE＆GT; = 10

使用msSaveBlob，它是一种允许通过发送此标题来保存Blob或文件的方法：

Content-Length: <blob.size>
Content-Type: <blob.type>
Content-Disposition: attachment;filename=<defaultName>
X-Download-Options: noopen

检查Saving files locally using Blob and msSaveBlob

缺点：

需要定义Blob

其他浏览器

如果您不想自己实现所有这些，那么有一个很好的库FileSaver.js可以在客户端保存生成的文件。它支持Firefox，Chrome，Android for Android，IE 10 +，Opera和Safari。对于IE＆lt; 10，有一个库的分支，它添加saveTextAs来保存文本文件（.htm，.html，.txt）

跨浏览器解决方案

接收文件名，数据，meme类型的服务器端脚本然后发送带有标题Content-Disposition: attachment; filename=FILENAME的文件

Answer 2

IE does not support download tag。

但是你可以使用丑陋的黑客。

创建一个不可见的iframe：

<iframe id="dummy" style="display:none; visibility:hidden"></iframe>

将您的数据写入iframe的document：

var ifd = document.getElementById('dummy').contentDocument;
ifd.open('text/plain', 'replace');
ifd.write('whatever you want to be in the file');
ifd.close();

使用execCommand保存文件（实际上，提示另存为对话框）：
```
ifd.execCommand('SaveAs', true, 'request.bin');
```

请注意，execCommand在IE11中不起作用。我知道几乎不可能完全正确地检测浏览器。但是，如果代码中的文件保存失败，您可以尝试将其作为备份例程。

Answer 3

我认为这与所有专门针对anch.get(0).click();主播的浏览器不支持的hidden相关，因此您可以尝试使用代码，

anch.get(0).show().focus().click().hide();

Answer 4

IE既不支持导航到数据URI也不支持download属性。您可以使用navigator.msSaveBlob保存IE 10+的文件您可以检查window.navigator.msSaveBlob并编写IE特定代码，否则使用现有代码保存文件您可以查看以下链接了解更多详情： Saving files locally using Blob and msSaveBlob

Answer 5

我的javascript版本，用于从IE11下载具有excel的BOM和charset的文件：

$.post('/cup-frontend/requestthewholelist',
    {ipAddressList: validIpAddressListAsString},   // add custom http variables
    function (returnedData) {                      // success return
        var BOM = "\uFEFF";                        // byte order mark for excel

        if (navigator.msSaveBlob) {                // ie block
            console.log("found msSaveBlob function - is't IE")
            var blobObject = new Blob([BOM + returnedData], {type: ' type: "text/csv; charset=utf-8"'});
            window.navigator.msSaveOrOpenBlob(blobObject, "cup_database.csv");
        }
        else {                                     // non-ie block
            console.log("not found msSaveBlob function - is't not IE")
            var a = window.document.createElement('a');
            a.setAttribute('href', 'data:text/plain; charset=utf-8,' + encodeURIComponent(BOM + returnedData));
            a.setAttribute('download', 'example.csv');
            a.click();
        }

    }).fail(function () {
    console.log('post error')
});

Answer 6

最后，经过数小时的研究，我找到了一些对我真正有用的答案。以下方法对我有用。

if (navigator.msSaveBlob) { // For IE
   return navigator.msSaveBlob(blobObj, fileName);
}

在下面的行

navigator.msSaveBlob(blobObj, fileName)

功能 msSaveBlob 将文件保存到磁盘。参数 blobObj 是需要使用给定名称保存在参数 fileName

中的对象。

有关更多信息，请访问以下链接： MDN Webdocs Mozilla

IE下载文件

6 个答案:

IE＆LT; 10：

缺点：

IE＆GT; = 10

缺点：

其他浏览器

跨浏览器解决方案