Technologies& Architectures Internet/Intranet

• • Amadou SEYE• Prytanée Militaire de Saint-Louis• Amicale des professeurs du Prytanée

Bibliographie• Internet/Intranet et bases de données, G. Gardarin,• Eyrolles, 1999.• XML : des bases de données aux services web, G.• Gardarin, Dunod, 2002.• Technologies et Architectures Internet, P.Y. Cloux,• D. Doussot, A. Géron, Dunod, 2003.• PHP4 & MySQL, G. A. Leirer, R. Stoll, Micro• Application, 2000.• Votre première base de données avec MySQL, J.• Engels, OEM, 2002.

Webo-graphie

• Site du W3C : www.w3c.org• Site de PHP : www.php.net• Site de Microsoft : www.microsoft.fr• Site de Apache : www.apache.org• Site de Netscape : www.netscape.fr• Site de Tecfa : tecfa.unige.ch

Technologies& Architectures Internet/Intranet

1. Concepts de base2. Architectures 3/3 Web

Concepts de base

• • Définitions• • Architecture C/S• • HTTP• • HTML• • Serveur Web• • Client Web

Internet• Ensemble de réseaux interconnectés via TCP/IP• Historique• • début des années 60 (guerre froide)• • Réseau décentralisé et maillé de la défense américaine• capable de survivre en cas d’attaque nucléaire.• • Utilisation confiée aux scientifiques.• • 1980 : protocole de communication unifié (TCP/IP).• • Permet de réaliser des transferts de fichiers via FTP,• d’échanger des messages via SMTP, et de rendre• disponibles des infos de façon très sommaire.

Le protocole TCP/IP• • Transport Control Protocol / Internet Protocol• • Protocole de communication unifié disponible sur• tous les types de réseau physique (Ethernet, ATM,• etc.) et tous les systèmes d’exploitation.• • Assure la transmission de données découpées en• paquets indépendants.• • Réseau ouvert à tout utilisateur ayant obtenu une• adresse auprès d’un organisme accrédité.• • Gestion décentralisée en réseaux interconnectés : pas de

gouvernement central.

Les couches de TCP/IP

APPLICATIONHTTP, FTP,SMTP, Telnet, etc

TRANSPORTTCP

RESEAUIP

LIAISONTRAMES RESEAU

PHYSIQUE SUPPORT PHYSIQUE

Le Web• • Inventé en 1989 par Tim Berners Lee (avant• l’ouverture d’Internet aux entreprises et au grand public)• • T. B. Lee : Web = moyen simple et efficace pour• permettre la consultation de documents scientifiques• partagés sur un réseau en :• Tirant profit de la capacité graphique des ordinateurs.• Tenant compte de l’hétérogénéité du support de• l’information.• • Invention de HTTP et de HTML, et plus tard de• Mosaic (1993)• Succès fulgurant du Web, échelle mondiale.

Le Web• • World Wide Web = WWW = Toile• • Ensemble de connections par liens hypertextes entre• des documents contenant des informations de types• variés : texte, hypertexte, images, films,etc.• • Format MIME (Multipurpose Internet Mail Extensions)• défini pour permettre l’échange de types de données• variés.• Standard qui définit les règles de codage pour le• transfert d’informations multimédia (HTML, PS,• JPEG, GIF, MPEG, VRML, code Java, etc.).

Architecture C/S

• réquete• -------------------------• Réseau TCP/IP Serveur web ------------------------ client Web• réponse

L’identifiant universel : URL

• Le système d’adressage utilisé pour invoquer les• ressources sur le réseau est basé sur les URL.• • Uniform Resource Locator : identifiant indiquant :• Protocole Internet utilisé (HTTP, FTP, FILE, etc.)• Adresse du serveur (+ port de communication

optionnel)• Chemin d’accès local de la ressource• Ex :

http://www.prytanee.sn:80/appms/Seminaire.htm

URI : Uniform Resource Identifier• Le concept d’URI est plus large que celui d’URL et regroupe• toutes les formes syntaxiques permettant de désigner une• ressource Internet.• • “Nom ou adresse générique permettat d’identifier une• ressource, composée d’une châine de caractères obéissant à• différentes formes syntaxiques, la plus courante étant :• <type_connexion>://<serveur>/<ressource>/…• Exemple : ftp://ftp.prytanee.sn/courshistoire.pdf

