Can puppeteer reference local files when creating PDF? - Codes Helper - Programming Question Answer

Can puppeteer reference local files when creating PDF?

question 1:

do a function to generate PDF. Html is read locally without network connection.
there is a test.jpg file in the root directory. Now I write the PDF generated by the relative path directly without pictures.

could you tell me how to write the picture so that the picture can be loaded?

const puppeteer = require("puppeteer");
const fs = require("fs");


(async () => {

    const browser = await puppeteer.launch();
    const page = await browser.newPage();
    
    //
    // try {
    //     await page.goto("http://www.baidu.cn");
    // } catch (error) {
    //     console.log(""+ error)
    // }
   
    await page.setContent(`<img src="/images/test.jpg" alt="">
    <div>dddddddd</div>`); 



    try{
        await page.pdf({
            displayHeaderFooter: true,
            path: "demo.pdf",
            format: "A3",
            margin: 
            {
            top: "100px",
            bottom: "200px",
            right: "30px",
            left: "30px",
            }
            
        });
    }catch(err){
        console.log("error:" + err)
    }

    await page.once("load", () => console.log(""));
    await browser.close();

})();

question 2: how do I add the number of pages when setting the header by the page.pdf method in
puppeteer?

the screenshot is an official document, but how can I write it to get the value of pageNumber?

Javascript node.js puppeteer

Feb.08,2022

Thank you for the above two netizens' answers. Thank you. The
problem has been solved. Although you didn't help me solve it directly, you also gave me some ideas. Thank you again.

answer the first question:

I referenced page.goto directly to the directory, and that would be fine. Maybe this module needs a carrier to read the file.

try {

    var pp = await page.goto(`file:${path.join(__dirname)}`);
} catch (error) {
    console.log(""+ error)
}

question 2:
so far I've tested it, and only date works, but I've already implemented it in other ways, so I won't think about it.

is your application a web application or a local application, that is, where is your node.js deployed? Server side? Client?
if it is on the server side, then it is not allowed for the client to access local resources (security is required)
if it is a separate client (all are on the client side, html is just a GUI design), it should be OK. It is recommended that you learn more about application development such as electron.

I also played puppeteer a few days ago

try to concatenate the image address with path.resolve, src=$ {path.resolve ('/ image/test.jpg')} , of course, you have to quote the path module first.
google headerTemplate is used in this way. PageNumber is the name of class.

{
  displayHeaderFooter: true,
  footerTemplate: `
      <span class="pageNumber"></span>/<span class="totalPages"></span>
  `,
  format: 'A4'
}

Previous: Dubbo service registration failed

Next: About json data type handling of mysql

MySQL Query : SELECT * FROM `codeshelper`.`v9_news` WHERE status=99 AND catid='6' ORDER BY rand() LIMIT 5
MySQL Error : Disk full (/tmp/#sql-temptable-64f5-1e9b2b0-1832.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
MySQL Errno : 1021
Message : Disk full (/tmp/#sql-temptable-64f5-1e9b2b0-1832.MAI); waiting for someone to free some space... (errno: 28 "No space left on device")
Need Help?