How to convert html to pdf (something like a generated invoice) and send it to an email
Pelumi Oluwategbe
Posted on July 16, 2022
Long time, no post. Sorry about that, been quite busy with my youth service PPA (Place of Primary Assignment), and sadly it has taken quite so much of my time. Anyways, down to business. So I'm building this web application for my PPA which generates a delivery note from a set of inputs and sends to the inputed email by the click of the "Send Email" button. I had problems with converting it to a pdf and I did a lot of research but I finally figured it out with the help of the internet and some people at Stack Overflow (every junior developer needs help from the internet), to convert it to pdf and print by the click of a button, here's the code below:
So you have to add the html2pdf script before it can work, though there are other ways, this was the one I found.
Meanwhile if you want to generate a pdf and then send it to an email, that is a different ball game. I tried fetching the downloaded pdf and then sending it to the email, but that gave me problems and I couldn't quite figure it out. Anyways, I did some research and also asked other senior developers I knew for help (Special thanks, Mr Samuel Adetoro @big_black_fella ). So I found smtpJs and followed the steps shown below
As you can see in the highlighted part, I could send an email with attachment but the code to convert and send a pdf straight was more complex than that so I did some further research and also found some help from some guys at Stack Overflow and to avoid long talk, I had to create an Elastic email account shown below
Then I combined it with the smtpjs code and also the html2pdf code to convert the invoice to a pdf, then change it to a datauristring and then send it as a data using the email code from smtpjs. I used elastic email as my smtp server. The code is shown below
Finally, it all worked out and the invoice looks like this:
.
It was successfully sent to the email that was inputed. That's all from me for now, till next time. Hope you found this useful.
Posted on July 16, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
July 16, 2022