11:00:56 programmation web 2012-2013 1 programmation web : protocole http jérôme cutrona...
TRANSCRIPT
03:24:5103:24:51 Programmation Web 2012-2013Programmation Web 2012-2013 11
Programmation Web :Programmation Web :Protocole HTTPProtocole HTTP
Jérôme CUTRONAJérôme CUTRONA
[email protected]@univ-reims.fr
2203:24:5103:24:51 Programmation Web 2012-2013Programmation Web 2012-2013
IntroductionIntroduction
HTTP : HTTP : HHyperyperTText ext TTransfer ransfer PProtocolrotocol HTTP : Protocole du WebHTTP : Protocole du Web Protocole d'échange entre client et serveur WebProtocole d'échange entre client et serveur Web Protocole orienté ligne de caractèresProtocole orienté ligne de caractères
Dans notre cas :Dans notre cas : Étude du protocole pour la cultureÉtude du protocole pour la culture (ça rime avec torture)(ça rime avec torture)
Compréhension des cookiesCompréhension des cookies Compréhension des sessionsCompréhension des sessions Utilisation avancée de PHP (côté serveur)Utilisation avancée de PHP (côté serveur) Utilisation d’AJAXUtilisation d’AJAX
3303:24:5103:24:51 Programmation Web 2012-2013Programmation Web 2012-2013
RéseauRéseauRéseauRéseau
Utilisation de HTTP/1.0Utilisation de HTTP/1.0
Client WebClient Web(Navigateur)(Navigateur)Client WebClient Web
(Navigateur)(Navigateur)Serveur WebServeur Web
(Apache)(Apache)Serveur WebServeur Web
(Apache)(Apache)
Requête HTTPRequête HTTPRequête HTTPRequête HTTP
Réponse HTTPRéponse HTTPFermeture de connexionFermeture de connexion
Réponse HTTPRéponse HTTPFermeture de connexionFermeture de connexion
Connexion TCP (port 80)Connexion TCP (port 80)Connexion TCP (port 80)Connexion TCP (port 80)
Validation de la connexionValidation de la connexionValidation de la connexionValidation de la connexion
4403:24:5103:24:51 Programmation Web 2012-2013Programmation Web 2012-2013
RéseauRéseauRéseauRéseau
Utilisation de HTTP/1.0Utilisation de HTTP/1.0
Client WebClient Web(Navigateur)(Navigateur)Client WebClient Web
(Navigateur)(Navigateur)Serveur WebServeur Web
(Apache)(Apache)Serveur WebServeur Web
(Apache)(Apache)
Requête HTTPRequête HTTPRéponse HTTPRéponse HTTPÉtablissement d’uneÉtablissement d’uneconnexion TCP (port 80)connexion TCP (port 80)Désire desDésire desressourcesressources
Possède desPossède desressourcesressources
As-tu / ?As-tu / ?
RessourcesRessources
Fermeture de connexionFermeture de connexion
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><<htmlhtml>> <<headhead>> <<metameta http-equivhttp-equiv=="Content-Type""Content-Type" contentcontent=="text/html; charset=utf-8""text/html; charset=utf-8">> <<linklink hrefhref=="css/style.css""css/style.css" relrel=="stylesheet""stylesheet" typetype=="text/css""text/css">> <<titletitle>>J. CutronaJ. Cutrona</</titletitle>> </</headhead>> <<bodybody>><<divdiv idid=='b_connexion''b_connexion'>><<formform actionaction=='/index.php''/index.php' methodmethod=='post''post'>><<tabletable>><<trtr><><tdtd><><inputinput typetype=='text''text' namename=='login''login' sizesize=='5''5' valuevalue=='login''login' onClick="onClick="ifif ((thisthis.value==.value=='login''login')) thisthis.value=.value=''''"">> <<inputinput typetype=='password''password' namename=='passwd''passwd' sizesize=='5''5'>><<tdtd><><inputinput typetype=='submit''submit' valuevalue=='OK''OK'>></</tabletable>></</formform>></</divdiv>> <<h1h1>>Programmation WebProgrammation Web</</h1h1>> <<divdiv classclass=='partie''partie'>> <<aa hrefhref=='progwebS1''progwebS1'>>Programmation Web S1Programmation Web S1</</aa><><brbr>> <<aa hrefhref=='progwebS2''progwebS2'>>Programmation Web S2Programmation Web S2</</aa><><brbr>> <<aa hrefhref=='progwebS3''progwebS3'>>Programmation Web S3Programmation Web S3</</aa><><brbr>> </</divdiv>> <<spanspan idid=='lastmodified''lastmodified'>>Dernière modification de cette page le 07/09/2008 à 23h27 Dernière modification de cette page le 07/09/2008 à 23h27 </</spanspan>> <<divdiv classclass=='valid''valid'>> <<aa hrefhref==''http://wwwdoc/w3c-validator/check?uri=referer''>> <<imgimg borderborder=="0""0" srcsrc=="/img/valid-html401.gif""/img/valid-html401.gif" altalt=="Valid HTML 4.01!""Valid HTML 4.01!" heightheight=="31""31" widthwidth=="88""88"></></aa>> <<imgimg borderborder=="0""0" srcsrc=="/img/vcss.gif""/img/vcss.gif" altalt=="Valid CSS!""Valid CSS!" heightheight=="31""31" widthwidth=="88""88">> </</divdiv>> </</bodybody>></</htmlhtml>>
FichierFichier//
OuiOui<!DOCTYPE html PUBLIC… <!DOCTYPE html PUBLIC… <html> <html> <head><head>
……</html></html>
5503:24:5103:24:51 Programmation Web 2012-2013Programmation Web 2012-2013
Remarques importantesRemarques importantes
Le Le client ouvreclient ouvre la connexion la connexion Le Le serveur fermeserveur ferme la connexion la connexion
1 transaction = 1 ressource transférée (v 1.0)1 transaction = 1 ressource transférée (v 1.0) Protocole sans étatProtocole sans état
Aucune information gardée entre deux transactionsAucune information gardée entre deux transactions Le serveur "oublie" le client après chaque transactionLe serveur "oublie" le client après chaque transaction
Problème pour la gestion d'une sessionProblème pour la gestion d'une session
6603:24:5103:24:51 Programmation Web 2012-2013Programmation Web 2012-2013
Autres remarques importantesAutres remarques importantes
Le client demande des ressourcesLe client demande des ressources Le serveur répond aux demandes des clients :Le serveur répond aux demandes des clients :
Délivre la ressource demandée si possibleDélivre la ressource demandée si possible Informe de la raison de non remiseInforme de la raison de non remise
Echanges multi-plateformeEchanges multi-plateforme
ASCII 7bits (encodage si non ASCII 7bits)ASCII 7bits (encodage si non ASCII 7bits)
Requêtes émises en clairRequêtes émises en clair Réponses émises en clairRéponses émises en clair
7703:24:5103:24:51 Programmation Web 2012-2013Programmation Web 2012-2013
Structure d'un message HTTPStructure d'un message HTTP
Orienté lignes de caractères :Orienté lignes de caractères : = retour à la ligne= retour à la ligne
Requête ou réponse :Requête ou réponse :Requête ou état Requête ou état [Entête: valeur [Entête: valeur ]][Entête: valeur [Entête: valeur ]][… [… ]]Ligne blanche Ligne blanche [Corps de message][Corps de message]
HTTP 1.0: 16 en-têtesHTTP 1.0: 16 en-têtesHTTP 1.1: 46 en-têtesHTTP 1.1: 46 en-têtes
8803:24:5103:24:51 Programmation Web 2012-2013Programmation Web 2012-2013
Requête HTTP 1.0Requête HTTP 1.0
GET|POST|HEAD GET|POST|HEAD cheminchemin HTTP/1.0 HTTP/1.0
User-Agent: User-Agent: agent agent [Entête: valeur [Entête: valeur ]]
[Entête: valeur [Entête: valeur ]]
[… [… ]]
Ligne blanche Ligne blanche [Données][Données]
NetiquetteNetiquette
9903:24:5103:24:51 Programmation Web 2012-2013Programmation Web 2012-2013
Méthodes de requête HTTPMéthodes de requête HTTP
HEADHEADdemande des informations concernant la ressourcedemande des informations concernant la ressource
GETGETdemande des informations et la ressource désignéedemande des informations et la ressource désignée
POSTPOSTenvoi de données (formulaire vers le serveur) et envoi de données (formulaire vers le serveur) et
demande la ressource désignéedemande la ressource désignée
PUTPUTenregistrement du corps de la requête à l ’URL indiquéeenregistrement du corps de la requête à l ’URL indiquée
DELETEDELETEsuppression de la ressource désignée par l ’URLsuppression de la ressource désignée par l ’URL
101003:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
Exemple de requête HTTPExemple de requête HTTP
GET / HTTP/1.0 GET / HTTP/1.0 Ligne blanche Ligne blanche
HEAD /page1.html HTTP/1.0 HEAD /page1.html HTTP/1.0 User-Agent: Mozilla/5.0 (Windows; U; User-Agent: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7.7) Windows NT 5.1; en-US; rv:1.7.7) Gecko/20050414 Firefox/1.0.3 Gecko/20050414 Firefox/1.0.3
Ligne blanche Ligne blanche
111103:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
Réponse HTTPRéponse HTTP
HTTP/HTTP/versionversion codecode phrase phrase Content-Type: Content-Type: type_mime type_mime [Entête: valeur [Entête: valeur ]]
[Entête: valeur [Entête: valeur ]]
[… [… ]]
Ligne blanche Ligne blanche [Données][Données]
ObligatoireObligatoire
Le client doit être informé de Le client doit être informé de la la nature de la ressourcenature de la ressource : :
HTMLHTMLImage JPEGImage JPEGDoc PDFDoc PDFAnimation FlashAnimation Flash……
Exemples de Exemples de type_mimetype_mime : :•text/htmltext/html•image/jpegimage/jpeg•text/csstext/css•video/mpegvideo/mpeg•……
121203:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
Exemple de réponse HTTPExemple de réponse HTTP
HTTP/1.x 200 OK HTTP/1.x 200 OK Date: Mon, 25 Apr 2005 04:25:17 GMT Date: Mon, 25 Apr 2005 04:25:17 GMT Server: Apache/2.0.46 (Red Hat) Server: Apache/2.0.46 (Red Hat) X-Powered-By: PHP/4.3.2 X-Powered-By: PHP/4.3.2 Content-Type: text/html Content-Type: text/html Ligne blanche Ligne blanche <html><html>
<head><title> ...<head><title> ...
131303:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
États des réponses HTTPÉtats des réponses HTTP
Codes à 3 chiffres + phraseCodes à 3 chiffres + phrase 1er chiffre : classe de réponse1er chiffre : classe de réponse
1xx1xx : Information (HTTP 1.1) : Information (HTTP 1.1) 2xx2xx : Succès : Succès
200 OK200 OK 3xx3xx : Redirection : Redirection
304 NOT MODIFIED304 NOT MODIFIED 4xx4xx : Erreur client : Erreur client
403 FORBIDDEN403 FORBIDDEN 404 NOT FOUND404 NOT FOUND
5xx5xx : Erreur serveur : Erreur serveur 500 INTERNAL ERROR500 INTERNAL ERROR
141403:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
Protocole HTTP 1.1Protocole HTTP 1.1
Contexte HTTP 1.0 :Contexte HTTP 1.0 : 1 transaction1 transaction = = 1 ressource1 ressource transmise transmise PasPas de connexion de connexion persistantepersistante Mauvaise utilisation Mauvaise utilisation du cachedu cache 1 IP1 IP = = 1 serveur1 serveur Web Web
Améliorations HTTP 1.1 :Améliorations HTTP 1.1 : 1 transaction1 transaction persistante = persistante = XX ressources ressources transmises transmises Connexion Connexion persistantepersistante StandardisationStandardisation du cache du cache Découpage d'une ressource (chunk encoding)Découpage d'une ressource (chunk encoding) 1 IP1 IP = = XX serveurs serveurs Web (proxy, serveurs virtuels) Web (proxy, serveurs virtuels)
151503:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
Protocole HTTP 1.1Protocole HTTP 1.1
Contraintes du client :Contraintes du client : inclure l'en-tête inclure l'en-tête HostHost:: à chacune des requêtes. à chacune des requêtes.
Le serveur physique doit savoir quel serveur virtuel Le serveur physique doit savoir quel serveur virtuel interrogerinterroger
accepter des réponses avec des données encodées accepter des réponses avec des données encodées de type de type chunkedchunked
supporter les connections persistantes, ou inclure supporter les connections persistantes, ou inclure l'en-tête l'en-tête ConnectionConnection: : closeclose à chacune des à chacune des requêtesrequêtes
supporter la réponse supporter la réponse 100100 ContinueContinue
161603:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
Requête HTTP 1.1Requête HTTP 1.1
GET|POST|HEAD GET|POST|HEAD cheminchemin HTTP/1.1 HTTP/1.1 Host: Host: hôte hôte User-Agent: User-Agent: agent agent [header [header ]]
[header [header ]]
[… [… ]]
Ligne blanche Ligne blanche [Données][Données]
ObligatoireObligatoire
NetiquetteNetiquette
171703:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
Soumission de formulairesSoumission de formulaires
<form action="form.php" <form action="form.php" method="GET"method="GET">>
Requête HTTP :Requête HTTP :
GET form.php?GET form.php?p1=X&p2=Yp1=X&p2=Y HTTP/1.0 HTTP/1.0 LigneLigne blanche blanche
Traduit dans l'URL : Traduit dans l'URL : http://abc/form.phphttp://abc/form.php?p1=X&p2=Y?p1=X&p2=Y
Peut donc être mis en favoriPeut donc être mis en favori
Valeurs saisies dans le formulaire :Valeurs saisies dans le formulaire :Couples Couples nom_champ=valeur_encodéenom_champ=valeur_encodée séparés séparés par par &&
181803:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
Soumission de formulairesSoumission de formulaires
<form action="form.php" <form action="form.php" method="POST"method="POST">>
Requête HTTP :Requête HTTP :
POST POST form.phpform.php HTTP/1.0 HTTP/1.0
Content-Type:Content-Type: application/x-www-form-urlencoded application/x-www-form-urlencoded Content-Length: 9 Content-Length: 9 LigneLigne blanche blanche p1=X&p2=Yp1=X&p2=Y
NON traduit dans l'URLNON traduit dans l'URL
Ne peut donc PAS être mis en favoriNe peut donc PAS être mis en favori
Valeurs saisies dans le formulaire :Valeurs saisies dans le formulaire :Couples Couples nom_champ=valeur_encodéenom_champ=valeur_encodée séparés séparés par par &&
191903:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
Encodage des donnéesEncodage des données
Protocole HTTP : ASCII 7bits (base commune à toutes Protocole HTTP : ASCII 7bits (base commune à toutes les plateformes)les plateformes)
Tout caractère non ASCII 7bits doit être encodéTout caractère non ASCII 7bits doit être encodé saisies dans les formulaires (fait par le navigateur)saisies dans les formulaires (fait par le navigateur) URL (à faire soi-même)URL (à faire soi-même)
Principe d’encodage :Principe d’encodage : EspaceEspace ++ Caractères spéciauxCaractères spéciaux %%code_ASCII_hexacode_ASCII_hexa Caractères accentuésCaractères accentués %%code_ASCII_hexacode_ASCII_hexa Exemples :Exemples : ô ô %F4 %F4
[ [ %5B %5B
202003:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
CookiesCookies
But :But : Éviter que le serveur « oublie le client »Éviter que le serveur « oublie le client » Maintenir un « mode connecté » (= session)Maintenir un « mode connecté » (= session) Rendre transparent un échange client / serveurRendre transparent un échange client / serveur Exemple e-commerce : ajouter des articles au panierExemple e-commerce : ajouter des articles au panier
Serveur :Serveur :Set-Cookie: Set-Cookie: varvar==valval[[; expires=; expires=datedate; ; path=path=cheminchemin; domain=; domain=domainedomaine]]
Client :Client :Cookie: Cookie: varvar==valval;;
212103:24:5203:24:52 Programmation Web 2012-2013Programmation Web 2012-2013
RéseauRéseau
Cookies, principe des échangesCookies, principe des échanges
Client WebClient Web(Navigateur)(Navigateur)
Serveur WebServeur Web(Apache)(Apache)
GET / HTTP/1.1GET / HTTP/1.1
HTTP/1.1 200 OKHTTP/1.1 200 OKSet-CookieSet-Cookie: Id=1212; path=/;: Id=1212; path=/;
GET /liste HTTP/1.1GET /liste HTTP/1.1CookieCookie: Id=1212: Id=1212
HTTP/1.1 200 OKHTTP/1.1 200 OK……
Id=1212;Id=1212; path=/;path=/;