如何从 Nodejs 发送带有 html 内容的 SENDGRID email？

Question

I have designed a template from Sendgrid website. Let's call it sendgrid.html

I am trying to send the email from Nodejs with the design from sendgrid.html . Below is my Nodejs code:

function sendVoucherCodeEmail (emailAddress, voucherCode){
    sgMail.setApiKey(process.env.SENDGRID_API_KEY);
    const msg = {
        to: emailAddress,
        from: 'example@example.com',
        subject: 'YourCode',
        text: ''
    };
}

I would like to pass emailAddress and voucherCode into the html content and send it as email to the user. How can I do it? Thank you in advance.

Answer 1

It's better to create a template on sendgrid and just put the ID of the template when sending using sendgrid API. By doing this, you can easy change the content without deploy new app. You can still inject the needed data into the template.

const sgMail = require('@sendgrid/mail');
sgMail.setApiKey(process.env.SENDGRID_API_KEY);
sgMail.setSubstitutionWrappers('{{', '}}');
const msg = {
  to: emailAddress,
  from: 'example@example.com',
  templateId: templateId,
  dynamic_template_data: {emailAddress, voucherCode},
};

!note: sendgrid change their API. So substitutions in V2 is replaced by dynamic_template_data in V3: https://github.com/sendgrid/sendgrid-nodejs/issues/703

To know how to create template, you can visit the official document here: https://sendgrid.com/docs/User_Guide/Transactional_Templates/create_and_edit_transactional_templates.html

Your placeholder in your template should be surrounded by {{ }} . for example: {{emailAddress}}

Answer 2

You can do it with Notifire

npm install @notifire/core @notifire/sendgrid

And then just

import { Notifire, ChannelTypeEnum } from '@notifire/core';
import { SendgridEmailProvider } from '@notifire/sendgrid';

const notifire = new Notifire();

await notifire.registerProvider(
  new SendgridEmailProvider({
    apiKey: process.env.SENDGRID_API_KEY,
    from: 'sender@mail.com'
  })
);

const passwordResetTemplate = await notifire.registerTemplate({
  id: 'password-reset',
  messages: [
    {
      subject: `You password reset request`,
      // Or for translation or custom logic you can use function syntax
      // subject: (payload: ITriggerPayload) => getTranslation('resetPasswordSubject', payload.language),
      channel: ChannelTypeEnum.EMAIL,
      template: `
          Hi {{firstName}}!
          
          To reset your password click <a href="{{resetLink}}">here.</a>
          
          {{#if organization}}
            <img src="{{organization.logo}}" />
          {{/if}}
      `
    },
  ]
});

await notifire.trigger('<REPLACE_WITH_EVENT_NAME>', {
  $user_id: "<USER IDENTIFIER>",
  $email: "test@email.com",
  firstName: "John",
  lastName: "Doe",
  language: "en",
  organization: {
    logo: 'https://evilcorp.com/logo.png'
  }
});