0
210
ViewsPuppeteer PDF export doesn't render images
I try to export my HTML to a pdf file which works fine except that my images are not loaded.
When I use the headless: false option I see the website with the image loaded, but when I export the PDF the image is just the default icon for a non-loaded image:
My Code:
const browser = await puppeteer.launch({ headless: false, args: ["--explicitly-allowed-ports=" + port] });
const page = await browser.newPage();
await page.setContent(content, { waitUntil: "networkidle0" }); // I also tried "load"
await page.waitFor(2000); // The page should be loaded for sure
await page.emulateMediaType("print");
await page.pdf({ path: "F:\\Desktop\\file.pdf", format: "a4" });
await browser.close();
I already tried media types "screen" and "print", both don't work. The HTML of the web page is:
<html xmlns="http://www.w3.org/1999/xhtml">
<head></head>
<body>
<p>Es handelt sich hierbei um ein File:</p>
<p><strong>File:</strong></p>
<sm-file class="mceNonEditable" title="Bright Solutions _ Digitale Projekt-Checklisten.pdf" data-uuid="AD13E638-6DB5-4DCD-A7F6-03D66C1D24DF" data-name="Bright Solutions _ Digitale Projekt-Checklisten.pdf">
<img src="http://localhost:6666/icon_file.svg" width="20px" height="20px" />
<hr />
Bright Solutions _ Digi... ten.pdf
</sm-file>
<p>Hier kommt dann noch ein Bild hinzu!</p>
</body>
</html>
Does anyone know what I can do so that the image in the PDF is rendered correctly?
·
Juan Pablo Isaza
1 answers
Answer question0
The reason is ERR_UNSAFE_PORT! The port 6666 is considered unsafe. A full list of unsafe ports can be seen here: https://superuser.com/questions/188058/which-ports-are-considered-unsafe-by-chrome So just change the port of the webserver to something that is not on this list and everything works fine.
·
Juan Pablo Isaza
Report
Answer question