La présentation est en train de télécharger. S'il vous plaît, attendez

La présentation est en train de télécharger. S'il vous plaît, attendez

1 / 54 10 / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB ARCHITECTURE WEB – COURS I

Présentations similaires


Présentation au sujet: "1 / 54 10 / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB ARCHITECTURE WEB – COURS I"— Transcription de la présentation:

1 1 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB ARCHITECTURE WEB – COURS I ( )

2 2 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB OBJECTIFS Maîtriser les principes et protocoles employés par le Web Montrer lévolution du Web –De la diffusion dinformation répartie vers lexécution dapplications client/serveur

3 3 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB PLAN Internet et les services Le Web: protocole (HTTP), langage (HTML) et serveurs web Le Web dynamique

4 4 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Internet et les services –Internet: rappel –Services dans lInternet –Client/Serveur Le Web: protocole (HTTP), langage (HTML) et serveur web Le Web dynamique

5 5 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Internet Interconnexion de réseaux à léchelle planétaire –Crée par la DARPA en 1969 Protocole universel: TCP/IP (socket) Ensemble de services: Web, FTP, telnet, SMTP, … –Fonctionne en mode Client/Serveur Source:

6 6 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Services dans lInternet Un Service –Une application (serveur) –Joignable à une URL (Uniform Ressource Locator) ou URI (U.R.Identifier): Nom DNS Document Avec un protocole: HTTP À un port TCP (par défaut): port 80

7 7 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Services dans lInternet (2) On peut préciser –Un port différent autre que le port 80 (port par défaut) –Une section dun document –Un couple dauthentification (user+passwd)

8 8 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Rappel sur le Client/Serveur Notion de Service: un client demande un service à un serveur –Ex: Prof/Elève Le client et le serveur peuvent être co- localisé ou distant –Le client: interface entre lutilisateur et un serveur –Ex: Netscape, Mozilla, IE

9 9 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Principe Processus client Processus serveur Processus client Requête Réponse STATION ASERVEUR B

10 10 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Client/Serveur dans lInternet Le client: interface entre lutilisateur et un serveur –Ex: Netscape, Mozilla, IE Le serveur: fournisseur de services au client –Ex: Apache, Internet Information Server => un protocole de communication est nécessaire

11 11 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB World Wide Web Internet et les services Le Web: protocole (HTTP), langage (HTML) et serveur web –Historique du Web –Évolution du Web –Architecture de base –Les standards –Serveur Web Le Web dynamique

12 12 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Historique du WWW 1965: Naissance du concept hypertext –Inventé par Ted Nelson, étudiant en Philosophie –Projet Xanadu interrompu en 1991 Mars 1989: Tim Berners-Lee du CERN reprend lidée de Ted Nelson pour concevoir un système dinformation performant Novembre 1990: Proposition de Tim Berners-Lee –Tim Berners-Lee & R. Caillian, "World-Wide Web: Proposal for HyperText," CERN Memo, November 1990."World-Wide Web: Proposal for HyperText," Quelques mois plus tard: Le premier navigateur est écrit 1991: Le premier Serveur Web est développé

13 13 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Historique du WWW (suite) Fin 1992: 26 Serveurs Web Mars 1994: Netscape Comm. Corp est créé par le développeur de Mosaic, premier navigateur graphique multi plateforme Juillet 1994: Création du W3C (WWW Consortium), organisme chargé de réglementer les standards en vigueur sur le Web et l'Internet –Fondateurs: Tim Berners-Lee, MIT et CERN rejoint ensuite par lINRIA et Keio University of Japan

14 14 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Evolution du Web Evolution en part de marché des différents serveurs Web Evolution du nombre de serveurs Web Multiplié par 2 /an ! Source:

15 15 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Architecture de base HTTP Client WebServeur Web Pages HTML

16 16 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Protocole HTTP Hyper Text Transport Protocol –Protocole de communication entre Navigateur et Serveur Web (Requête Réponse) –Protocole applicatif (couche 7 OSI) en mode texte Protocole sans session –Depuis HTTP/1.1, la connexion est persistante –Dernière version du W3C (travail sur XML maintenant) Protocole peut sécurisé, solutions –S-HTTP (Secure-HTTP) du NCSA –SSL (Secure Socket Layer) proposé par Netscape

17 17 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Requête HTTP –Requête simple: GET (version HTTP/0.9) –Requête complète: + Méthode= { GET | POST | HEAD | PUT | DELETE | TRACE | OPTIONS } URI= adresse du document Version-HTTP= { HTTP/1.0 | HTTP/1.1 } En-tête= Clé: valeur

