Blog
Envoyer les soumissions de formulaire vers Slack (sans code)
· 5 min de lecture
Une soumission de formulaire de contact qui atterrit dans une boîte de réception partagée est lue quand quelqu'un pense à la consulter - ce qui, pour une petite équipe, peut vouloir dire des heures plus tard, voire jamais tant que personne ne la transfère. Une soumission publiée sur Slack est lue dans les trente secondes qui suivent, parce que Slack est l'endroit où l'équipe se trouve déjà. Même prospect, même message, temps de réponse très différent.
L'e-mail garde son utilité - c'est la trace écrite. Mais comme premier canal de notification, Slack l'emporte généralement : c'est l'outil que l'équipe regarde déjà, personne n'a besoin de se souvenir de consulter une boîte mail, et un nouveau message dans un canal est vu par tout le monde dessus, pas seulement par la personne dans la boîte de qui il a atterri.
La méthode DIY
Slack n'accepte pas directement un POST HTML brut de formulaire, donc faire atterrir une soumission là-bas vous-même implique d'écrire un petit récepteur intermédiaire. En général, c'est une fonction serverless (Cloudflare Worker, fonction Vercel, AWS Lambda) qui :
- Accepte le POST du formulaire et vérifie qu'il ressemble bien à une soumission et non à du spam.
- Reformate les noms et valeurs de champs dans le format de message de Slack - soit une simple chaîne
text, soit un tableaublockssi vous voulez que ça ait l'air natif. - Échappe les saisies utilisateur pour qu'un message contenant
&,<ou>ne casse pas le rendumrkdwnde Slack. - Envoie le résultat en POST vers une URL de webhook entrant Slack, et gère le cas où ce POST échoue ou expire - les webhooks Slack ne sont pas infiniment fiables, donc une implémentation naïve perd silencieusement des soumissions au moindre incident.
Rien d'exotique là-dedans - c'est une après-midi de véritable ingénierie, et c'est un service de plus à déployer, surveiller et finalement maintenir quand un nom de champ change ou que Slack ajuste ses règles de formatage. Raisonnable si vous avez déjà l'infrastructure et que ça vous plaît de la gérer ; superflu si tout ce que vous vouliez, c'était « prévenir l'équipe quand quelqu'un remplit le formulaire ».
La méthode sans code
Formhook élimine complètement le récepteur. Dans les paramètres de votre formulaire, ajoutez un webhook et collez-y votre URL de webhook entrant Slack (celle que vous obtenez depuis l'application « Incoming Webhooks » de Slack - https://hooks.slack.com/services/...). Formhook reconnaît automatiquement cet hôte et ce chemin, et formate désormais chaque soumission en message Slack natif - aucun code, aucun mappage de champs, aucun échappement à rater.
Chaque soumission arrive sous forme de message avec un en-tête nommant le formulaire, et une ou plusieurs sections listant le nom et la valeur de chaque champ, formatées comme si un humain les avait postées lui-même. Si une soumission comporte plus de champs qu'il n'en tient proprement dans une section, elle est répartie sur plusieurs - vous n'avez pas à y penser.
{
"text": "New submission to Contact form",
"blocks": [
{
"type": "header",
"text": { "type": "plain_text", "text": "New submission: Contact form" }
},
{
"type": "section",
"fields": [
{ "type": "mrkdwn", "text": "*name*\nJane Doe" },
{ "type": "mrkdwn", "text": "*email*\njane@example.com" },
{ "type": "mrkdwn", "text": "*message*\nCan you send a quote for..." }
]
}
]
}Même astuce pour Discord et Microsoft Teams
La détection par URL fonctionne de la même façon pour les deux autres outils de discussion que les équipes demandent couramment. Collez une URL de webhook Discord et les soumissions arrivent sous forme d'embed Discord formaté ; collez une URL de webhook Microsoft Teams et elles arrivent sous forme de carte Teams native. Dans tous les cas, c'est le même unique champ dans le tableau de bord - Formhook regarde l'hôte et le chemin de l'URL pour décider comment formater la charge utile, donc changer plus tard l'outil de discussion de votre équipe revient à coller une autre URL, pas à tout reconstruire.
Tout ce qui n'est pas l'un de ces trois outils fonctionne quand même : collez n'importe quelle autre URL et Formhook revient à un POST JSON générique, signé par HMAC pour que vous puissiez vérifier qu'il provient bien de Formhook.
Ce que ça ne fait pas
Il vaut la peine d'être précis sur le périmètre : ceci publie un message formaté dans un canal quand une soumission arrive. Ça ne crée pas de fils de discussion, n'ajoute pas de boutons interactifs, n'ajoute pas de commande slash - c'est de la notification, pas une application Slack. Pour la plupart des équipes, c'est exactement le but : un message propre, immédiatement, sans rien de plus à configurer.
Pour commencer
Si vous avez déjà un formulaire pointé vers Formhook, c'est un ajout de deux minutes : créez un webhook entrant dans Slack, collez l'URL dans les paramètres de webhook de votre formulaire, et la prochaine soumission apparaît dans le canal. Si vous partez de zéro, la documentation couvre la mise en place du formulaire lui-même, et la page tarifs détaille les limites du niveau gratuit (250 soumissions/mois, sans carte bancaire) si vous voulez simplement essayer.
Mettez en ligne un formulaire fonctionnel en une ligne
Hébergé dans l'UE, soumissions conservées indéfiniment, notifications push sur tous les niveaux.
Commencer gratuitementSans carte bancaire · consultez la documentation
Continuer la lecture
- Notifications push pour vos soumissions de formulaireLes alertes e-mail se perdent dans la pile. Les notifications push atteignent téléphone et bureau à l'instant - comment ça marche et se configurer.
- Soumission de formulaire en AJAX : envoyer un formulaire sans recharger la pageLa soumission classique d'un formulaire HTML recharge la page. Voici comment la remplacer par fetch() - états de succès/erreur en ligne, amélioration progressive et mise à jour accessible du statut.
- Qu'est-ce qu'un backend de formulaires ?Un backend de formulaires reçoit, stocke et transmet vos soumissions sans que vous ayez à gérer de serveur. Comment ça marche, et quand en avoir besoin.