Le backend sans déploiement
L’hébergeur sert toujours des fichiers. Le POST va chez mailcontact pour valider, stocker et notifier : la pièce dynamique qui manque au statique.
intégrations · approach
Ajoutez un formulaire fonctionnel sans écrire ni héberger de backend. action pointe vers une URL qui accepte le POST et place les envois dans la boîte avec alertes Discord, Slack, email ou webhook. Le site reste un dossier de fichiers statiques.
Le raccourci mailto a deux défauts : l’adresse figure dans le HTML et sera collectée, puis le clic ne fonctionne que si une messagerie est configurée. Souvent, rien ne s’ouvre ou une application inconnue apparaît, et le message se perd.
Une URL de réception résout les deux : aucune adresse dans le HTML, et un POST HTTP normal dans tout navigateur. mailcontact valide, stocke et notifie, que votre site soit écrit à la main, généré ou ancien.
configuration recommandée
Ajoutez ce HTML à votre site, ou utilisez le générateur de formulaires. Remplacez le lien du formulaire par le vôtre. Le script hébergé injecte le contrôle caché, gère l’envoi et la vérification automatique, et conserve le brouillon en cas d’erreur. Vous contrôlez le HTML et le CSS. Les formulaires Free affichent un lien visible « Traité par mailcontact.app » ; Pro et Plus ne l’affichent pas. Les messages de retour suivent la langue du navigateur ; définissez data-mailcontact-language="fr" sur le formulaire pour imposer le français.
<form action="https://mailcontact.app/api/forms/your-form-id" method="POST" data-mailcontact-form lang="fr" data-mailcontact-language="fr">
<input type="hidden" name="_language" value="fr" />
<fieldset>
<legend>Contactez-nous</legend>
<label>
Nom (facultatif)
<input name="name" type="text" autocomplete="name" maxlength="200" />
</label>
<label>
Email
<input name="email" type="email" autocomplete="email" maxlength="320" required />
</label>
<label>
Message
<textarea name="message" rows="5" maxlength="5000" required></textarea>
</label>
<noscript>
<div aria-hidden="true" style="position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden;">
<label>Site web
<input name="company_website" type="text" tabindex="-1" autocomplete="off" />
</label>
</div>
</noscript>
<button type="submit">Envoyer le message</button>
</fieldset>
<p data-contact-status role="status" aria-live="polite" aria-atomic="true"></p>
</form>
<script defer src="https://mailcontact.app/forms/v1.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>Pour un composant doté de son propre gestionnaire d’envoi, chargez le même script et utilisez MailContact.prepare(form) et MailContact.send() au lieu du marqueur automatique. Voir la référence des interfaces personnalisées pour le chargement, les messages de retour et l’attribution Free.
l’extrait
Cet exemple appelle directement l’API. Gardez le champ requis company_website champ présent et vide. Les envois natifs ouvrent du JSON en cas de succès ou une page de vérification si nécessaire. Les scripts personnalisés sans vérification envoient les messages suspects dans les spams pour examen ; les spams manifestes y sont aussi retenus sans notification ni consommation du quota. Un succès confirme la réception, y compris pour examen, ou l’abandon silencieux d’un contrôle rempli. Voir protection antispam pour le comportement complet.
<form action="https://mailcontact.app/api/forms/your-form-id" method="POST">
<label for="name">Name</label>
<input id="name" type="text" name="name" />
<label for="email">Email</label>
<input id="email" type="email" name="email" required />
<label for="message">Message</label>
<textarea id="message" name="message" rows="5" required></textarea>
<button type="submit">Send</button>
<input name="company_website" type="text" tabindex="-1" autocomplete="off"
style="position:absolute;left:-10000px" aria-hidden="true" />
</form>fonctionnement
Une boîte par projet. Nommez-la comme le site pour obtenir URL et adresse immédiatement. Sans DNS ni serveur mail.
Copiez le code dans une page HTML et remplacez your-form-id. Les noms de champs name, email, message suffisent au point de réception.
Ajoutez Discord, Slack, email ou webhook. Les nouveaux messages apparaissent en boîte et vous alertent.
pourquoi mailcontact
L’hébergeur sert toujours des fichiers. Le POST va chez mailcontact pour valider, stocker et notifier : la pièce dynamique qui manque au statique.
Sans mailto, masquage de texte ni adresse à collecter. Le visiteur voit un formulaire ; votre adresse reste privée.
Le HTML simple fonctionne dans des pages manuelles ou générées. Aucun bundler, framework ou script requis.
FAQ
Tout à fait. Vous contrôlez le HTML et le CSS. Le point de réception ne s’intéresse qu’aux noms des champs : email et message sont requis, name et subject facultatifs ; company_website doit aussi être présent et vide. Le reste du balisage vous appartient.
Un envoi natif de formulaire affiche actuellement la réponse JSON du point de réception. Pour une meilleure expérience, utilisez le script MailContact hébergé : il envoie les champs, gère la vérification et affiche les résultats sur la page. Aucune redirection configurable n’est actuellement disponible pour les envois natifs.
Tous : GitHub Pages, Netlify, Vercel, Cloudflare Pages, un bucket S3 ou nginx servant un dossier. Le formulaire envoie vers les serveurs mailcontact, qui acceptent les requêtes de toute origine : rien à configurer chez l’hébergeur.
Free inclut un projet, un formulaire et 50 envois par mois, avec des canaux de notification. Pro ajoute les adresses de réception, dix projets et 1 000 messages par mois pour le compte. Les requêtes de formulaire sont limitées à 20 par minute et par IP.
voir aussi
Formulaires et vraie adresse email, ensemble, avec des notifications dans vos outils. Commencez gratuitement.
Créer mon formulaireAucune carte bancaire requise. Free comprend un projet et 50 messages de formulaire par mois.