在IE11中打开由createObjectURL创建的链接

Question

为什么不能在以下演示中打开链接:http:
//html5-demos.appspot.com/static/a.download.html

您甚至无法右键单击并在新选项卡/窗口中打开它.我需要自定义浏览器中的任何设置吗？

Answer 1

此演示使用Blob URL,由于安全限制,IE不支持该URL.

IE有自己的API来创建和下载文件,这就是所谓的msSaveOrOpenBlob.

这是我的跨浏览器解决方案,适用于IE,Chrome和Firefox:

function createDownloadLink(anchorSelector, str, fileName){
    if(window.navigator.msSaveOrOpenBlob) {
        var fileData = [str];
        blobObject = new Blob(fileData);
        $(anchorSelector).click(function(){
            window.navigator.msSaveOrOpenBlob(blobObject, fileName);
            window.navigator.msSaveOrOpenBlob(blobObject, fileName);
        });
    } else {
        var url = "data:text/plain;charset=utf-8," + encodeURIComponent(str);
        $(anchorSelector).attr("download", fileName);
        $(anchorSelector).attr("href", url);
    }
}

$(function () {
    var str = "hi,file";
    createDownloadLink("#export", str, "file.txt");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a id="export" class="myButton" download="" href="#">export</a>

Answer 2

这是将任何文件下载为blob的功能.(在IE和非IE上测试)

var download_csv_using_blob = function (file_name, content) {
    var csvData = new Blob([content], { type: 'text/csv' });
    if (window.navigator && window.navigator.msSaveOrOpenBlob) { // for IE
        window.navigator.msSaveOrOpenBlob(csvData, file_name);
    } else { // for Non-IE (chrome, firefox etc.)
        var a = document.createElement("a");
        document.body.appendChild(a);
        a.style = "display: none";
        var csvUrl = URL.createObjectURL(csvData);
        a.href =  csvUrl;
        a.download = file_name;
        a.click();
        URL.revokeObjectURL(a.href)
        a.remove();
    }
};

注意:如果需要,请更改文件类型.