3

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);
});
Garfield
  • 1,192
  • 3
  • 12
  • 22
  • 1
    possible duplicate of [Get DOM content of cross-domain iframe](http://stackoverflow.com/questions/6170925/get-dom-content-of-cross-domain-iframe) – Mike Cluck Aug 28 '15 at 22:43
  • I don't need to get content, already have content! I just need to print. – Garfield Aug 28 '15 at 23:03
  • Isn't it more comfortable for the user if the PDF is displayed instead of printed? Maybe they would rather want to save the PDF or even make a screenshot for one reason or another. I don't think that a print-a-PDF button would be very convenient. – Kijewski Aug 28 '15 at 23:38
  • @PaulBrown _"trying to print a dynamically generated PDF from a web page."_ Can include `js` that returns `data URI` at Question ? – guest271314 Aug 29 '15 at 02:09
  • It does an ajax call to the server to get the data URI. – Garfield Aug 29 '15 at 02:18
  • @PaulBrown I'm having the exact same issue. Did you ever resolve this? – jtate Nov 07 '16 at 15:27

1 Answers1

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);
guest271314
  • 1
  • 15
  • 104
  • 177
  • Chrome displays the pdf in a short scroll box (150px high). It opens the print dialog but the page is blank with headers and footers. FF also displays the pdf in 150px high scroll box but does not bring up a print dialog. IE11 does not display the pdf at all, and does not bring up a print dialog. – Garfield Aug 31 '15 at 18:06
  • @PaulBrown _"It does an ajax call to the server to get the data URI. "_ Can include `js` which performs `$.ajax()` at Question ? Tried returning response as `Blob` ? See http://stackoverflow.com/q/12876000/ – guest271314 Aug 31 '15 at 18:11
  • I base64 encode on the server... but try here http://stackoverflow.com/a/18650249/358954 – Garfield Aug 31 '15 at 19:38
  • @PaulBrown Another option would be to save current `window.location.href` to variable , set `location.href` to `data URI` , add `onfocus` event to `window` where `location.href` would be set to saved `location.href` , call `print()` , when user focuses back to top window should be returned to original `location.href` ; see http://stackoverflow.com/a/31763030/ – guest271314 Aug 31 '15 at 20:57