Un âge de 200 ans dans un formulaire
La validation d’un formulaire est la vérification de ce que quelqu’un tape avant de le garder. Sans elle, un site accepte un âge de 200 ans ou une adresse e-mail sans arobase.
Un formulaire est la porte d’entrée du site, et tout le monde peut y taper n’importe quoi. Tu vas apprendre à écrire les règles qui protègent la base de données.
À la fin de cette leçon
Remarque
Je peux écrire les règles qui vérifient ce qu’un utilisateur tape dans un formulaire.
Mots clés
| Mot | Ce que ça veut dire | Exemple |
|---|---|---|
| Validation | vérifier qu’une donnée respecte des règles avant de la garder | |
| Champ | une case du formulaire, comme le nom ou l’adresse e-mail | |
| Côté client | la vérification faite par le navigateur, sur l’appareil de l’utilisateur | |
| Côté serveur | la vérification faite par le serveur, avant de garder la donnée | |
| Motif | une forme que le texte doit avoir, comme un e-mail | [email protected] |
| Message d’erreur | la phrase qui explique ce qu’il faut corriger |
Les cellules que les étudiants remplissent restent vides dans cet aperçu.
Un formulaire peut recevoir n’importe quoi
Un site de club de sport demande un nom, une adresse e-mail et un âge. Quelqu’un peut laisser le nom vide, taper abc comme âge ou coller un texte très long.
Chaque champ a donc des règles. On vérifie qu’il n’est pas vide, qu’il a la bonne longueur, la bonne forme et une valeur raisonnable.
Exemple travaillé : les règles d’un formulaire
| Champ | Règle | Valide | Refusé |
|---|---|---|---|
| Nom | Pas vide | Léa | (rien) |
| Un @ et un point après | [email protected] | lea.exemple.fr | |
| Âge | Un nombre de 13 à 120 | 16 | 200 |
| Mot de passe | 8 signes et un chiffre | pain2024 | pain |
Les cellules que les étudiants remplissent restent vides dans cet aperçu.
Le navigateur vérifie, le serveur vérifie encore
La validation côté client se fait dans le navigateur. Elle est rapide et prévient tout de suite l’utilisateur.
Mais n’importe qui peut la contourner, par exemple en envoyant une requête sans passer par la page. La validation côté serveur est donc obligatoire. Elle seule protège vraiment les données.
Exemple : des règles écrites dans le HTML
<form>
<input name="nom" required>
<input name="email" type="email" required>
<input name="age" type="number" min="13" max="120">
<input name="mot_de_passe" type="password" minlength="8">
</form>Convertis « abc » en nombre
PGPASSWORD=shop psql -h db -U shop -c "select 'abc'::integer"Affichée ici, non exécutée. Créez un compte gratuit pour appuyer sur Exécuter et la saisir dans le terminal de votre propre labo.
Demande la longueur d’un mot de passe
PGPASSWORD=shop psql -h db -U shop -tAc "select length('mdp123')"Affichée ici, non exécutée. Créez un compte gratuit pour appuyer sur Exécuter et la saisir dans le terminal de votre propre labo.
La base vérifie aussi, à sa façon
Le premier Run commence par ERROR: : la base refuse de transformer abc en nombre. Elle vérifie le type de chaque colonne.
Le second Run écrit 6. Une règle de longueur compte les signes avec length. Dans le lab, tu parles à la base db avec le mot de passe shop.
Un bon message dit quoi corriger
Un message d’erreur sert à aider. Il dit quel champ est faux et comment le corriger, sans accuser la personne.
Il ne dit jamais « Erreur » tout court. Il ne montre pas non plus des détails techniques du serveur.
Exemple travaillé : de mauvais et de bons messages
| Mauvais message | Bon message |
|---|---|
| Erreur | L’adresse e-mail doit contenir un @ |
| Données invalides | L’âge doit être un nombre entre 13 et 120 |
| Échec du serveur | Le mot de passe doit avoir au moins 8 signes |
Les cellules que les étudiants remplissent restent vides dans cet aperçu.
Teste la forme d’une adresse e-mail
PGPASSWORD=shop psql -h db -U shop -tAc "select '[email protected]' ~ '^[^@ ]+@[^@ ]+[.][a-z]+$'"Affichée ici, non exécutée. Créez un compte gratuit pour appuyer sur Exécuter et la saisir dans le terminal de votre propre labo.
Une erreur fréquente
Attention
Beaucoup pensent que la vérification du navigateur suffit. Ce n’est pas vrai : quelqu’un peut envoyer des données sans passer par ta page. Vérifie toujours une seconde fois côté serveur, avant de toucher à la base.
Pour aller plus loin : des messages précis
Au lieu de la liste des champs faux, renvoie un dictionnaire : le champ, puis la phrase qui explique la faute. Écris messages(champs).
Garde les mêmes règles. Essaie-la sur un formulaire où trois champs sont faux.