将变量传递给nodemailer中的html模板

时间:2016-09-14 11:24:35

标签: javascript html node.js express nodemailer

我想使用html模板向nodemailer发送电子邮件。在那个模板中,我需要动态地注入一些变量,我真的不能这样做。我的代码:

var nodemailer = require('nodemailer');
var smtpTransport = require('nodemailer-smtp-transport');

smtpTransport = nodemailer.createTransport(smtpTransport({
    host: mailConfig.host,
    secure: mailConfig.secure,
    port: mailConfig.port,
    auth: {
        user: mailConfig.auth.user,
        pass: mailConfig.auth.pass
    }
}));
var mailOptions = {
    from: 'my@email.com',
    to : 'some@email.com',
    subject : 'test subject',
    html : { path: 'app/public/pages/emailWithPDF.html' }
};
smtpTransport.sendMail(mailOptions, function (error, response) {
    if (error) {
        console.log(error);
        callback(error);
    }
});

我想在emailWithPDF.html中想要这样的东西:

Hello {{username}}!

我找到了一些例子,这就是这样的:

...
html: '<p>Hello {{username}}</p>'
...

但我希望它在单独的html文件中。有可能吗?

9 个答案:

答案 0 :(得分:32)

您可以使用节点中的fs模块读取HTML文件,然后使用handlebars

替换html字符串中要更改的元素
var nodemailer = require('nodemailer');
var smtpTransport = require('nodemailer-smtp-transport');
var handlebars = require('handlebars');
var fs = require('fs');

var readHTMLFile = function(path, callback) {
    fs.readFile(path, {encoding: 'utf-8'}, function (err, html) {
        if (err) {
            throw err;
            callback(err);
        }
        else {
            callback(null, html);
        }
    });
};

smtpTransport = nodemailer.createTransport(smtpTransport({
    host: mailConfig.host,
    secure: mailConfig.secure,
    port: mailConfig.port,
    auth: {
        user: mailConfig.auth.user,
        pass: mailConfig.auth.pass
    }
}));

readHTMLFile(__dirname + 'app/public/pages/emailWithPDF.html', function(err, html) {
    var template = handlebars.compile(html);
    var replacements = {
         username: "John Doe"
    };
    var htmlToSend = template(replacements);
    var mailOptions = {
        from: 'my@email.com',
        to : 'some@email.com',
        subject : 'test subject',
        html : htmlToSend
     };
    smtpTransport.sendMail(mailOptions, function (error, response) {
        if (error) {
            console.log(error);
            callback(error);
        }
    });
});

答案 1 :(得分:3)

如果您使用的是Nodemailer 2.0.0或更高版本,请查看以下文档: https://community.nodemailer.com/2-0-0-beta/templating/他们在那里解释了如何使用这样的模板来利用外部渲染:

// external renderer
var EmailTemplate = require('email-templates').EmailTemplate;
var send = transporter.templateSender(new EmailTemplate('template/directory'));

他们也举了这个例子:

// create template based sender function
// assumes text.{ext} and html.{ext} in template/directory
var sendPwdReminder = transporter.templateSender(new EmailTemplate('template/directory'), {
    from: 'sender@example.com',
});

您将看到如何传递变量。

您需要email-templates模块:https://github.com/crocodilejs/node-email-templates和您选择的模板引擎。

同样在email-templates的文档中,您将找到如何制作文件结构以便找到您的模板:

  

html。{{ext}}(必填) - 用于电子邮件的html格式

     

text。{{ext}}(可选) - 用于电子邮件样式的文本格式。

     

{{ext}}(可选) - html格式主题的样式。

     

{{ext}}(可选) - 电子邮件主题

     

请参阅支持的模板引擎,了解可能的模板引擎扩展(例如.ejs,.jade,.nunjucks),以用于上面{{ext}}的值。

     

您可以在任何文件名前添加任何您喜欢的文件名,以帮助您在IDE中更轻松地识别文件。唯一的要求是文件名包含html。,text。,style。和subject。分别

答案 2 :(得分:3)

字符串替换不是一个好主意,因为您必须还原旧字符串或创建备份文件才能再次更改它们,而且它也不会异步,并且会在各个方面造成问题! 您可以容易得多并且更加清洁

只需转到您的邮件选项,然后在变量中添加上下文

var mailOptions = {
  from: 'nginx-iwnl@gmail.com',
  to: 'username@gmail.com',
  subject: 'Sending email',
  template: 'yourTemplate',
  context: {                  // <=
    username: username,
    whatever: variable
  }
};

接下来的事情要做的是打开您的html文件并调用变量,例如:

{{username}}

答案 3 :(得分:2)

您可以使用 Web请求使用handlebars或任何其他引擎来构建html模板。

创建模板

首先,您必须为电子邮件正文创建一个html模板。在此示例中,我使用了一个车把hbs文件。

enter image description here

