I have tried pretty much everything at this point and I cannot get anything to work in ie.
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.
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>
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 }); }
I am completely and totally stuck. I have tried everything from google and on here.
My two latest attempts here
3 Answers
Answers 1
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(); } };
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.
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.
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); });
Answers 2
IE, in classic fashion, requires you to use a proprietary method for "saving" a blob.
msSaveBlob
or msSaveOrOpenBlob
is what you're looking for.
Instead of adding it as the href
, add an onclick
handler to your a
tag and call navigator.msSaveBlob(blob, "Sample Name");
Additionally if you need to support other browsers you'll need some other code to support those browsers.
For example:
var content = new Blob(["Hello world!"], { type: 'text/plain' }); var btn = document.getElementById('btn'); if (navigator.msSaveBlob) { btn.onclick = download; } else { btn.href = URL.createObjectURL(content); btn.download = true; } function download() { if (navigator.msSaveBlob) { navigator.msSaveBlob(content, "sample.txt"); } }
<a id="btn" href="#">Download the text!</a>
Answers 3
if you are trying to generate blob URL in IE. it will not work .we have to download the file to local. by using below code
function printPdf(id) { $.ajax({ url: 'url', type: 'POST', data: { 'ID': id }, success: function (result) { var blob = pdfBlobConvesion(result.PdfUrl, 'application/pdf'); var isIE = /*@cc_on!@*/false || !!document.documentMode; // Edge 20+ var isEdge = !isIE && !!window.StyleMedia; if (isIE || isEdge) { window.navigator.msSaveOrOpenBlob(blob, "ProviderOfficePDF.pdf"); } else { var blobUrl = URL.createObjectURL(blob); window.open(blobUrl, "_blank"); } } } }); } function pdfBlobConvesion(b64Data, contentType) { contentType = contentType || ''; var sliceSize = 512; b64Data = b64Data.replace(/^[^,]+,/, ''); b64Data = b64Data.replace(/\s/g, ''); var byteCharacters = window.atob(b64Data); var byteArrays = []; for ( var offset = 0; offset < byteCharacters.length; offset = offset + sliceSize ) { var slice = byteCharacters.slice(offset, offset + sliceSize); var byteNumbers = new Array(slice.length); for (var i = 0; i < slice.length; i++) { byteNumbers[i] = slice.charCodeAt(i); } var byteArray = new Uint8Array(byteNumbers); byteArrays.push(byteArray); } var blob = new Blob(byteArrays, { type: contentType }); return blob; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
} else { var blobUrl = URL.createObjectURL(blob); window.open(blobUrl, "_blank"); }
//called method
Function pdfBlobConvesion(b64Data, contentType) {
var contentType =contentType || ''; var sliceSize = 512; b64Data = b64Data.replace(/^[^,]+,/, ''); b64Data = b64Data.replace(/\s/g, ''); var byteCharacters = window.atob(b64Data); var byteArrays = []; for (var offset = 0; offset < byteCharacters.length; offset += sliceSize) { var slice = byteCharacters.slice(offset, offset + sliceSize); var byteNumbers = new Array(slice.length); for (var i = 0; i < slice.length; i++) { byteNumbers[i] = slice.charCodeAt(i); } var byteArray = new Uint8Array(byteNumbers); byteArrays.push(byteArray); } var blob = new Blob(byteArrays, { type: contentType }); return blob; }
0 comments:
Post a Comment