18 18 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Requête HTTP (2) GET: Requête du document identifié par lURI POST: Envoie dinformations à un URI et attente de la réponse HEAD: Requête des méta-informations dun document identifié par un URI

19 19 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Requête HTTP (3) Requête HTTP de paris12.fr/miage/garde.htmlhttp://www.univ- paris12.fr/miage/garde.html GET /miage/garde.html HTTP/1.1 Host: User-Agent: Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.0.1) Gecko/ Accept: text/xml,application/xml,application/xhtml+xml,text/html;q= 0.9,text/plain;q=0.8,video/x- mng,image/png,image/jpeg,image/gif;q=0.2,text/css,*/*;q= 0.1 Accept-Language: en-us, en;q=0.50 Accept-Encoding: gzip, deflate, compress;q=0.9 Accept-Charset: ISO , utf-8;q=0.66, *;q=0.66 Keep-Alive: 300 Connection: keep-alive Method GET+URI+Protocol version Request Header NB: ici lURI est lURI relative car la connexion avec le serveur HTTP est établie

20 20 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Réponse HTTP Version-HTTP= idem requête Code de statut= état de la réponse (OK, !OK, …) Raison= explications sur le code du statut En-tête HTTP Clé: valeur Données de la réponse Code HTML, images, sons, etc…

21 21 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Réponse HTTP (2) Réponse HTTP: HTTP/ OK Date: Wed, 18 Dec :11:45 GMT Server: Apache/ (Unix) PHP/4.2.3 Last-Modified: Thu, 04 Apr :35:39 GMT ETag: "55c0b-30b-3cac80db" Accept-Ranges: bytes Content-Length: 779 Keep-Alive: timeout=15, max=100 Connection: Keep-Alive Content-Type: text/html Miage Paris 12

22 22 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Réponse HTTP: status (3) 1xx Informational 2xx Success 3xx Redirection 4xx Client Error 5xx Server Error

23 23 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Exercices Connectez vous en telnet sur –Port 80 –URI: /miage/garde.html –Faîtes un requête simple –Faîtes une requête complète en testant plusieurs méthodes GET HEAD Version-HTTP= HTTP/1.1 de len-tête à préciser ( Attention: la clé Host doit toujours être précisée lorsquon utilise la version HTTP/1.1) Après une requête complète de /miage/garde.html, rapatriez /miage/logo.gif? Quelle différence observez-vous entre une requête simple et une requête complète dans le comportement du serveur?

24 24 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Exercices (2) Daprès-vous quel impact à cette différence de comportement sur le trafic de lInternet? Essayez dobtenir différents status pour les réponses HTTP? Quel est le type du serveur (sa marque)? Lancez un navigateur Web et connectez-vous à lURL –Afficher la source de la page: menu Affichage -> Source –A quoi correspond ce que vous visualisez?

25 25 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Langage HTML Hyper Text Markup Language –Langage de description de page Web –Grammaire à base de marqueurs ou balises Evolution –HTML (1er standard) (le plus courant) (dernière Norme W3C) –Nouvelle norme: XHTML (HTML+XML) Les balises permettent de décrire un document avec: –Titres, paragraphes, listes, tableaux, liens hypertexte, images, formulaires, etc…

26 26 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Structure dun document en HTML …

27 27 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Exemple de code HTML Miage Paris 12 IUP MIAGE et DESS ISI 71, rue Saint-Simon, Créteil cedex tel (formation initiale et européenne) tel (formation en apprentissage et continue) tel (DESS) En-tête HTML Corps HTML

28 28 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Serveur WWW: fonctions Gère les connections des clients Web Assure la protection des documents statiques (pages HTML, documents multimédias, programme) Vérifie la validité des requêtes et les droits des clients Exécute les requêtes des clients

29 29 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Serveur WWW: gestion des documents Les documents sont stockés sur le système de fichiers de la machine serveur Arborescence de fichiers –Par défaut, à partir dun répertoire racine fixé par ladministrateur (ou Webmaster) –A partir du répertoire /public_html à la racine dun compte utilisateur Les documents doivent être en lecture pour le démon serveur http afin quil puisse y accéder

30 30 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Serveur WWW: protection des documents Protection standard par le système de fichiers du système dexploitation (Cf. autorisations daccès) Protection propre au serveur Web pour accéder à un document –Accès avec un nom dutilisateur et un mot de passe (Cf..htaccess) –Accès à partir dun domaine IP –Accès depuis certaines machines

