Envoyer des e-mails directement depuis un navigateur web en utilisant JavaScript côté client est impossible en raison de restrictions de sécurité. Les navigateurs empêchent le code non fiable d’accéder à des ressources sensibles comme les serveurs de messagerie pour protéger la vie privée des utilisateurs. Pour envoyer des e-mails, vous avez besoin d’un composant côté serveur qui gère la transmission des e-mails en toute sécurité.
Table des matières
Envoyer des e-mails avec une approche côté serveur
La solution consiste à utiliser JavaScript côté client pour envoyer des requêtes à un serveur. Le serveur gère ensuite l’envoi des e-mails à l’aide d’une bibliothèque appropriée. Cela sépare les informations sensibles du client et améliore la sécurité.
Voici un exemple côté client utilisant l’API fetch :
async function sendEmail(recipient, subject, body) {
const response = await fetch('/send', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
},
body: JSON.stringify({ recipient, subject, body }),
});
if (response.ok) {
console.log('E-mail envoyé avec succès !');
} else {
console.error('Échec de l'envoi de l'e-mail :', response.status);
}
}
sendEmail('[email protected]', 'E-mail de test', 'Ceci est un e-mail de test.');
Ce code envoie une requête POST à un point de terminaison du serveur (/send). Le code côté serveur (par exemple, en utilisant Node.js avec Nodemailer) reçoit cette requête, traite les détails de l’e-mail et envoie l’e-mail à l’aide d’un serveur SMTP.
Sécuriser les identifiants du serveur
N’intégrez jamais vos identifiants de serveur SMTP (hôte, nom d’utilisateur, mot de passe) directement dans votre code JavaScript côté client. Il s’agit d’un risque de sécurité important. Le serveur doit gérer ces identifiants en toute sécurité, souvent à l’aide de variables d’environnement ou de fichiers de configuration inaccessibles au public.
Voici un exemple de code côté serveur (Node.js avec Nodemailer et dotenv) :
require('dotenv').config();
const nodemailer = require('nodemailer');
const transporter = nodemailer.createTransport({
service: process.env.EMAIL_SERVICE,
auth: {
user: process.env.EMAIL_USER,
pass: process.env.EMAIL_PASSWORD,
},
});
// ... (Gérer la requête POST et utiliser transporter.sendMail()) ...
Cela charge les identifiants à partir d’un fichier .env, les gardant séparés de votre base de code et hors du contrôle de version (ajoutez .env à votre .gitignore). N’oubliez pas de configurer votre fournisseur de messagerie pour autoriser les applications moins sécurisées ou d’utiliser des mots de passe d’application.
Conclusion
L’envoi d’e-mails à partir d’applications web nécessite un composant côté serveur pour une transmission sécurisée des e-mails. JavaScript côté client facilite l’interaction de l’utilisateur et la communication avec le serveur, tandis que le serveur gère les parties sensibles du processus. La priorité à la sécurité en gardant les identifiants hors du code côté client est primordiale pour un système d’envoi d’e-mails robuste et sécurisé.