How to Print Pdf in Angular 2

Viewed 35670

I have URL of pdf file for exa url is "test.example.com/incoice/1/download?auth_token="some_token", when I visit this url, url will show me PDF in browser.

Now I want to open this pdf with print function, I mean user do not have to press CTRL+P I want to do this from my side.

I tried iframe but it gives me error of cross origin. This is demo code which i used

//first try

 let _printIframe;
var iframe = _printIframe;
if (!_printIframe) {
    iframe = _printIframe = document.createElement('iframe');
    document.body.appendChild(iframe);

    iframe.style.display = 'none';
    iframe.id  = "printf";
    iframe.name = "printf";
    iframe.onload = function() {
      setTimeout(function() {
        iframe.focus();
        iframe.contentWindow.print();
      }, 1);
    };
  }

// second try 
   // SRC of pdf
iframe.src = "Some API URl " + "/download?access_token=" + 
this.authenticationService.currentTokenDetails.access_token;
let url = iframe.src + "&output=embed";

window.frames["printf"].focus();
window.frames["printf"].print();
var newWin = window.frames["printf"];
newWin.document.write('<body onload="window.print()">dddd</body>');
newWin.document.close();

I created a demo in plunker for print pdf. http://embed.plnkr.co/WvaB9HZicxK6tC3OAUEw/ In this plunker i open pdf in new window but i want to directly print that pdf. how can i do that ?

Any suggestion will be appreciate, and you can correct if I am wrong. Thanks

3 Answers

The previous solution may cause some security issues in newer browsers so we need to use the DOMSanitizer to make it a safe resource.

export class PrintPdfService {
  constructor(protected sanitizer: DomSanitizer) {}

  printPdf(res) {
    const pdf = new Blob([res], { type: 'application/pdf' });
    const blobUrl = URL.createObjectURL(pdf);
    const iframe = document.createElement('iframe');
    iframe.style.display = 'none';
    iframe.src = this.sanitizer.sanitize(SecurityContext.RESOURCE_URL, this.sanitizer.bypassSecurityTrustResourceUrl(blobUrl));
    document.body.appendChild(iframe);
    iframe.contentWindow.print();
  }
}

Angular DOMSanitizer

Related