31 31 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Serveur Apache Apache est un serveur Web multi plateforme (Windows, Unix, …) Un démon httpd écoute en permanence sur le port 80 (port par défaut) et accepte les connexions Un fichier de configuration httpd.conf permet de configurer le serveur –Port TCP découte –Racine des documents web dans le système de fichier du serveur –Configuration de la sécurité –Configuration des logs de connexions et derreurs –….

32 32 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Serveur Apache: fichier de configuration # Racine des fichiers de configurations, derreurs et de logs ServerRoot "/etc/httpd" … # Port TCP découte Listen 80 … # Utilisateur et groupe exécutant le démon httpd User apache Group apache … # Adresse de ladministrateur qui apparaît sur les pages générées par le serveur comme une page derreur ServerAdmin # Racine dans le système de fichier des documents web DocumentRoot "/home/www/" #Configuration du répertoire de la racine des documents web Options Indexes FollowSymLinks AllowOverride All Order allow,deny Allow from all

33 33 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Serveur Apache: fichier de configuration # Nom du fichier de restriction daccès à rechercher dans les répertoires contenant des documents AccessFileName.htaccess # Log les adresses IP ou le nom des clients (Off=IP,On=nom) HostnameLookups Off # Fichier de log des erreurs ErrorLog logs/error_log # Niveau dalerte à reporter dans le fichier error.log choisi parmi debug, info, notice, warn, error, # crit, alert, emerg LogLevel warn # Définition de formats de log LogFormat "%h %l %u %t \"%r\" %>s %b \"%{Referer}i\" \"%{User-Agent}i\"" combined LogFormat "%h %l %u %t \"%r\" %>s %b" common # Fichier de log des connexions et son format associé CustomLog logs/access_log combined # Indique les répertoires contenant des scripts scriptAlias /cgi-bin/ "/var/www/cgi-bin/"

34 34 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB World Wide Web dynamique Internet et les services Le Web: protocole (HTTP), langage (HTML) et serveurs web Le Web dynamique –Du Web aux applications Web –Architecture étendue –Limites du Web –Évolution du Web

35 35 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Du Web aux applications Web Objectifs: comment rajouter de linteractivité dans les pages Web?Objectifs: comment rajouter de linteractivité dans les pages Web? Solution:Solution: –Rajouter de linteractivité coté client et/ou serveur

36 36 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Interactivité coté client Formulaire HTML –Interaction simple entre lutilisateur et le serveur JavaScript –Permet de vérifier un formulaire, afficher des fenêtres pop-up, … Applet Java –« Petite Application » Java compilée Téléchargée à partir dun serveur Web Exécution sécurisée par la JVM du client Web

37 37 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Interactivité coté serveur CGI (Common Gateway Interface) –Historiquement premier protocole permettant de créer des pages dynamiques PHP, ASP (Microsoft) Java Server Pages (JSP) Servlets –Equivalent du CGI pour Java avec des extensions –Application Java compilée Réside sur le serveur Exécution par la JVM du serveur

38 38 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Architecture étendue avec CGI HTTP Client WebServeur Web Pages HTML statiques Script CGI Appli externe CGI Protocole dédié BD ou système de fichiers Formulaire HTML

39 39 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Formulaire HTML Un formulaire autorise linteractivité entre le client et le serveur Un formulaire contient: –Des zones de saisie avec des boutons, des listes de choix, … –Un attribut action qui définit lURL dun programme exécutable sur le serveur –Un attribut method qui définit le mode de transfert des données vers le programme

40 40 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Formulaire HTML: exemple (2) Formulaire avec deux champs et deux choix utilisant la méthode GET Utilisateur: Mdp: Retenir le mot de passe? oui non URL du CGI Code HTML du formulaire NB: ici lURI est lURI absolue mais on peut utiliser lURI relative pour désigner le CGI

41 41 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Programmation CGI Communication entre le serveur Web et le script CGI –Un ensemble de variables denvironnement (GET) –Lentrée standard du processus CGI en exécution (POST) –La sortie standard du processus CGI en exécution Problème de sécurité –Exécution du script avec le minimum de droits –Eviter laccessibilité du code source du script –Vérifier les données en provenance du formulaire (Cf. JavaScript)

