Nodemailer HTML Tags Injection

user_5326642 0
Viewed 75

So this is my first time asking a question on StackOverflow..

I am using Nodemailer to email me when someone has filled a form. I am using ExpressJS to handle the POST request.

All seems good now except when I tried to inject HTML tags on the form. I could play with the mail html as I wish!

This is my code for the sendMail

transport.sendMail({
    from: `Form Submittion <${myEmailAddress}>`,
    to: myOtherEmailAddress,
    subject: "New Form Submitted",
    text:
        `Hi, \nNew Form Submitted!\n${req.body.request}`,
    html: 
        `<h1>Hi, <br />New Form Submitted!</h1>
        <h2>${req.body.request}</h2>`,
});

When the req.body.request has HTML tags, it can affect how my email looks, which I don't like..

Is there a way to sanatize the req.body.request from the nodemailer or express or should I relay on other tools? If so, could you please suggest some tools to do the job?

nodemailer express node.js html javascript
1 Answers
  • Install multer
  • Parse the fields from request, by using multer
  • Pass it as arguments to a function that returns the HTML template string for the email
  • send the email
const express = require("express");
// for email
const nodemailer = require("nodemailer");
// for handling the form submission
const multer  = require('multer');
const upload = multer();


const app = express();


// upload.none() for only accepting text fields from form submission
// refer : http://expressjs.com/en/resources/middleware/multer.html
app.post("/submit", upload.none(), async (req, res) => {
    // here name is field name at your html form
    const name = req.body.name;
    const email = req.body.email;
    let transporter = nodemailer.createTransport({
        host: "your-smtp-server",
        port: 587,
        secure: false, // true for 465, false for other ports
        auth: {
          user: "your-crendentials", // generated ethereal user
          pass: "your-crendentials", // generated ethereal password
        },
      });
    const info = await transporter.sendMail({
        from: '"Sender name" <foo@example.com>', // sender address
        to: email,
        subject: "New message from " + name,
        text: `Hi, \nNew Form Submitted!\n${name}`,
        html: getHTMLTemplateString(name),
        });
    console.log("Message sent: %s", info.messageId);
    return res.send({
        success: true,
        message: "Email sent successfully",
    })
});

function getHTMLTemplateString(name) {
    // add your css and html inside the string below
    return `
    <h1>Hi ${name}, <br />New Form Submitted!</h1>
    <p>Thank you for submitting the form!</p>
    <p>We will get back to you as soon as possible.</p>
    `;
}

app.listen(3000, () => {
    console.log("Server started on port 3000");
});

Dependencies added : multer

user_115628850
Related