Envoi d’e-mails à l’aide de Node.js —

La plupart des applications Web doivent envoyer des e-mails. Il peut s’agir d’inscriptions, de réinitialisations de mots de passe, de rapports de statut, mais aussi de campagnes marketing complètes telles que des newsletters et des promotions. Ce didacticiel explique comment envoyer des e-mails dans Node.js, mais les concepts et les défis s’appliquent aux systèmes que vous utilisez.

Vous trouverez de nombreux modules liés au courrier électronique sur npm. Le plus populaire est Nœud de messageriequi reçoit plus de trois millions de téléchargements chaque semaine.

Pour l’utiliser, vous aurez besoin d’un serveur SMTP capable d’envoyer des e-mails. Vous pourrez peut-être utiliser votre propre fournisseur de messagerie, mais, pour les besoins de cette démonstration, j’utilise le service gratuit Serveur SMTP de test WPOven.

Créez un nouveau dossier de projet :

mkdir emailtest
cd emailtest

Créez ensuite un nouveau package.json fichier avec le contenu JSON suivant :

{
  "name": "emailtest",
  "type": "module",
  "main": "index.js",
  "dependencies": {
    "nodemailer": "^6.0.0"
  }
}

Installez les modules (NodeMailer) :

npm install

et créez ce qui suit index.js code:

import nodemailer from 'nodemailer';

const transporter = nodemailer.createTransport({
  host: 'smtp.freesmtpservers.com',
  port: 25
});

try {

  const send = await transporter.sendMail({
    from: '"Test Email" <test@email.com>',  
    to: 'someone@example.com',              
    subject: 'Hello!',                      
    text: 'Hello world!',                   
    html: '<p>Hello world!</p>',            
  });

  console.dir(send, { depth: null, color: true });

}
catch(e) {

  console.dir(e, { depth: null, color: true });

}

(Pensez à changer le to: adressez-vous à quelque chose d’unique afin que vous puissiez examiner vos propres e-mails de test !)

Exécutez le code. Vous devriez voir un résultat avec un 250 OK response et un messageId:

$ node index.js
{
  accepted: [ 'someone@example.com' ],
  rejected: [],
  ehlo: [ 'SIZE 33554432', '8BITMIME', 'SMTPUTF8', 'HELP' ],
  envelopeTime: 486,
  messageTime: 289,
  messageSize: 595,
  response: '250 OK',
  envelope: {
    from: 'test@email.com',
    to: [ 'someone@example.com' ]
  },
  messageId: '<4673597e-a9e4-e422-85f7-4422edf31774@email.com>'
}

Vérifiez la boîte de réception du to: l’adresse que vous avez utilisée en la saisissant au Page du serveur SMTP de test WPOven et en cliquant Accéder à la boîte de réception. Cliquez sur « Bonjour ! » message pour en examiner le contenu.

Bases de NodeMailer

Pour envoyer des emails, vous devez créer un NodeMailer transporteur objet pour définir le type de service. SMTP est le plus courant, mais d’autres sont disponibles pour des services alternatifs. Un identifiant et un mot de passe d’authentification sont généralement nécessaires :

import nodemailer from 'nodemailer';

const transporter = nodemailer.createTransport({
  host: 'smtp.yourserver.com',
  port: 587,
  auth: {
    user: 'myid@yourserver.com',
    pass: 'my-password'
  },
});

Vous pouvez envoyer des emails à un ou plusieurs destinataires en utilisant l’adresse du transporteur sendMail() méthode:

const send = await transporter.sendMail({
  from: '"Test Email" <test@email.com>',          
  to: 'someone@example.com, sometwo@example.com', 
  cc: 'somethree@example.com',
  bcc: 'somefour@example.com',
  subject: 'Hello!',                              
  text: 'Plain text version of the message',      
  html: '<p>HTML version of the message</p>',     
});

Tous les clients de messagerie prennent en charge les messages en texte brut. Vous pouvez également envoyer une version au format enrichi du même message utilisé lorsque le client de messagerie prend en charge HTML (plus d’informations à ce sujet ci-dessous).

NodeMailer fournit de nombreux autres options de messageriemais le plus courant est pièces jointes. Un tableau d’objets définit les noms de fichiers et le contenu. Par exemple:

const send = await transporter.sendMail({
  
  attachments: [
    { 
      filename: 'text1.txt',
      path: '/path/to/file1.txt'
    },
    {  
      filename: 'text2.txt',
      path: 'https://myserver.com/text2.txt'
    },
    { 
      filename: 'text3.txt',
      content: 'This is the file content!'
    },
    { 
      filename: 'text4.txt',
      path: 'data:text/plain;base64,SGVsbG8gd29ybGQh'
    }
  ]
});

Services d’envoi

Il est facile d’envoyer de simples e-mails ponctuels, mais ne sous-estimez pas le défi à mesure que vos besoins évoluent.

1. Vous n’avez peut-être pas de serveur SMTP. Tous les services de messagerie ne proposent pas SMTP (Google est retrait du support SMTP de base dans Gmail).