42 42 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Formulaires et CGI Principe de fonctionnement –Lutilisateur remplit son formulaire –Le formulaire est envoyé au serveur Web –Le serveur positionne les variables denvironnements CGI –Le serveur lance lexécution du script CGI avec le contenu du formulaire –Le script CGI fabrique le document (HTML) et le renvoie au serveur sur sa sortie standard –Le serveur renvoie le document au client On obtient une page HTML dynamique!!

43 43 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Formulaires et CGI (2) Contenu du formulaire –Une chaîne de caractères représentant une liste déléments du formulaire (champ=valeur) Méthode GET –La chaîne est ajoutée à lURL désignant le script –Elle est mise dans la variable denvironnement QUERY_STRING Méthode POST –La chaîne est envoyée dans une séquence spéciale –Elle est transmise au script sur son entrée standard

44 44 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Formulaires et CGI (3) Client WebServeur Web Script CGI 1- Requête 2- Envoi 3- Validation 4- Envoi vers CGI 5- Expédition sortie 6- Envoi sortie Chargement du formulaire Traitement des données Réception sortie (HTML) Complètement puis HTML/HTTPCGI

45 45 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Problème du CGI Client Web 1 Processus serveur Client Web 2 Requête Réponse Démon Web CGICGI Process 1 Scripts CGI Process 2 Serveur Web

46 46 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB FastCGI: solution au CGI Script persistant (démon) Script décomposé en 3 parties: –Initialisation: une seule fois –Code du script exécuté à chaque requête –Terminaison: une seule fois Initialisation doit inclure le code «coûteux» (ex: connexion à une BD)

47 47 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Interfacer le Web et les BD Script CGI –C et PL/SQL, C et Pro*C, Perl et DBI, … Java et JDBC Solutions Microsoft: –IIS et IDC –ASP et ADO Autres: –SQL~Surfer de –Lenvironnement Oracle Web Server

48 48 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Limites du Web Performances –Le réseau Internet => Augmenter les débits –Script CGI et FastCGI sont remplacés par de nouvelles technologies: PHP, ASP, Applets, Servlets, JSP Sécurité –S-HTTP (Secure-HTTP) du NCSA offre une version sécurisée dHTTP –SSL (Secure Socket Layer) proposé par Netscape pour sécuriser les applications au dessus de TCP/IP

49 49 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Limites du Web (2) Gestion des transactions –Pas possible avec HTTP 0.9 et 1.0 Pas de session Une solution est dutiliser les cookies –HTTP 1.1 Intègre la notion de connexion persistante (au niveau TCP) Interfaces utilisateurs –Limitation du HTML et des formulaires –Solution: Java

50 50 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Exemple de CGI Affiche les variables denvironnement #!/bin/bash # Affiche les variables denvironnement # #En-tête HTTP echo Content-type: text/html echo #Corps HTTP echo " " echo " Variables CGI " echo " " # #La commande set affiche les variables denvironnement # set # #Fermeture des balises ouvertes echo " "

51 51 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Exercices Conception dune page HTML statique –Codez une page HTML simple et affichez là dans votre navigateur –Modifiez votre page et ajouter y un formulaire Connexion au serveur Apache –Utilisez telnet pour vous connecter au serveur Apache du TP –Consultez le fichier de configuration /etc/apache/httpd.conf Téléchargement de votre page dans le serveur Apache –Utilisez le protocole FTP pour télécharger votre page dans votre compte –Connectez-vous en telnet et créez dans votre compte un répertoire public_html, déplacez votre page dans ce répertoire (éventuellement modifier les droits daccès) –Testez laccessibilité de votre page à lURL: /~gX/ où X correspond à votre numéro de groupe /~gX/

52 52 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Exercices (2) Conception dun CGI –Dans votre compte, créez le répertoire ~/public_html/cgi-bin –Ecrivez et téléchargez le CGI vu en cours par ftp –Modifiez les droits daccès au CGI (chmod 755) –Testez votre CGI à lURL /~gX/cgi- bin/ /~gX/cgi- bin/

53 53 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Bibliographie Ouvrages –Texte, Hypertexte, Hypermédia, Roger Laufer et Domenico Scavetta, Collection "Que sais-je" No 2629, ed, Presse Universitaires de France

54 54 / / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB Questions ? ? ? ? ? ? ?


Télécharger ppt "1 / 54 10 / 01 / 2003 Laurent GRANIE & Franck LEGENDRE – MIAGE 3ème année - ARCHITECTURE WEB ARCHITECTURE WEB – COURS I"

Présentations similaires


Annonces Google