TP d’applications web
Pages Web statiques : formulaires

Le but de ce TP est de manipuler les différents éléments de formulaire et leurs attributs pour comprendre comment ils réagissent et comment le navigateur transmet les résultats au serveur.

Pour cela, on vous fournit un fichier zip contenant un programme python et un exemple de formulaire. Le programme python va écouter sur le port 9090 et répondre à tous les messages HTTP GET ou POST reçus sur ce port en indiquant simplement ce qu’il a reçu ; il permet donc de voir le contenu des messages envoyés par le navigateur lorsqu’on fait une requête.

1. Exécutez python3 server.py dans un terminal (ce programme ne se termine jamais : Ctrl-C pour l’interrompre).
2. Ouvrez formulaire.html dans un navigateur et dans un éditeur de texte simultanément. Essayez de faire le lien entre ce que le navigateur affiche et le code HTML.
3. Entrez des données quelconques dans le formulaire et validez. Le résultat est envoyé au serveur python que vous avez lancé (localhost:9090), vous pouvez donc voir ce que le navigateur envoie.
   • Retrouvez les résultats du formulaire dans la requête et constatez qu’on les voit aussi dans la barre d’adresse.
   • Ouvrez la console web de votre navigateur et cherchez où apparaissent les différents éléments de la requête (ce qui vous permettra par la suite de débugger sans passer par un serveur spécial).
   • Essayez de modifier l’URL dans la barre d’adresse et voyez ce qui change.
4. Maintenant, modifiez formulaire.html et remplacez method="get" par method="post". Rechargez la page, entrez de nouveau des données et validez. Vous constatez la différence dans le message envoyé.
   • Essayez de recharger la page résultat. Constatez qu’aucune donnée du formulaire n’apparaît dans la barre d’adresse.
   • Voyez-vous la différence dans la console web ?
5. Voyez-vous le lien entre les attributs des différents éléments du formulaire, ce que vous avez entré, et ce qui est envoyé dans la requête ? essayez de modifier le formulaire de diverses manières afin de voir comment cela influe sur l’interface et sur les données envoyées.