Question

17

Open jsPDF created pdf in Chrome's new tab/window

rated 0 times [ 23] [ 6] / answers: 1 / hits: 17802 / 5 Years ago, fri, february 8, 2019, 12:00:00

How can I open with javascript link data:application/pdf;filename=generated.pdf;base64;DATA in Chrome 71?

Link from console opened successfully, but not from code - unfortunately.

The snippet does not work for security reason. Only for code demonstration.

I read some similar questions, but did not find an answer.

var button = document.getElementById(button);



button.addEventListener(click, generate, false);



function generate() {



  var doc = new jsPDF({

    orientation: l,

    unit: mm

  });



  doc.text('ACT', 130, 20);

  var string = doc.output('datauristring');

  console.log(string);

  var link = document.createElement('a');

  link.href = string;

  link.setAttribute('target', '_blank');

document.body.appendChild(link);

  link.click();

  link.parentNode.removeChild(link);

}

<script src=https://unpkg.com/[email protected]/dist/jspdf.min.js></script>

<button id=button>Generate pdf table</button>

Answers

Only authorized users can answer the question. Please sign in first, or register a free account.

makiyac

Add To Favorites

Follow

Total Points: 470

Total Questions: 100

Total Answers: 115

Location: Botswana

Member since Sat, Jan 7, 2023

1 Year ago

answered 5 Years ago ellisw · Accepted Answer

Try window.open() instead. The following code worked for me. You will need to modify the window/page size.

let dataSrc = pdf.output(datauristring);

let win = window.open(, myWindow);

win.document.write(<html><head><title>jsPDF</title></head><body><embed src= + 

    dataSrc + ></embed></body></html>);

Update:

Didn't realize that jsPDF comes with a built-in method pdf.output('dataurlnewwindow');, which uses iframe,

The downside of pdf.output('dataurlnewwindow') is that it opens a new tab/window with datauristring as the pdf file name and the download button doesn't work, while window.open(pdf.output('bloburl')) seems fine with the download button.

Okay, pdf file can be renamed like this:

pdf.setProperties({

    title: jsPDF sample

});

Update 2:

To avoid the page being cut off when a page is zoomed, you can set the html2canvas scale accordingly.