CODEWITHSUNDEEP
javascriptjquerypdfiframe
Garfield
Garfield

Reputation: 1232

How to print dynamically generated pdf dataUrl?

I'm trying to print a dynamically generated PDF from a web page.

var $iframe = $('<iframe>');
$iframe.appendTo('body');
$iframe.load(function() {
    var iframe = $iframe[0];
    var result = iframe.contentWindow.document.execCommand("print", false, null);
    if (!result) iframe.contentWindow.print();
    $.remove($iframe);
});
$iframe.attr('src', dataUrl);

execCommand() gives the error message:

Uncaught SecurityError: Blocked a frame with origin "http://localhost:2520" from accessing a frame with origin "null". The frame requesting access has a protocol of "http", the frame being accessed has a protocol of "data". Protocols must match.

Also, setting the src attr gives the warning:

Resource interpreted as Document but transferred with MIME type application/pdf:

The dataUrl looks like this:

data:application/pdf;base64,JVBERi0xLjQKJdP...

EDIT: @Mike C

I can create the iframe and display the pdf, but when I print, it's blank.

<style type="text/css" media="print">
    body * { display:none }
    iframe#theframe { display:block }
</style>

var $iframe = $('<iframe id="theframe" src="'+dataUrl+'"></iframe>');
$iframe.appendTo('body');
$iframe.load(function() {
    setTimeout(function() {
        window.print();
    }, 1000);
});

Upvotes: 3

Views: 5553

Answers (1)

guest271314
guest271314

Reputation: 1

Try utilizing window.open() , document.write() , setTimeout()

var popup = window.open("", "w");

var html = '<!doctype html><html><head></head>'
           + '<body marginwidth="0" marginheight="0" style="background-color: rgb(38,38,38)">'
           + '<embed width="100%" height="100%" name="plugin" src="data:application/pdf;base64,JVBERi0xLjQKJdP..." type="application/pdf">'
           + '<script>setTimeout("print()", 1000)</script></body></html>';

popup.document.write(html);

Upvotes: 1

Related Questions