2. La plupart des services limitent les e-mails sortants. Si vous envoyez beaucoup d’e-mails, vous risquez d’atteindre la limite de votre fournisseur. À ce stade, tous les e-mails transitant par le même service échoueront : il s’agit de votre newsletter ainsi que des messages personnels et professionnels.

3. Vous pourriez devenir un spammeur. Il est facile pour les destinataires de marquer votre e-mail comme « indésirable » : même quand ce n’est pas le cas. Lorsque suffisamment de personnes le feront, vous découvrirez peut-être que tous les e-mails de votre domaine sont bloqués sur Internet.

Il est préférable d’utiliser un service de messagerie dédié plutôt que votre propre serveur de messagerie. Les services suivants réduisent les problèmes potentiels et certains proposent des forfaits gratuits pour ceux qui ont de faibles besoins d’utilisation :

Architecture d’applications asynchrones

L’envoi d’un seul email est souvent rapide, mais :

• le serveur SMTP peut être en panne et de nouvelles tentatives sont donc nécessaires, ou
• le message pourrait être coincé au milieu d’une publication groupée de newsletter

Plutôt que d’envoyer des emails directement depuis votre application Node.js, il est généralement préférable d’envoyer les données à un file d’attente des tâches. L’utilisateur final n’a pas besoin d’attendre de réponse et peut continuer à utiliser l’application.

Un autre processus peut surveiller la file d’attente des e-mails, envoyer le message suivant et remettre les éléments en file d’attente en cas d’échec.

Créer des e-mails HTML

HTML5 et CSS3 fonctionnent toujours bien dans les navigateurs modernes. Les clients de messagerie sont une autre affaire, qui nous ramène à l’époque frustrante des tableaux et des styles en ligne de la fin des années 1990.

Voici quelques-uns des problèmes auxquels vous serez confronté :

• Il existe des dizaines de clients de messagerie natifs et basés sur le Web, notamment Gmail, Yahoo Mail, Apple Mail, iOS Mail, Android Mail, Windows Mail, Outlook, Outlook.com, (nouveau) Outlook, Thunderbird, AOL, Claws, RoundCube, etc. sur.

• Tous utilisent leurs propres moteurs de rendu étranges et merveilleux avec des problèmes et des bugs uniques. Bizarrement, Outlook utilise Microsoft Word pour afficher le code HTML depuis 2007 (bien que la nouvelle version d’aperçu soit basée sur un navigateur).

• La plupart des clients bloquent ou limitent les polices, les images, les trackers, les requêtes multimédias, les iframes, les vidéos, l’audio, les formulaires et les scripts.

• Même les clients de messagerie Web exécutés dans le navigateur doivent supprimer les codes HTML, CSS et JavaScript dangereux ou susceptibles d’affecter la présentation de l’interface utilisateur. Par exemple, il ne devrait pas être possible pour un e-mail de cliquer automatiquement sur ses propres liens ou de positionner absolument un élément sur un bouton de suppression.

• Les clients de messagerie peuvent reformater votre code HTML pour garantir qu’il s’agit d’une seule colonne ou qu’il respecte les préférences de mode clair/sombre de l’utilisateur.

Il est possible de coder manuellement les e-mails HTML mais, à moins que votre mise en page ne soit simple, c’est une tâche difficile, frustrante et sujette aux erreurs. Les sections suivantes suggèrent des outils et des ressources qui peuvent vous faciliter la vie.

Modèles d’e-mails prédéfinis

Les sites suivants proposent des modèles d’e-mails robustes, gratuits et commerciaux, que vous pouvez prévisualiser, télécharger et utiliser avec un minimum d’effort :

Outils de conception de modèles d’e-mails

Les outils de conception sans code suivants vous permettent de créer vos propres modèles d’e-mails HTML à l’aide d’un éditeur WYSWYG plus simple :

Certains de ces services fournissent également des installations de validation et de test de code.

Conversion de modèle d’e-mail

Pré-mailer est un outil Web qui prend l’URL d’une page ou le code source collé et le transforme en modèles HTML et texte brut compatibles avec la messagerie électronique. Il y a un API REST et Noeud.js premailer-api module si vous avez besoin d’automatiser le processus.

Les outils similaires incluent :

Outils de balisage de modèles d’e-mails

Cerbère, Cadre de messagerie, Squelette d’e-mailet Bon code de courrier électronique fournissez des extraits de composants HTML que vous pouvez copier et adapter dans vos propres modèles.

HEML et MJML sont des langages de balisage de courrier électronique. Ils sont similaires au HTML mais évitent les problèmes de compatibilité typiques. Maizzle adopte une approche similaire en utilisant CSS vent arrière.

Colis est un éditeur de code qui comprend le formatage des e-mails et peut afficher des aperçus. Vous trouverez également de nombreux extensions de messagerie pour VS Code.

caniemail.com est l’équivalent email de la page Web caniuse.com et indique si une fonctionnalité HTML ou CSS spécifique est utilisable sur plusieurs clients. Enfin, Courriel accessible fournit des ressources et des liens associés.

Outils de test de courrier électronique

