ie11下载Base64文件

2022-01-21 00:00:00 base64 javascript

此时我已经尝试了几乎所有方法，但我无法在 ie 中使用任何东西.

I have tried pretty much everything at this point and I cannot get anything to work in ie.

我需要 ie 从附件面板下载 base64 文档.我无权访问服务器端代码或数据库.图片不能存放在要拉取的文件夹中，需要以这种方式呈现.

I need ie to download base64 documents from an attachment panel. I have no access to the server side code or database. The images cannot be stored in a folder to be pulled up, they need to be presented this way.

我尝试使用纯链接并将 base64 刺痛粘贴在那里，它只是打开了一个新的空白窗口.

I have tried using a plain link and sticking the base64 sting in there and it just opens up a new blank window. 

<a target="_blank" download class="btn btn-primary downloadAttachment" href="' + blobUrl + '" >Download</a>

我尝试将 url 转换为 blob 并打开 blob，这导致浏览器不执行任何操作.

I have tried turning the url into a blob and opening the blob and that resulted in the browser not doing anything. 

function base64toBlob(base64Data, contentType) {
    contentType = contentType || '';
    var sliceSize = 1024;
    var byteCharacters = base64Data;
    var bytesLength = byteCharacters.length;
    var slicesCount = Math.ceil(bytesLength / sliceSize);
    var byteArrays = new Array(slicesCount);

    for (var sliceIndex = 0; sliceIndex < slicesCount; ++sliceIndex) {
        var begin = sliceIndex * sliceSize;
        var end = Math.min(begin + sliceSize, bytesLength);

        var bytes = new Array(end - begin);
        for (var offset = begin, i = 0 ; offset < end; ++i, ++offset) {
            bytes[i] = byteCharacters[offset].charCodeAt(0);
        }
        byteArrays[sliceIndex] = new Uint8Array(bytes);
    }
    return new Blob(byteArrays, { type: contentType });
}

我完全被卡住了.我已经尝试了 google 和这里​​的所有内容.

I am completely and totally stuck. I have tried everything from google and on here.

我最近的两次尝试

https://jsfiddle.net/pqhdce2L/

http://jsfiddle.net/VB59f/464/

推荐答案

前段时间，我创造了这个函数来下载(提供/初始化")一个接受 Blob 或 base64 的 xlsx 或 csv 内容字符串:

Some time ago I've coined this function to make ("offer/initialize") a download of an xlsx or csv content accepting both a Blob or a base64 string:

// Initializes a file download of a provided content
//
// Not usable outside browser (depends on window & document)
//
// @param {Blob|base64} cont File content as blob or base64 string
// @param {string} ftype File type (extension)
// @param {string} [fname='export.' + ftype] File name
// @param {string} [mime='application/zip'] File mime type
// @returns {void}
function makeFileDownload(cont, ftype, fname, mime) {
    if (!fname) fname = 'export.' + ftype;
    if (!mime) mime = ftype === 'csv' ? 'text/csv' : 'application/zip'; // or 'application/vnd.ms-excel'

    if (Object.prototype.toString.call(cont) === '[object Blob]'
            && window.navigator && window.navigator.msSaveBlob) {
        window.navigator.msSaveBlob(cont, fname);
    }
    else {
        var downloadLink = document.createElement('a');
        downloadLink.download = fname;
        downloadLink.href = typeof cont === 'string'
            ? 'data:' + mime + ';base64,' + cont
            : window.URL.createObjectURL(cont);
        downloadLink.onclick = function(e) { document.body.removeChild(e.target); };
        downloadLink.style.display = 'none';
        document.body.appendChild(downloadLink);
        downloadLink.click();
    }
};

这应该能够同时接受 Blob 和 base64 字符串 - 您应该了解它是如何从 if/else 块中为 Blob 和 base64 字符串完成的.

This should be able to accept both Blob and base64 string - you should get the idea how it's being done for either a Blob and a base64 string from the if/else block.

如果传递 base64 字符串有问题，只需先将其转换为 Blob(例如在此 SO question 中建议，这个答案专门针对IE11).根据您的预期使用情况调整 mime 默认值.

If passing it base64 string is problematic just convert it to a Blob first (as suggested for example in this SO question, this answer is specifically aimed at IE11). Adjust the mime defaults according to your expected usage.

我想你已经有了内容(Blob/base64)，保留你的原始链接(我想它是由用户点击的)一个普通链接或更确切地说是一个按钮(即没有 download/href 属性)，为其附加一个单击事件处理程序，您将在其中调用该函数，它应该为您初始化下载:

I suppose you already have the content (Blob/base64), keep your original link (which I suppose is to be clicked by an user) a plain link or rather a button (i.e. without the download/href attributes), attach it a click event handler where you'll call the function and it should initialize the download for you:

document.querySelector('#originalLink').addEventListener('click', function () {
    makeFileDownload(content, extension, filename, mimetype);
});

相关文章