Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

ie11 Downloading Base64 documents

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

https://jsfiddle.net/pqhdce2L/

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

like image 759
zazvorniki Avatar asked Feb 12 '18 19:02

zazvorniki


Video Answer


1 Answers

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;
}
like image 148
Pravat Kumar Routray Avatar answered Sep 19 '22 14:09

Pravat Kumar Routray