Même si un e-mail HTML peut fonctionner dans vos propres applications de messagerie, pouvez-vous être sûr qu’il fonctionne dans d’autres ? Les outils suivants vous aideront, mais rien ne remplace le test d’une gamme d’appareils, de systèmes d’exploitation et de clients de messagerie réels.

Vérification des e-mails HTML et Piège à courrier validez votre code source et signalez les problèmes que vous pourriez rencontrer chez des clients spécifiques.

aperçu de l’e-mail, Mailosaureet Services de prévisualisation des e-mails fournir des fonctionnalités de prévisualisation de la mise en page afin que vous puissiez vérifier à quoi ressemblera votre conception sur une variété de clients.

Enfin, Tournesol et E-mail sur l’acide disposent d’une gamme d’outils pour valider le code, vérifier l’accessibilité, prévisualiser parmi les clients, enregistrer des analyses et exécuter des campagnes marketing complètes.

Apprenez à coder correctement les e-mails

Comme nous l’avons vu ci-dessus, il existe de nombreux outils qui peuvent vous aider à créer des mises en page de courrier électronique qui fonctionnent avec les nombreux clients de messagerie disponibles. Mais rien de tel que de comprendre comment coder tout seul, surtout lorsqu’il faut régler les inévitables bugs qui surviennent.

Si vous souhaitez connaître les tenants et les aboutissants du codage des e-mails (même s’il ne s’agit que d’une sauvegarde), consultez Création d’un e-mail HTML, de Rémi Parmentier. Il couvre les perspectives modernes sur la création de vos propres modèles d’e-mails, les meilleures pratiques essentielles, la manière d’ajouter de l’interactivité aux e-mails et la manière de rendre vos modèles accessibles. Il vous guide même à travers une étude de cas pour voir tout cela en pratique.

Lire les e-mails entrants

La plupart des applications n’ont besoin que d’envoyer des e-mails, mais il peut arriver que vous souhaitiez examiner les e-mails entrants, pour des choses telles que l’enregistrement du service, la gestion des désabonnements, l’assistance automatisée, etc. Bien que cela dépasse le cadre de ce didacticiel, les modules Node.js tels que ImapFlow autorisez votre application à se connecter à une boîte de réception IMAP, à récupérer des messages et à traiter une réponse :

import ImapFlow from 'imapflow';

const client = new ImapFlow({
    host: 'imap.email',
    port: 993,
    secure: true,
    auth: {
        user: 'account@imap.email',
        pass: 'mypassword'
    }
});

try {

  
  await client.connect();

  
  const lock = await client.getMailboxLock('INBOX');

  
  const msg = await client.fetchOne(client.mailbox.exists, { source: true });
  console.log( msg.source.toString() );

  
  lock.release();

  
  await client.logout();

}
catch (e) {
  console.log(e);
}

Conclusion

L’envoi d’e-mails à partir des applications Web Node.js est simple. Envoyer des e-mails qui semblent beaux, fonctionnent de manière fiable dans tous les clients de messagerie, n’arrêtent pas l’utilisateur et ne provoquent pas de problèmes de spam peut être considérablement plus difficile.

Je vous recommande de commencer par envoyer des e-mails simples, en optant peut-être pour des messages peu fréquents en texte brut. Bien sûr, vos clients et votre service marketing voudront bientôt des couleurs et des animations fantaisistes, mais vous pouvez les proposer demain !

Foire aux questions (FAQ) sur l’envoi d’e-mails à l’aide de Node.js

let mailOptions = {
from: 'sender@example.com',
to: 'receiver@example.com',
subject: 'Hello',
text: 'Hello world',
attachments: [
{
filename: 'file.txt',
path: '/path/to/file.txt'
}
]
};

let mailOptions = {
from: 'sender@example.com',
to: 'receiver@example.com',
subject: 'Hello',
html: '<h1>Hello world</h1>'
};

let mailOptions = {
from: 'sender@example.com',
to: 'receiver1@example.com, receiver2@example.com',
subject: 'Hello',
text: 'Hello world'
};

transporter.sendMail(mailOptions, function(error, info){
if (error) {
console.log(error);
} else {console.log('Email sent: ' + info.response);
}
});

let transporter = nodemailer.createTransport({
host: 'smtp.gmail.com',
port: 587,
auth: {
user: 'your-email@gmail.com',
pass: 'your-password'
}
});

transporter.sendMail(mailOptions)
.then(info => console.log('Email sent: ' + info.response))
.catch(error => console.log(error));

let transporter = nodemailer.createTransport({
host: 'smtp.example.com',
port: 587,
auth: {
user: 'username',
pass: 'password'
}
});

let mailOptions = {
from: 'sender@example.com',
to: 'receiver@example.com',
subject: 'Hello',
text: 'Hello world',
charset: 'UTF-8'
};

let mailOptions = {
from: 'sender@example.com',
to: 'receiver@example.com',
subject: 'Hello',
text: 'Hello world'
contentType: 'text/plain
};

let mailOptions = {
from: 'sender@example.com',
to: 'receiver@example.com',
subject: 'Hello',
text: 'Hello world',
encoding: 'base64'
};