Formulaire : échange de données entre le client et le serveur

Récupérer les informations d'un formulaire côté serveur

Préparer le travail

Dans cette activité il est nécessaire d'utiliser un serveur local : EasyPHP.

Cela nous permettra de faire fonctionner le formulaire comme s'il y avait deux machines : la machine client et la machine serveur web.

La fiche de cours vous explique cela en détail.

Veuillez télécharger le fichier exemple_formulaire_reponse.zip

Décompresser le au même endroit (clic droit -> Extraire tout) et copier le dossier décompressé.

Déplacer ce dossier dans le dossier du serveur local dont le chemin est :

C:/Program Files (x86)/EasyPHP-12.1/www/

Lancer le serveur EasyPHP.

Transférer les informations d'un formulaire avec la méthode GET

Observer le réseau lors du chargement du formulaire

Ouvrir dans le navigateur Chrome le fichier "formulaire1.html" en saisissant dans la barre d'adresse :

localhost/exemple_formulaire_reponse/formulaire1.html et appuyer sur Entrée.

Activer l'inspecteur du navigateur et sélectionner l'observateur du réseau et appuyer sur F5 pour actualiser la page.

a- Combien de fois la méthode GET a été utilisée et pour quel(s) fichier(s) ?

b- Que signifie un état à 200 ?

Au lieu d'un état à 200, vous pouvez observer un état à 304 ! Cela se produit lorsque vous avez actualisé plusieurs fois la page.

c- Que signifie un état à 404 ?

d- Pourquoi le fichier logoviala.png a généré un état 404 ?

Observer le transfert des informations après l'appui sur le bouton ENVOI

Dans le navigateur, compléter le formulaire entièrement.

Valider votre saisie en appuyant sur le bouton ENVOI.

a- Comment s'appelle la page qui vient de s'afficher ?

b- Dans l'observateur du réseau combien de fois la méthode GET a été utilisée et pour quel(s) fichier(s) ?

c- Dans l'observateur du réseau combien de fois la méthode POST a été utilisée et pour quel(s) fichier(s) ?

d- En examinant dans l'entête du code HTML de la page qui vient de s'afficher, expliquer pourquoi c'est différent de la page "formulaire1.html"

e- Est-ce que dans l'entête du protocole HTTP les informations du formulaire sont visibles ?

f- Est-ce que dans la barre d'adresse du navigateur les informations du formulaire sont visibles ?

Transférer les informations d'un formulaire avec la méthode POST

Observer le transfert des informations après l'appui sur le bouton ENVOI

Ouvrir dans le navigateur Chrome le fichier "formulaire2.html" en saisissant dans la barre d'adresse :

localhost/exemple_formulaire_reponse/formulaire2.html et appuyer sur Entrée.

Activer l'inspecteur du navigateur et sélectionner l'observateur du réseau et appuyer sur F5 pour actualiser la page.

Dans le navigateur, compléter le formulaire entièrement.

Valider votre saisie en appuyant sur le bouton ENVOI.

a- Comment s'appelle la page qui vient de s'afficher ?

b- Dans l'observateur du réseau combien de fois la méthode GET a été utilisée et pour quel(s) fichier(s) ?

c- Dans l'observateur du réseau combien de fois la méthode POST a été utilisée et pour quel(s) fichier(s) ?

d- Est-ce que dans l'entête du protocole HTTP les informations du formulaire sont visibles ?

e- Est-ce que dans la barre d'adresse du navigateur les informations du formulaire sont visibles ?

Conclusion sur le choix d'une méthode GET ou POST

a Expliquer pourquoi il est préférable d'utiliser la méthode POST pour transférer les informations d'un formulaire.