Envoi de fichiers sur un site statique : vos vraies options

Les champs texte, c'est facile - la vraie difficulté arrive avec le brief qui dit « et les candidats doivent joindre un CV ». Un site statique ne peut pas recevoir de fichier : il n'y a pas de serveur pour le recevoir. Voici les options réelles, de la pire à la meilleure.

Option 1 : « envoyez-le-nous par e-mail » (la capitulation)

Demandez aux utilisateurs d'envoyer les pièces jointes par e-mail. Ça marche, techniquement, comme un fax : le fichier arrive déconnecté des données du formulaire, dans une boîte de réception, sans structure ni contrôle de taille. Pour tout ce qui est récurrent - candidatures, pièces jointes de support, fichiers d'impression - ça se transforme en classement manuel permanent.

Option 2 : téléversement direct vers le stockage cloud (la voie DIY)

Le JavaScript côté client peut téléverser directement vers le stockage objet (URL présignées façon S3). C'est une architecture légitime - et un travail étonnamment conséquent à faire correctement : il faut bien que quelque chose génère ces URL présignées (vous voilà donc quand même en train d'écrire une fonction serverless), vous implémentez vous-même la validation de la taille et du type, vous reliez le fichier téléversé à la soumission de formulaire à laquelle il appartient, et vous décidez où dans le monde ce bucket se trouve - ce qui compte dès que les téléversements contiennent des données personnelles comme des CV.

Choisissez cette option quand les téléversements sont votre produit. Pour « joindre un fichier à un formulaire », c'est beaucoup de plomberie.

Option 3 : multipart via un backend de formulaire (l'option ennuyeuse mais correcte)

HTML prend en charge les champs de fichier depuis, à peu près, toujours :

La chose que tout le monde oublie, c'est enctype="multipart/form-data" - sans cela, le navigateur envoie le nom du fichier au lieu du fichier lui-même. Avec un backend de formulaire qui reçoit le POST, le fichier est stocké avec sa soumission : ouvrez la demande dans le tableau de bord, la pièce jointe est juste là. Les limites de taille et de type sont appliquées au niveau de l'endpoint, et la protection anti-spam s'applique à toute la soumission, fichiers compris.

Dans Formhook, le téléversement de fichiers est disponible à partir du forfait Pro, et - le point qui compte pour les sites européens - les fichiers téléversés sont stockés dans la région UE de Cloudflare R2 : un CV joint par un candidat européen reçoit donc la même réponse en matière de résidence des données que les champs texte - il ne quitte jamais l'UE. (Détails du stockage dans la documentation.)

Règles pratiques, quelle que soit l'option choisie

1. Contraignez la saisie. Utilisez l'attribut accept (accept=".pdf,.png,.jpg") comme aide à l'UX, mais traitez-le comme indicatif - la vraie validation se fait au niveau de l'endpoint.
2. Annoncez la limite avant qu'on ne la dépasse. « Max 10 MB » à côté du champ vaut mieux qu'une erreur après un téléversement lent.
3. Les fichiers sont aussi des données personnelles. Un CV est sans doute plus sensible que les champs de formulaire qui l'entourent. Les politiques de conservation, de suppression et d'export doivent couvrir les pièces jointes, et la mention du lieu de stockage dans votre politique de confidentialité doit les inclure. (Voir la checklist RGPD.)
4. Gardez le parcours sans JS fonctionnel. Un simple formulaire multipart s'envoie très bien sans aucun script ; ajoutez la finition AJAX en plus, pas à la place.

Le schéma pour les sites statiques est établi : le site reste statique, le backend de formulaire reçoit le POST multipart, et le fichier atterrit à côté du message avec lequel il est arrivé. Le formulaire, c'est toujours un seul attribut - plus un enctype.