Architecture et langages Web (NFA040)
Notions de protocole, HTTP
Olivier Pons
(pons@cnam.fr)
2022
Modèle OSI et TCP/IP
L'organisation en couche se retrouve dans la norme modèle OSI
Grossièrement, l'idée est qu'a un certain niveau un service s'appui
sur ceux des couches inférieures.
Très informellement, si vous envoyez vos photos de vacance à votre
grand mère vous ne vous souciez pas de comment est encoder la photo,
comment sont découpées les données ou quelle suite de signaux passe dans
les cables... Tout cela est délégué aux couche sous-jacentes.
Inversement quand votre grand mère reçoit le message, une remonté des
différentes couche permet de restituer le résultat.
Modèle OSI et TCP/IP
Au niveau des implantations c'est la pile de protocole
TPC/IP qui s'est imposée.
Les protocoles (notamment http) dont nous parlerons par
la suite se situent dans la couche haute de tcp/ip
Identification d'une machine
Pour identifier une machine on lui associe une adresse IP sous
forme numérique:
- Numéro IP :
193.54.195.244
Comme cela n'est pas très pratique à retenir on préfère utiliser des
noms de domaine et de machine
- Nom de machine :
www.ensiie.fr
la machine www du domaine ensiie de la
hiérarchie fr)
Pour retrouver le numéro associé à un nom on utilise un
service de resolution de nom de domaine
- DNS
(Domain Name System) : service résolution de nom pour faire le lien
entre les 2 précédents.
Exemple
Une tentative de connexion:
[olivier@mamaison]$ telnet www.ensiie.fr
Trying 193.54.195.244...
telnet:connect to address 193.54.195.244: Connection refused
telnet:Unable to connect to remote host: Connection refused
[olivier@mamaison tmp]$
On initialise la connection à une machine (ici
www.ensiie.fr)
Dans toute connection reseau, la premiere chose est d’interroger un
service de DNS pour trouver le numero IP de la machine (ici
193.54.195.244 ).
Ici la machine n'accepte pas de connection (sur le port par défaut de
telnet 13) donc la connection est coupée.
Remarque
Telnet est a la
fois un protocole et une un logiciel (utilisé dans l'exemple pour
initier une connection a une machine)
On utilisera aussi le logiciel curl
Identification d'un service : Port
Numéro de port : identifie parc convention un service.
Vous pouvez consulter une liste des
ports classique.
Si le serveur écoute sur un port la connexion
est possible sur ce port et le service est donc disponible.
Il y a alors un deamon (un programme qui tourne tout
le temps en arrière plan) tourne dans l'attente de connexion, on parle
alors de serveur.
Le qualificatif qui suit le terme serveur dépend du service
attendu
Exemples
Le service de shell sécurisé ssh
Le deamon , serveur sshd tourne
sur le port 22; on peut normalement s'y connecter avec un
client ssh;
mais on peut aussi ititier une connextion à la main :
Exemple de connexion
ssh à www.ensiie.fr
[olivier@mamaison tmp]$ telnet www.ensiie.fr 22
Trying 193.54.195.244...
Connected to www.ensiie.fr (193.54.195.244).
Escape character is '^]'.
SSH-1.99-OpenSSH_3.8.1p1 Debian-8.sarge.4
....
...
Les serveurs web (http) écoutent par default sur le port
80 (on peut le changer).
On peut normalement s'y connecter avec un client , en
l’occurrence un navigateur web;
mais, on peut aussi initier une connexion « à la main» :
Exemple
de connexion au serveur http (port 80) sur
www.ensiie.fr
[olivier@mamaison tmp]$ telnet www.ensiie.fr 80
Trying 193.54.195.244...
Connected to www.ensiie.fr (193.54.195.244).
Escape character is '^]'.
....
Dialoguer « à la main » avec un serveur
Il est possible via telnet ou en utilisant le logiciel
curl de dialoguer « à la main » avec un serveur.
Pour cela il faut:
- se connecter sur le port correspondant au service
- dialoguer en respectant le protocole
quand « le client écrit » au serveur on parle de « requête ».
Exemple: le web, HTTP
Commençons par une requête http basique.
- on se connect au serveur sur le port 80
- on demande la ressource (ici une page html) grace à la commande
(méthode)
GET suivi du chemin de la ressource sur le
serveur
- le serveur renvoie le code source (html) de la page
- le serveur ferme la connection
pons@MacBook-Pro-de-olivier ~ % telnet cedric.cnam.fr 80
Trying 163.173.128.10...
Connected to cedric.cnam.fr.
Escape character is '^]'.
GET /~pons/NFA040/codefile/pageExample.html
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Developpement web 1</title>
</head>
<body>
<h1>Bienvenue au cours Developpement Web</h1>
<img src="../images/nenuphars.png" alt="Un beau nénuphars en fleur">
<p>
Ce cours a pour objectif de dresser un tableau complet de
l'architecture
du <a href="http://fr.wikipedia.org/wiki/Web">WEB</a> et des technologies
concernées dans la construction d'un site basique.
</p>
<h2>le complément</h2>
<p>
Le cours de programmation javascript
</p>
</body>
</html>Connection closed by foreign host.
pons@MacBook-Pro-de-olivier ~ %
Ici il n'y a donc qu'une commande (on dira méthode par la suite)
GET
C'est la version originale du protocole HTTP.
HTTP
Propose différentes méthodes qui dépendent des
versions. Les versions ont évoluées
au cours du temps.
Ces évolutions ont introduit de nombreuses méthodes et optimisations
(proxy, connexion permanente, encodage ...)
- HTTP original (0.9) :
GET
et connection fermée
- HTTP 1.0 : ajout de et
HEAD
et POST,
PUT,
[DELETE]
(https://developer.mozilla.org/fr/docs/Web/HTTP/Methods/DELETE) +
...
- HTTP 1.1 : ajout de
OPTIONS,
CONNECT
et TRACE,
+ ...
- HTTP 2 : surtout de l'optimisation , des compressions ...
Nous présentons par la suite les méthodes GET et
POST qui sont fondamentales pour la comprehension des
formulaires Web. Et, à titre d'illustration les méthodes
HEAD et OPTION
HTTP 1.0
Exemple de dialogue « à la main » avec un serveur http en utilisant
http 1.0
- Le client se connecte
Le client envoie une requête GET demandant la
ressource /~pons/NFA040/codefile/pageExample.html en
précisant que le protocole qu'il utilise est HTTP 1.0
GET /~pons/NFA040/codefile/pageExample.html HTTP/1.0
Le serveur répond
- par un entête qui precise entre autre
HTTP/1.1 200 OK
que tout va bien que la requête est comprise et traité
(200 OK)
qu'il comprend aussi la version 1.1 du protocole et que l'on peut donc
l'utiliser par la suite
- la date du serveur (qui peut être différente de celle du client,
surtout si le serveur est loin !)
- Le serveur web utilisé (ici Apache)
- La date de dernière modification (utilise pour savoir si il y a eu
des modifs depuis notre dernière visite...)
- un Etags,
pour le cache et la detection de changement
- la taille du contenu envoyé dans la seconde partie
(content-length)
- une information disant si la connexion est maintenue apres cette
requête (ici non)
- le type de ressource envoyé (ici du texte, html)
- une ligne vide
- le code html de la page demandée
le serveur ferme la connexion
pons@MacBook-Pro-de-olivier ~ % telnet cedric.cnam.fr 80
Trying 163.173.128.10...
Connected to cedric.cnam.fr.
Escape character is '^]'.
GET /~pons/NFA040/codefile/pageExample.html HTTP/1.0
HTTP/1.1 200 OK
Date: Sun, 1 Jan 2023 20:25:13 GMT
Server: Apache
Last-Modified: Tue, 01 Nov 2022 12:30:36 GMT
ETag: "233-5ec67e41ede48"
Accept-Ranges: bytes
Content-Length: 563
Connection: close
Content-Type: text/html
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Developpement web 1</title>
</head>
<body>
<h1>Bienvenue au cours Developpement Web</h1>
<img src="../images/nenuphars.png" alt="Un beau nénuphars en fleur">
<p>
Ce cours a pour objectif de dresser un tableau complet de
l'architecture
du <a href="http://fr.wikipedia.org/wiki/Web">WEB</a> et des technologies
concernées dans la construction d'un site basique.
</p>
<h2>le complément</h2>
<p>
Le cours de programmation javascript
</p>
</body>
</html>Connection closed by foreign host.
pons@MacBook-Pro-de-olivier ~ %
Exemple: envoie de donnée avec la méthode GET
La méthode GET permet d'envoyer des données au serveur
dans l'url
Ici un prénom, un nom et un age.
les données transmises suivent le nom du fichier demandée, commencent
par un ? puis on la forme
nomDeVariable=valeurDeVariable elle sont séparé par
&
la requête sera donc:
GET /~pons/NFA040/echo.php?prenom=Karl&nom=Marx&age=204 HTTP/1.0
et la « discussion » complète :
telnet cedric.cnam.fr 80
Trying 163.173.128.10...
Connected to cedric.cnam.fr.
Escape character is '^]'.
GET /~pons/NFA040/echo.php?prenom=Karl&nom=Marx&age=204 HTTP/1.0
HTTP/1.1 200 OK
Date: Mon, 2 Jan 2023 09:39:39 GMT
Server: Apache
X-Powered-By: PHP/5.6.40
Content-Length: 105
Connection: close
Content-Type: text/html; charset=UTF-8
<h2>methode GET </h2>Données transmises par get dans l'url <br>prenom=Karl<br>nom=Marx<br>age=204<br>
Connection closed by foreign host.
pons@MacBook-Pro-de-olivier NFA040 %
Exemple: envoie de données avec la méthode POST
Lorsqu'on envoie des données au serveur avec la méthode
POST elles ne sont pas dans l'url (quoi d'on puisse en
mettre aussi !) mais dans l'entête du message.
POST /~pons/NFA040/echo.php HTTP/1.1 <-- requete post
Host: cedric.cnam.fr <-- host
Accept: */*
Content-Length: 30 <--longueur des données transmises
Content-Type: application/x-www-form-urlencoded <-- type d'encodage
vous=Les+eleves&eux=Les+autres <-- les données
Remarque :
Que ce soit avec POSTou avec GET, les
données ne doivent pas contenir d'espace ou de caractères spéciaux; ils
sont encodés.
Les espaces sont encodés par des + (ici on le fait
manuellement mais dans le navigateur c'est évidemment lui qui se charge
de l'encodage.)
[olivier@mamaison]$telnet cedric.cnam.fr 80
Trying 163.173.128.10...
Connected to cedric.cnam.fr.
Escape character is '^]'.
POST /~pons/NFA040/echo.php HTTP/1.1
Host: cedric.cnam.fr
Accept: */*
Content-Length: 30
Content-Type: application/x-www-form-urlencoded
vous=Les+eleves&eux=Les+autres
HTTP/1.1 200 OK
Date: Mon, 2 Jan 2023 10:35:36 GMT
Server: Apache
X-Powered-By: PHP/5.6.40
Content-Length: 113
Content-Type: text/html; charset=UTF-8
<h2>methode POST </h2>Données transmises par post dans le corps <br>vous=Les+eleves<br>eux=Les+autres<br><br>
^C^C
Connection closed by foreign host.
utiliser GET ou POST ?
- GET : les données sont dans l'url
- elles sont visibles à l'écran (à éviter pour un mot de passe !)
- elles sont limitées en taille (par la taille des url)
elles ne conviennent pas pour des données binaires (images,
videos...)
- l'url contenant les données peut être mise dans les favoris
- POST : les données sont dans l'url
- elles ne sont pas visibles à l'écran
- elles sont beaucoup moins limitées en taille elles conviennent aussi
pour des données binaires (images, videos...)
- l'url ne peut être mise dans les favoris
Attention :
Le fait que POST n'affiche pas les données ne les rend
pas invisibles pour autant. Si on utilise http les donnés
sont transmises en clair dans l'entête du client.
Pour des données sécurisées il faut utiliser POST
et https
Exemple: avec la méthode HEAD
Le méthode HEADne renvoie que l'entête. Cela permet
notamment (grace au champs Last-Modified) de savoir si le
contenu de la page a changé avant de la télécharger.
pons@MacBook-Pro-de-olivier% telnet example.com 80
Trying 93.184.216.34...
Connected to example.com.
Escape character is '^]'.
HEAD / HTTP/1.1
Host: example.com
HTTP/1.1 200 OK
Content-Encoding: gzip
Accept-Ranges: bytes
Age: 334952
Cache-Control: max-age=604800
Content-Type: text/html; charset=UTF-8
Date: Mon, 2 Jan 2023 08:49:32 GMT
Etag: "3147526947"
Expires: Mon, 23 Jan 2023 08:49:32 GMT
Last-Modified: Thu, 17 Oct 2019 07:18:26 GMT
Server: ECS (bsa/EB17)
X-Cache: HIT
Content-Length: 648
^CConnection closed by foreign host.
Exemple: avec la méthode OPTION
La méthode OPTION permet entre autre de demander au
serveur les méthodes qu'il connaît avant de continuer la discussion.
pons@MacBook-Pro-de-olivier NFA040 % telnet example.org 80
Trying 93.184.216.34...
Connected to example.org.
Escape character is '^]'.
OPTIONS / HTTP/1.1
Host: example.org
HTTP/1.1 200 OK
Allow: OPTIONS, GET, HEAD, POST
Cache-Control: max-age=604800
Content-Type: text/html; charset=UTF-8
Date: Mon, 2 Jan 2023 10:06:22 GMT
Expires: Mon, 23 Jan 2023 10:06:22 GMT
Server: EOS (vny/0453)
Content-Length: 0
Connection closed by foreign host.
Entêtes et codes de retour
- 10X, 30X, attente d'action complémentaire
- 20X : OK
- 40X,50X : Problèmes
Exemple de code de retour
Ici on demande une ressource qui n'existe pas, le code de retour est
404 et le message Not Found
pons@MacBook-Pro-de-olivier NFA040 % telnet cedric.cnam.fr 80
Trying 163.173.128.10...
Connected to cedric.cnam.fr.
Escape character is '^]'.
HEAD /inconnue HTTP/1.1
Host: cedric.cnam.fr
HTTP/1.1 404 Not Found
Date: Mon, 2 Jan 2023 09:45:11 GMT
Server: Apache
Vary: accept-language,accept-charset
Accept-Ranges: bytes
Content-Type: text/html; charset=utf-8
Content-Language: en
Là le serveur nous répond que la ressource a été déplacée
code 301 et message Moved Permanently
il donne la nouvelle url. (ici il faut utilisé https)
pons@MacBook-Pro-de-olivier NFA040 % telnet www.cnam.fr 80
Trying 163.173.128.40...
Connected to kaurip.cnam.fr.
Escape character is '^]'.
GET / HTTP/1.0
HTTP/1.1 301 Moved Permanently
Content-length: 0
Location: https:///
Connection: close
Connection closed by foreign host.
pons@MacBook-Pro-de-olivier NFA040 %
L'outil curl
L'outil curl dont je vous invite à parcourir la documentation permet de faire à peut
pret toutes les connexions « à la main » que nous avons présentées avec
telnet
par exemple
pons@MacBook-Pro-de-olivier NFA040 % curl -v telnet://example.com:80
* Trying 93.184.216.34:80...
* Connected to example.com (93.184.216.34) port 80 (#0)
HEAD / HTTP/1.1
Host: example.com
HTTP/1.1 200 OK
Content-Encoding: gzip
Accept-Ranges: bytes
Age: 64891
Cache-Control: max-age=604800
Content-Type: text/html; charset=UTF-8
Date: Mon, 2 Jan 2023 10:00:39 GMT
Etag: "3147526947+ident"
Expires: Mon, 23 Jan 2023 10:00:39 GMT
Last-Modified: Thu, 17 Oct 2019 07:18:26 GMT
Server: ECS (bsa/EB15)
X-Cache: HIT
Content-Length: 648
^C
pons@MacBook-Pro-de-olivier NFA040 %
Mais il peut faire beaucoup plus de choses...
Exemple https via curl
une connexion sécurisée https (l'option -v, pour verbose
permet d'observer ce qui se passe):
curl -v https://example.org/
Exemple: L'envoi de mails « à la mail » , SMTP
Le protocole STMP, correspond au port 25. Ci dessous un exemple
d'envoi « à la main » en utilisant le serveur de mail de free (ce qui
n'est possible que si vous êtes sur un reseau free, sinon il faut celui
de votre FAI)
[inviteUnix~]$telnet smtp.free.fr 25 <--- utilisateur
Trying 212.27.48.4...
Connected to smtp.free.fr.
Escape character is '^]'.
220 smtp1-g19.free.fr ESMTP Postfix
EHLO olivier <--- utilisateur
250-smtp1-g19.free.fr
...
250 8BITMIME
MAIL FROM: pons@cnam.fr <--- utilisateur
250 Ok
RCPT TO: pourlesnews@yahoo.fr <--- utilisateur
250 Ok
DATA
354 End data with <CR><LF>.<CR><LF>
test pour le cours protocols... <--- utilisateur
C beau. <--- utilisateur
. <--- utilisateur
250 Ok: queued as A341D3480
QUIT <--- utilisateur
221 Bye
Connection closed by foreign host.
[inviteUnix~]$
Exemple: L'envoi de mails, SMTP (suite)
On peut fixer les champs from et to
: Ici on ne donne que les commande taper par l'utilisateur apres
connexion.
HELO moi
MAIL FROM: pons@cnam.fr
RCPT TO: pons.olivier@gmail.com
DATA
From: segolene@ps.fr
To: jacque@elyse.fr
Subject: un test
blabla
.
QUIT
Exemple: L'envoi de mails, SMTP (suite)
- Envoyer des images, des textes avec accent, des caractères plus
compliqués ... Il faut les encoder. Pour décrire l'encodage on utilise
les Type
MIME (Multipurpose Internet Mail Extensions)
EHLO moi
MAIL FROM:pons@cnam.fr
RCPT TO:pons@cnam.fr
DATA
From: candidats@cnam.fr
To: leprochain@elyse.fr
Subject:"bientot moi ..."
MIME-Version: 1.0
Content-Type: image/gif; name="arrow.gif"
Content-Transfer-Encoding: base64
Content-Disposition: attachment;
filename="arrow.gif"
R0lGODlhBwAEAIAAAAAAAP///yH5BAEAAAEALAAAAAAHAAQAAAIIhA+BGWoN
WSgAOw==
====
.
QUIT
Envoi de mail avec curl
L'outil curl est extrêmement puissant, et permet de
manipuler la plupart des protocoles.
Ainsi si depuis une machine du reseau cnam vous avez accès aux
serveur smtp du cnam et pouvez envoyer un mail par.
curl smtp://smtp.cnam.fr --mail-from root@cnam.fr --mail-rcpt \
pons@cnam.fr --upload-file monmail.txt
avec monmail.txt
From: "Karl" <marx@cnam.com>
To: "Friedrich" <Engels@cnam.org>
Subject: This is a test
Salut Fredo,
Il parait qu'on va vrai un mouvement massif de
defense des acquis sociaux...
bise.
K.
Exemple: La reception de mails, POP
pons@pc-olive:~ telnet pop.mail.yahoo.fr 110
Trying 217.12.10.100...
Connected to pop1.mail.vip.ukl.yahoo.com.
Escape character is '^]'.
+OK hello from popgate(2.35.8)
USER pourlesnews
+OK password required.
PASS monmotdepasse
+OK maildrop ready, 83 messages (498477 octets) (80067
1073741824)
LIST
+OK 83 messages (498477 octets)
1 16115
2 943
3 1189
4 4021
5 2007
6 4922
7 762
...
Exemple: La réception de mails, POP suite
...
TOP 7 10
+OK 762 octets
X-Apparently-To: pourlesnews@yahoo.fr via 217.12.10.165; Mon, 30 Oct 2006 03:40:
44 -0800
X-Originating-IP: [212.27.42.27]
Authentication-Results: mta517.mail.mud.yahoo.com from=cnam.fr; domainkeys=neutral (no sig)
Received: from 212.27.42.27 (EHLO smtp1-g19.free.fr) (212.27.42.27)
by mta517.mail.mud.yahoo.com with SMTP; Mon, 30 Oct 2006 03:40:44 -0800
Received: from olivier (nor75-7-81-57-85-121.fbx.proxad.net [81.57.85.121])
by smtp1-g19.free.fr (Postfix) with ESMTP id A341D3480
for ; Mon, 30 Oct 2006 12:39:13 +0100 (CET)
Message-Id: <20061030113913.A341D3480@smtp1-g19.free.fr>
Date: Mon, 30 Oct 2006 12:39:13 +0100 (CET)
From: pons@cnam.fr
To: undisclosed-recipients:;
test pour le cours protocol...
C beau
.
QUIT
+OK server signing off. Connection closed by foreign host.
