Architecture et langages Web (NFA040)

Olivier Pons
(pons@cnam.fr)

2022

Correction de l'exercice sur les protocoles (exo 2)

  1. Le Navigateur client (votre machine) se connecte sur le port 80 de la machine serveur www.exam.fr. Si www.exam.fr est bien un serveur web (on supposera que c'est le cas) il écoute sur le port 80 qui est celui du protocol http. La connection étant alors établie
    1. Le Navigateur client envoie la requête suivante qui demande le fichier index.html avec une requête GET du protocole HTTP dans sa version 1.0
    GET /index.html HTTP/1.0
    1. Le serveur répond en envoyant un entête suivi d'une ligne vide, suivi du code html de la page demandée.
    HTTP/1.0 200 OK
Content-type: text/html

<html>.
....
 <a href="http://deptinfo.cnam.fr/www/page2.html">
   page 2</a>
....
</html>

L'entête comprend le nom et la version du protocol et un code de retour (200 dit que tout va bien). Puis une ligne qui dit que ce qu'on envoie ensuite est du code html.

c. Le navigateur interprète le code reçu et affiche la page

  1. L'utilisateur clique le lien page 2 donc son Navigateur se connecte maintenant à la machine (serveur) deptinfo.cnam.fr sur le port 80.

    Puis

    1. il demande la page page2.htmldu repertoire www la encore avec une requête GET
    GET /www/page2.html HTTP/1.0
    1. Le serveur répond comme précédemment par un entête puis une ligne vide puis le code html de la page demandée.
    HTTP/1.0 200 OK
Content-type: text/html

<html>
.....//code html de la page 2
</html>
    1. le navigateur interprète le code et affiche la page on a quelque chose comme

      Seconde page


  2. L'utilisateur remplit alors le formulaire avec la valeur toto. Il clique le bouton . Donc le navigateur client se connecte à la machine (serveur) deptinfo.cnam.fr sur le port 80. Puis,

  1. Il envoie la requête suivante qui demande la page /www/page3.php en utilisant la méthode POST du protocole HTTP. La requête contient aussi entête qui dit la longueur des donnée qui vont suivre (ici 11 caractères) puis une ligne vide puis les donnée transmise au serveur.
POST /www/page3.php HTTP/1.0
Content-length: 11

champ1=toto
b. comme il s'agit d'une page `php` le serveur va lancer le programme php avec les donnée reçu dans la requête. 
Puis il répond avec un entête suivi d'une ligne vide suivi du code html **généré** par l’exécution du programme php.  (le client ne voit jamais le code php, seulement le code généré) 

```
HTTP/1.0 200 OK
Content-type: text/html

<html>
.....
Bravo vous avez donné au champ la valeur : toto
....
```
  1. Le navigateur interprète le code reçu et affiche
<div "border:solid"> Bravo vous avez donné au champ la valeur : toto
continuons avec un autre fomulaire

Page 3

Champs 2
Champs 3

  1. Il ne touche pas au formulaire et clique le bouton valider.
    Le se connecte maintenant à la machine (serveur) deptinfo.cnam.fr sur le port 80.
    Puis,

    1. envoie la requête GET suivant (les information pour le serveur sont ici dans l'url)
    GET /www/page4.php?champ2=valeur&champ3=valeur HTTP/1.0
  ``          `

b. Le serveur  fait tourner le programme page4.php avec les valeurs transmise pour `champ2` et `champ3` pui répond en envoyant un entête suivi d'une ligne vide suivi du code généré; soit :

    HTTP/1.0 200 OK Content-type: text/html

    les valeurs... valeur et valeur

` ````

c. le navigateur interprete le code recu et affice le resultat

On peut résumer cela graphiquement :

graphe des connection