使用html进行设计,然后在消息中添加所需的变量:

   <!DOCTYPE html>
   <html>
    <head>
        <meta name="viewport" content="width=device-width">
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Welcome Email Template</title>
    </head>
    <body>
     <p style="font-size: 14px; font-weight: normal;">Hi {{data.name}}</p>
    </body>
   </html>

创建模板请求

您必须创建对此视图的访问权限。然后创建一个请求,我们可以在其中发送模板名称作为url参数,以使该请求可用于其他模板。

const web = express.Router()

web.post('/template/email/:template', function(req, res) {
  res.render(`templates/email/${req.params.template}`, {
    data: req.body        
  })
})

邮件功能

最后,您可以在向模板提出请求后发送电子邮件。您可以使用如下功能:

const nodemailer = require('nodemailer')
const request = require("request")

function sendEmail(toEmail, subject, templateFile) {
    var options = {
        uri: `http://localhost:3000/template/email/${templateFile}`,
        method: 'POST',
        json: { name: "Jon Snow" } // All the information that needs to be sent
    };  
    request(options, function (error, response, body) {
        if (error) console.log(error)
        var transporter = nodemailer.createTransport({
            host: mailConfig.host,
            port: mailConfig.port,
            secure: true,
            auth: {
                user: mailConfig.account,
                pass: mailConfig.password
            }
        })
        var mailOptions = {
            from: mailConfig.account,
            to: toEmail,
            subject: subject,
            html: body
        }       
        transporter.sendMail(mailOptions, function(error, info) {
            if (error) console.log(error)
        })
    })
}

答案 4 :(得分:1)

适用于使用pug作为模板引擎的人

使用pug的render函数在单独的文件中渲染模板的快速方法:

// function to send an e-mail. Assumes you've got nodemailer and pug templating engine installed. 
// transporter object relates to nodemailer, see nodemailer docs for details
const nodemailer = require('nodemailer');
const pug = require('pug');
function send_some_mail(iterable){
var message = {
  from: 'from@example.com',
  to: 'to@example.com',
  subject: 'Message title',
  html: pug.renderFile(__dirname + 'path_to_template.pug', {iterable: iterable})
};
transporter.sendMail(message, function(err, info){...})
}

// template.pug
each item in iterable
li
  p #{item.name}

有关更多详细信息,请参见https://pugjs.org/api/getting-started.html。请注意,这将在每次发送消息时导致模板重新编译。偶尔发送电子邮件是可以的。如果发送大量电子邮件,则可以缓存已编译的模板以解决此问题。如果需要,请查看该设置的哈巴狗文档。

答案 5 :(得分:0)

这可以在没有模板的情况下完成。

尝试将其更改为此:

`Hello ${username}!`

确保它们不是逗号,而是反引号。

答案 6 :(得分:0)

我在所有项目中都使用它。更干净,最新且易于理解。回调地狱不存在。 sendMail.ts 。html文件使用车把读取,将相关变量放入内容中,然后发送。

import * as nodemailer from 'nodemailer';
import * as handlebars from 'handlebars';
import * as fs from 'fs';
import * as path from 'path';

export async function sendEmail(email: string, subject: string, url: string) {
  const filePath = path.join(__dirname, '../emails/password-reset.html');
  const source = fs.readFileSync(filePath, 'utf-8').toString();
  const template = handlebars.compile(source);
  const replacements = {
    username: "Umut YEREBAKMAZ"
  };
  const htmlToSend = template(replacements);
  const transporter = nodemailer.createTransport({
    host: "smtp.mailtrap.io",
    port: 2525, // 587
    secure: false,
    auth: {
      user: "fg7f6g7g67",
      pass: "asds7ds7d6"
    }
  });
  const mailOptions = {
    from: '"noreply@yourdomain.com" <noreply@yourdomain.com>',
    to: email,
    subject: subject,
    text: url,
    html: htmlToSend
  };
  const info = await transporter.sendMail(mailOptions);
  console.log("Message sent: %s", info.messageId);
  console.log("Preview URL: %s", "https://mailtrap.io/inboxes/test/messages/");

}

答案 7 :(得分:0)

有一种简单的方法可以在nodemailer中的html内插入变量。

[crowburger?]

答案 8 :(得分:0)

创建一个文件 emailTemplates.js,您可以将每个模板存储为一个函数

emailTemplates.js

const newsLetterEmail = (clientName) => `<p>Hi ${clientName}, here you have today news.</p>`
const welcomeEmail = (clientName, username) => `<p>Welcome ${clientName}, your username is ${username}.</p>`

export {newsLetterEmail, welcomeEmail}

然后在控制器中调用任何模板函数并存储在输出变量中

controller.js

import {welcomeEmail} from './emailTeamplates.js'

const registerUser = async(req, res) => {
    const {name, usename, email} = req.body
    // User register code....
    const output = welcomeEmail(name, username)

    let mailOptions = {
        from: '"Welcome" <welcome@welcome.com>',
        to: 'client@gmail.com',
        subject: 'Welcome email!',
        text: 'Hello World',
        html: output,
    }