HTTP• • HyperText Transfert Protocol, version actuelle 1.1• • Protocole défini pour encapsuler les donénes• transitant entre le serveur et le client Web.• • Utilise MIME comme format de codage (données• échangées sont encapsulées dans ce format).• • Véhicule aussi des renseignements sur le client• (formats MIME supportés, système d’exploitation,• type de navigateur, etc.).• • Sans état : sans session, sans transaction.• le serveur peut supporter un très grand nbre de clients

L’Hypertexte : HTML

• • HyperText Markup Language, standard final : HTML 4• • Langage de description de documents hypertextes• (c-à-d liés par des associations de un vers un).• • Dérivé de SGML (Standard Generalized Markup• Language), un langage de description de documents• permettant de séparer l’information contenue dans• un document de sa présentation (apparence).• • HTML ne s’intéresse qu’au formatage du document• indépendamment de l’information qu’il contient.

L’Hypertexte : HTML• HTML décrit la présentation du contenu d’une page Web• • Les éléments à afficher sont encadrés par des balises• qui présentent leur mise en forme (taille des• caractères, alignement, etc.)• <b>pour afficher ceci en gras</b>• • Certaines balises contiennent des liens hypertextes• <a href=“/recrutement.htm”>Recrutement</a>• • Cretaines balises contiennent des références sur• d’autres objets (images par exemple)• <img src=“logopms.gif” align=“center”>…</img>

HTML, XML, XHTML

• XML (eXtensible Markup Language) est un• métalangage permettant de définir des

langages de marquage de documents.• • XHTML est une version de HTML définie à

partir de XML; constitue une version bien formée (du point de vue XML) de la syntaxe HTML.

Le serveur Web• Programme capable de traiter les requêtes HTTP• envoyées par les clients Web.• • Installé sur un serveur physique contenant des• fichiers HTML et accessible par les ordinateurs du• réseau via TCP/IP.• • Serveurs Web du marché :• Apache : robuste, fiable, gratuit, disponible sous• Windows et Linux (+ de 60% du marché);• Microsoft IIS : professionnel, simple à administrer (+ de• 25% du marché);• iPlanet Web Server : professionnel, multi-plateforme.

Le client Web

• Rôle : télécharger des fichiers HTML et afficher leur• contenu mis en forme grâce aux indications fournies• par les balises.• • Les navigateurs sont gratuits :• Netscape Navigator : successeur de Mosaic en 1994.• Internet Explorer : intégré dans Windows par

Microsoft• depuis la version 98.• Firefox

Technologies & Architectures Internet

• 1. Concepts de base• 2. Architectures 3/3 Web

Architectures 3/3 Web

• Du C/S classique au C/S Web• • Technologies dynamiques côté client• • Technologies dynamiques côté serveur• • Les pages actives serveur

Du C/S classique au C/S Web

• Influence de Internet :• Modèle du client léger universel• Déploiement de nouvelles applications basées

sur les technologies web• Accès aux applications existantes via Intranet

Architecture 3/3 Web• Tiers client: client léger et universel• – Vision du SI pour les utilisateurs finaux• – Application utilisable même dans un parc• hétérogène• – Browser Web• ● Tiers Web : serveur web (avec serveur d’applications)• – Implantation de la logique applicative (traitement• des requêtes émises par les clients)• ● Tiers ressource : serveur de données• – Dédié au stockage et à l’accès aux données (BD et• application existantes)

Technologies dynamiques côté client

• Limitations des pages HTML :• ● Client passif : l’utilisateur n’a aucune possibilité• d’intervention sur le contenu de son navigateur.• ● Trop peu d’interactivité.• Dynamiser le client Web au moyen de technologies :• Scripts client• Plug-in• ActiveX• Applets Java etc

Les scripts client• ● Programmes écrits en code source inclus dans un• document HTML et interprétés par un navigateur.• ● Idéal pour programmer des clients interactifs.• ● La balise SCRIPT permet au navigateur d’appeler• l’interpréteur du langage choisi• <script language=“JavaScript”>…</script>• ● Deux langages de script• JavaScript : langage de script universel, gratuit.• VBScript : sous ensemble de Visual Basic dont il reprend• la logique et la syntaxe.

