代码之家  ›  专栏  ›  技术社区  ›  Wacław Łabuda

将变量传递到节点生成器中的html模板

  •  52
  • Wacław Łabuda  · 技术社区  · 8 年前

    我想使用html模板与节点管理器发送电子邮件。在那个模板中,我需要动态地注入一些变量,但我真的做不到。我的代码:

    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);
        }
    });
    

    比方说,我想用PDF发送电子邮件。html类似如下:

    Hello {{username}}!
    

    我找到了一些例子,其中smth是这样的:

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

    但我想把它放在单独的html文件中。有可能吗?

    10 回复  |  直到 8 年前
        1
  •  91
  •   billyjov    3 年前

    您可以使用 fs 模块,然后使用替换html字符串中要更改的元素 handlebars

    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) {
               callback(err); 
               throw 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);
            }
        });
    });
    
        2
  •  20
  •   umutyerebakmaz    5 年前

    我在所有的项目中都使用它。更干净、更及时、更易于理解。回调地狱不存在。 发送邮件.ts

    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/");
    
    }
    
        3
  •  11
  •   larachiwnl    5 年前

    一串 代替 这不是一个好主意,因为您必须恢复旧字符串或创建备份文件才能在下次更改它们,而且它不是异步的,并且会在各个方面造成问题! 你能做到的 容易得多 更清洁 :

    去你的 邮件选项 并添加 使用变量:

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

    下一件事 要做的是打开html文件并调用变量,如:

    {{用户名}}

        4
  •  6
  •   Community frankie liuzzi    4 年前

    如果您使用的是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 以及您选择的模板引擎。

    也在文档中 电子邮件模板 您将了解如何创建文件结构,以便可以找到模板:

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

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

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

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

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

    您可以在任何文件名前面加上任何您喜欢的前缀,以帮助您在IDE中更容易地识别文件。唯一的要求是文件名包含html。,文本风格和主题。分别地

        5
  •  4
  •   wondersz1    6 年前

    对于使用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 了解更多详细信息。请注意,这将导致每次发送消息时重新编译模板。对于偶尔的电子邮件传递来说,这很好。如果你发送了大量的电子邮件,你可以缓存编译过的模板来解决这个问题。如果你需要的话,可以查看巴格舞的文档。

        6
  •  4
  •   Cesar Moran    3 年前

    创建一个文件 emailTemplates.js 在那里你可以将每个模板存储为一个函数

    电子邮件模板.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}
    
    

    然后在控制器中调用任何templateFunction并存储在输出变量中

    控制器.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,
        }
     
    
        7
  •  3
  •   HoldOffHunger Lux    4 年前

    您可以使用 Web请求 要使用构建html模板 handlebars 或任何其他发动机。

    创建模板

    首先,您必须为电子邮件正文创建一个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)
            })
        })
    }
    
        8
  •  2
  •   Ethan Arti Singh    6 年前

    尝试将其更改为:

    `Hello ${username}!`
    

    确保这些不是反逗号而是反勾号。

        9
  •  2
  •   Ranjit Kumar Pandit    4 年前

    有一种简单的方法可以在节点生成器的html中插入变量。

        html:"<p>Your message "+variable1+".Message continueous "+variable 2+"</p>"
    
        10
  •  0
  •   AleP _C.P.    2 年前

    您还可以使用async/await语法或promises,并避免使用回调,就像我在这里所做的那样,使用asynch/await:

    const fs = require("fs").promises;
    const path = require("path");
    const handlebars = require("handlebars");
    const relativeTemplatePath = "../../html/reset-pw-email-template.html";
    
    function sendEmail(){
        const templatePath = path.join(__dirname, relativeTemplatePath);
        const templateFile = await fs.readFile(templatePath, 'utf-8');
        const template = handlebars.compile(templateFile);
        const replacements = {
            username:""
        };
        const finalHtml = template(replacements);
        const mailOptions = {
           from: "",
           to: "",
           subject: "",
           html: finalHtml,
        };
     }