Formulaires : méthodes GET et POST, cours de Première NSI

Jusqu'ici, tu as vu qu'une page web est décrite en HTML, mise en forme en CSS, et rendue vivante par des événements JavaScript. Tu as aussi vu que le navigateur (le client) dialogue avec un serveur grâce au protocole HTTP. Il manque un maillon : comment l'utilisateur envoie-t-il de l'information au serveur ? Quand tu t'inscris sur un site, que tu lances une recherche ou que tu réponds à un questionnaire, c'est presque toujours un formulaire qui s'en charge.

Dans ce cours, tu vas comprendre ce qui se passe entre le moment où tu cliques sur « Envoyer » et celui où le serveur reçoit tes données. Tu verras les deux méthodes HTTP utilisées pour cela, GET et POST, leurs différences visibles, et comment un programme côté serveur récupère ce qui a été saisi.

Quand le navigateur contacte un serveur, il envoie une requête HTTP. Cette requête commence par indiquer une méthode, c'est-à-dire le type d'action demandée. Le protocole en propose plusieurs : GET, HEAD, POST, PUT, DELETE, CONNECT, OPTIONS, TRACE et PATCH. ¹

Pour les formulaires, seules deux méthodes comptent : GET et POST. ² Les autres existent, mais un formulaire HTML ne les utilise pas pour soumettre ses données.

Pour situer les choses, voici ce que dit le programme sur deux d'entre elles. La méthode HEAD permet d'obtenir seulement l'en-tête de la réponse, sans le contenu de la page. La méthode POST permet d'envoyer une ressource au serveur et elle est souvent employée quand on remplit un formulaire. ¹ GET, elle, sert d'abord à demander une ressource : c'est celle que ton navigateur utilise quand tu tapes une adresse ou que tu cliques sur un lien.

Un formulaire est contenu dans l'élément HTML <form>. Cet élément précise deux choses : l'URL vers laquelle les données saisies doivent être envoyées, et la méthode de soumission, GET ou POST. ² Le programme formule la même idée : dans la balise, on indique la méthode HTTP utilisée et le lien qui sera activé lors de l'envoi. ¹

Ces deux informations se placent dans des attributs :

• action : l'adresse de la ressource qui va traiter les données (souvent un script côté serveur) ;
• method : la méthode HTTP, get ou post.

Avec la méthode GET, les données du formulaire sont transmises en clair dans la barre d'adresse du navigateur. ¹ Cela signifie que tu peux les lire en regardant l'URL après l'envoi.

Prenons le formulaire précédent. Si l'utilisateur saisit Ada dans le champ prenom, l'adresse affichée après l'envoi ressemble à ceci :

traitement.php?prenom=Ada

Après l'adresse du script, on trouve un signe ?, puis des paires nom=valeur. Avec plusieurs champs, les paires sont séparées par le caractère &, par exemple traitement.php?prenom=Ada&classe=1ere. Ce découpage est une illustration : l'essentiel à retenir est que le nom du champ et sa valeur apparaissent dans l'adresse.

Avec la méthode POST, les données ne sont pas collées à l'adresse. Elles sont transmises dans le corps de la requête, ce qui les rend moins visibles. ¹ L'adresse affichée par le navigateur reste simplement traitement.php, sans ? ni paires nom=valeur.

Une requête HTTP se compose d'une ligne de départ, d'en-têtes, puis éventuellement d'un corps. Avec GET, tout ce qu'il faut tient dans la première ligne (l'adresse). Avec POST, on place le contenu à envoyer dans ce corps. On peut se représenter la requête comme une enveloppe : GET écrit le message sur l'enveloppe, POST le glisse à l'intérieur.

Les données saisies ne partent pas telles quelles : elles sont encodées. Les noms et les valeurs des éléments de formulaire sont encodés puis envoyés au serveur dans un message de requête HTTP, avec GET ou POST. ²

L'encodage par défaut porte le nom de type MIME application/x-www-form-urlencoded. Il repose sur de très anciennes règles de codage en pourcentage des URI, avec quelques modifications : les retours à la ligne sont normalisés et les espaces sont remplacés par le signe + au lieu de %20. ² Un autre encodage existe, multipart/form-data, qui est courant dans certains cas, notamment pour l'envoi de fichiers. ²

Envoyer des données ne sert à rien si personne ne les lit. Côté serveur, c'est un programme qui s'en charge. Le programme de NSI prend l'exemple de PHP : l'URL du script PHP est indiquée dans l'attribut action de la balise form. ²

Le fichier PHP visé accède ensuite aux données transmises par le formulaire grâce aux variables $_POST ou $_GET, selon la valeur de l'attribut method du formulaire. ² Autrement dit :

Le programme précise que, si la méthode d'envoi est POST, PHP peut récupérer le texte saisi et l'afficher. ¹

Les différences vues jusqu'ici permettent de décider. Deux critères suffisent à ce niveau : la visibilité des données et la nature de l'action.

Au bac ou en contrôle, une question sur les formulaires suit presque toujours le même schéma : on te donne un extrait HTML, un extrait PHP, ou une adresse affichée, et on te demande d'expliquer ou de compléter.