JavaScript• Repose sur la programmation événementielle.• ● Des fonctions sont incluses dans la page HTML et• sont éxécutées :• à différents niveaux du cycle de vie de la page• en réponse à certaines actions de l’utilisateur• ● ECMAScript : standard proposé par Netscape pour• JavaScript et contrôlé par ECMA (European• Computer Manufacturer Association)• ● JScript : version JavaScript de Microsoft• ● Repose sur le modèle DOM (Document Object• Model) qui représente :• un modèle objet du navigateur• une organisation dynamique d’une page Web

JavaScript

• ● JavaScript repose sur le modèle DOM (Document• Object Model) qui représente :• un modèle objet du navigateur• une organisation dynamique d’une page Web• ● Lorsqu’il charge une page Web, le navigateur• construit le modèle correspondant.• ● Ce modèle est une hiérarchie d’objets réagissant à des• évènements et sur lesquelles des méthodes peuvent• être exécutées pour modifier l’affichage.

Les contrôles ActiveX

• Technologie Microsoft dérivée du modèle de• composant COM permettant d’inclure des objets• paramétrables et exécutables dans une page HTML.• ● Objets écrits dans un langage de programmation (ex :• Visual Basic) et éxécutés dans un environnement• Web (Internet Explorer).• ● Intégrés dans une page Web grâce à la balise OBJECT• ● Peuvent être manipulés par un langage de script• (VBScript)

Les applets Java

• Programme Java interactif, présent sur le serveur• Web, qui peut être téléchargé sur le client Web et• s'exécute dans une page Web.• • La balise APPLET permet au navigateur de• télécharger le bytecode Java depuis le serveur Web.• • Les applets Java permettent d'améliorer la• présentation des pages Web ou de remplir une• fonction spécifique.

Les plug-in• Composants logiciels s’exécutant côté client pour• interpréter des formats de données particuliers (autres• que HTML).• ● Téléchargés et installés automatiquement par le• navigateur lorsque leur usage est requis pour la 1ère• fois.• ● Problème : implémentation propriétaire (souvent écrits• en C), ne fonctionnent qu’avec un seul navigateur.• ● Plug-in les plus utilisés :• Acrobat Reader (documents pdf)• RealPlayer (musique, vidéo)• VRML (3D) (Vitual Reality Modeling Language)

DHTML (Dynamic HTML• Nom générique pour désigner trois technologies de• base utilisées pour développer des pages clients• dynamiques : HTML, CSS, JavaScript.• ● CSS (Cascading Style Sheets) : formes de feuilles de• style permettant de définir en une fois le style d’un• élément HTML particulier par un ensemble de• propriétés, puis de l’utiliser plusieurs fois sur toute• page ayant cet élément.• ● Utilisation des feuilles de style découpage des• pages Web en 2 parties : information (contenu) +• présentation (mise en forme)

Le WAP (Wireless Application Protocol)

• Standard d’accès à Internet pour les terminaux mobiles• (téléphones portables).• ● Le modèle actuel de Internet nécessite une puissance

de traitement et un débit réseau inacesible aux mobiles.• ● Le WAP se base sur 2 standards :• ● WML (Wireless Markup Language) : langage de• marquage proche de HTML• ● WMLScript : langage de script proche de JavaScript

Technologies dynamiques côté serveur

• La mise à jour des pages HTML statiques est difficile• et les fichiers les contenant manquent d’interactivité.• ● Il est impossible d’invoquer des applications ne• produisant pas du code HTML.• ● Technologies de programmation des serveurs Web• CGI (1992)• Scripting server• Fast CGI• Pages actives serveur

CGI (Common Gateway Interface)• ● Objectif : autoriser la publication d’informations• dynamiquement par la création de documents HTML• à la demande de l’utilisateur.• ● CGI est une technique de couplage des serveurs Web• aux programmes d’application.• ● CGI permet à des clients Web d’exécuter des• programmes d’application disponibles sur un serveur• Web et permet au serveur de produire dynamiquement• des documents HTML et de les renvoyer au client.• ● Une application CGI est un programme exécutable• pouvant être écrit dans n’importe quel langage (C,• Perl, Shell Unix…).