发表新帖
发表新帖

how to display base64 encoded pdf?

前端 未结
关注
3 444
被撕碎了的回忆
被撕碎了的回忆 2020-12-01 16:03

I have to display base64 pdf in new tab. I am using below code

 var windo = window.open(\"\", \"\");  
 var objbuilder = \'\';
 objbuilder += (\'
相关标签:
3条回答
  • 被撕碎了的回忆
    2020-12-01 16:30

    for those who still can't do it, i found this in someone else answer, but i don't remember who...

    var objbuilder = '';
objbuilder += ('<object width="100%" height="100%" 
data="data:application/pdf;base64,');
objbuilder += (myBase64string);
objbuilder += ('" type="application/pdf" class="internal">');
objbuilder += ('<embed src="data:application/pdf;base64,');
objbuilder += (myBase64string);
objbuilder += ('" type="application/pdf"  />');
objbuilder += ('</object>');

var win = window.open("#","_blank");
var title = "my tab title";
win.document.write('<html><title>'+ title +'</title><body style="margin-top: 
0px; margin-left: 0px; margin-right: 0px; margin-bottom: 0px;">');
win.document.write(objbuilder);
win.document.write('</body></html>');
layer = jQuery(win.document);

    this way we open the pdf in a new tab.

    0 讨论(0)
  • 攒了一身酷
    2020-12-01 16:33 
    function printPreview(data){
        var type = 'application/pdf';
        let blob = null;
        const blobURL = URL.createObjectURL( pdfBlobConversion(data, 'application/pdf'));
        const theWindow = window.open(blobURL);
        const theDoc = theWindow.document;
        const theScript = document.createElement('script');
        function injectThis() {
            window.print();
        }
        theScript.innerHTML = 'window.onload = ${injectThis.toString()};';
        theDoc.body.appendChild(theScript);
    }
  //converts base64 to blob type for windows
    function pdfBlobConversion(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;
        }

    pass base64 data to this function and it will show the pdf in new window. This is working in chrome and firefox not in IE. Any help Please. I want it to work in IE also. Its giving error where I give the bloburl to window.

    0 讨论(0)
  • 醉酒成梦
    2020-12-01 16:35

    It should work with Chrome you can use

    <iframe src="data:base64...">

    <object data="data:base64...">

    I've faces same issue with IE: it's impossible to display a pdf with a base64 string.

    I had to generate temporary files on the server for display them with IE he only display existing file by using a path.

    You still can use JS library to display your pdf like PDF.js.

    0 讨论(0)
 看不清?
提交回复
热议问题