Adding Header logo on each page using Jspdf and html2canvas

[sandeepseagu]

I am using html2canvas and Jspdf to create multiple pages based on the HTML. How can I add Headers for each page??

let page_section =document.querySelector(".page1");
let HTML_Width = page_section.offsetWidth;
let HTML_Height = page_section.offsetHeight;
let top_left_margin = 15;
let PDF_Width = HTML_Width + (top_left_margin * 2);
let PDF_Height = (PDF_Width * 1.2) + (top_left_margin * 2);
console.log(HTML_Width,HTML_Height,top_left_margin,PDF_Width,PDF_Height)

      var doc = new jsPDF('p', 'pt', [PDF_Width, PDF_Height]);
      var pageCount = Math.ceil(HTML_Height / PDF_Height) - 1;
      console.log(HTML_Height / PDF_Height,Math.ceil(HTML_Height / PDF_Height),pageCount)
      html2canvas(document.querySelectorAll('.page1')[0], { allowTaint: true,scale:2 }).then(function(canvas) {
        canvas.getContext('2d');
        var image = canvas.toDataURL("image/png", 1.0);
        doc.addImage(image, 'PNG', 15, 15,  HTML_Width, HTML_Height-10);
        for (var i = 1; i <= pageCount; i++) {
          doc.addPage();
          doc.addImage(image, 'PNG', 15, -(PDF_Height * i)+15, HTML_Width, HTML_Height);
        }
        doc.save("split-to-multi-page.pdf");
        });

[bgrand-ch]

const element = document.querySelector(".my-element");
const base64Image = "data:image/png;base64,abc";

pdf.html(element, {
    callback(pdf) {
        const totalPages = pdf.getNumberOfPages();

        for (let pageIndex = 0; pageIndex <= totalPages; pageIndex++) {
            pdf.setPage(pageIndex);
            pdf.addImage(base64Image, 10, 15, 140, 40); // same thing with "pdf.text()"
        }

        const pdfBuffer = pdf.output("arraybuffer");
    }
});