Introduction Guillaume Piolle (+ Nicolas Prigent)guillaume.piolle.fr/doc/devweb-intro.pdf · Une br eve histoire du Web Clients et serveurs TCP/IP, DNS, URLs Le protocole HTTP HTML

Une brève histoire du Web Clients et serveurs TCP/IP, DNS, URLs Le protocole HTTP HTML et CSS Extensions du web

Développement webIntroduction

Guillaume Piolle (+ Nicolas Prigent)

CentraleSupélec – mineure Développement web

4 janvier 2017

GP Dev web : introduction 1 / 71


Une brève histoire du Web

1 Une brève histoire du WebPrésentationLes premières années du web

2 Clients et serveurs

3 TCP/IP, DNS, URLs

4 Le protocole HTTP

5 HTML et CSS

6 Extensions du web



Présentation

Présentation

World Wide Web : une des applications d’Internet, la plus connue maispas la plus ancienne.

À l’origine : technologie pour la publication de documents hypertextes(notion de liens entre documents).

Standards techniques régis par le World Wide Web Consortium (W3C,http://www.w3.org/).

Technologies de base : URL (adressage des pages), HTTP(communication), HTML (mise en forme).


http://www.w3.org/


Les premières années du web


1989 : Tim Berners-Lee débute un projet « hypertexte » au CERN.

Objectif : partage de docu-ments en interne (intranet).

Draft original : InformationManagement : A Proposal.

En parallèle, le CERN basculeen TCP/IP et est connecté àInternet.





La station NeXT de Tim Berners-Lee,premier serveur web du monde.





1990 : Robert Cailliau rejoint le projet, naissance du terme“WorldWideWeb”, première page web en ligne, navigateur basique.





1991 : Le projet est rendu public.

1992 : Création du serveur NCSA HTTPd (ancêtre d’Apache) et dunavigateur ViolaWWW (fondé sur HyperCard).





1993 : Création des navigateurs NCSA Mosaic et Lynx, apparitiondans les médias grand public. Premières images en ligne.





1994 : Fondation de Yahoo ! et Netscape, Mosaic devient Navigator.Premières publicités en ligne.

1995 : Échec de The Microsoft Network, création d’Internet Exploreret Apache. Moteur de recherche Altavista.

. . .





Microsoft Internet Explorer 1.0





La première version du site web d’AltaVista



Clients et serveurs

1 Une brève histoire du Web


3 TCP/IP, DNS, URLs

4 Le protocole HTTP

5 HTML et CSS

6 Extensions du web



Modèle client-serveur

Client

Navigateur (browser) sur le poste utilisateur, demande une page puisl’affiche. Exemples de navigateurs :Firefox, Internet Explorer, Chrome, Konqueror, Safari, Opera, Lynx. . .

Client léger : navigateur standard (universel) ;

Client lourd : plugin ou logiciel à installer (Java Web Start, NoTouch Deployment .NET. . . ).

Serveur

Logiciel sur la machine hébergeant les pages. Le serveur reçoit la requête,récupère la page et l’envoie au client.Exemples de serveurs web : Apache HTTP server, MS InternetInformation Services (IIS), Nginx, Google GWS. . .



Principes : lecture d’une page web



TCP/IP, DNS, URLs



3 TCP/IP, DNS, URLs

4 Le protocole HTTP

5 HTML et CSS

6 Extensions du web



TCP/IP, communications en mode connecté

Une connexion par page (HTTP ≤ 1.0, 1991-1996)Plutôt que de gérer la perte de paquets ou la remise en ordre au niveauapplicatif, le web utilise TCP/IP :

Le client ouvre une connexion TCP sur le serveur et fait sa requête.

Le serveur répond et ferme la connexion.

Connexions persistantes (HTTP 1.1, 1997)

Avec l’évolution des pages web (chaque page web est a priori composéede plusieur fichiers), ouvrir une connexion par fichier nuit auxperformances. Ainsi, la même connexion sert pour plusieurs requêtes :

Le client ouvre une connexion TCP sur le serveur et fait sa requête.

Le serveur répond et attend la requête suivante.



DNS et localisation des serveurs

DNS (Domain Name System) est un service distribué permettant(notamment) de convertir les noms des serveurs en adresses IP.

$ nslookup www.centralesupelec.frServer : 212.27.40.240Address : 212.27.40.240#53

Non-authoritative answer :Name : www.centralesupelec.frAddress : 138.195.9.117

Une adresse IP ne correspond pas forcément à un seul Fully QualifiedDomain Name, et un FQDN ne correspond pas forcément à une seule IP.



Organisation des serveurs DNS



Résolution DNSExemple : résolution de fr.wikipedia.org



URLs

Uniform Resource Locator, RFC 2396

(urn:ietf:rfc:2396)

protocole:// adresse [:port] [/ chemin] [/ fichier]

http://www.centralesupelec.fr/

ftp://ftp.inria.fr/pub/Apache/tomcat/

mailto:[email protected]

file:/var/log/messages

news:comp.ai.alife

À l’origine uniquement ASCII, UTF-8 accepté depuis 2010.URI = Universal Resource Identifier (Locator ou Name)


http://www.centralesupelec.fr/ftp://ftp.inria.fr/pub/Apache/tomcat/mailto:[email protected]:/var/log/messagesnews:comp.ai.alife


Le protocole HTTP



3 TCP/IP, DNS, URLs

4 Le protocole HTTPPrésentation de HTTPHTTP/2Cookies HTTPAuthentification HTTPWebDAV

5 HTML et CSS

6 Extensions du webGP Dev web : introduction 22 / 71


Présentation de HTTP


HyperText Transfer Protocol, RFC 2616 (v1.1)Protocole de niveau application (couche 5) entre le client et le serveur,orienté vers le transfert de documents.

S’appuie sur une connexion TCP (par défaut sur le port 80) entre leclient et le serveur (suite à une résolution DNS à partir de l’URL)

Communication en ASCII : Commande ou statut + en-tête (options) +contenu éventuel (possiblement dans un autre encodage)

Principales commandes HTTP

GET : Demande d’une page ;

HEAD : Demande des en-têtes de la réponse ;

POST : Lancement d’une exécution.





Statuts de réponse

1xx : Information (102 Processing) ;

2xx : Succès (200 OK) ;

3xx : Redirection (301 Moved Permanently) ;

4xx : Erreur client (404 Not Found) ;

5xx : Erreur serveur (500 Internal Server Error).

Paramètres d’en-tête

Requête : Type de réponse acceptée, page si modifiée depuis,informations sur le logiciel client (User Agent). . .

Réponse : Longueur de la réponse, code MIME, demanded’authentification, adresse de redirection, interdiction de mise encache. . .





Requête HTTP typique : (historiquement) plutôt bavard. . .

GET / HTTP/1.1

Host: www.supelec.fr

User-Agent: Mozilla/5.0 (Ubuntu; X11; Linux i686; rv:8.0)

Gecko/20100101 Firefox/8.0

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8

Accept-Language: fr-fr,fr;q=0.8,en-gb;q=0.7,en;q=0.5,es-es;q=0.3,es;q=0.2

Accept-Encoding: gzip, deflate

Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7

Connection: keep-alive

Attention :

Inutile d’utiliser des moyens techniques raffinés pour masquer votreadresse IP si votre navigateur fournit un quasi-identifiant !





Évolutions entre 2011 et 2016 sur la même requête de Firefox

GET / HTTP/1.1

Host: www.centralesupelec.fr

User-Agent: Mozilla/5.0 (X11; Linux x86_64; rv:45.0)

Gecko/20100101 Firefox/45.0

Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8

Accept-Language: en-Us,en;q=0.5

Accept-Encoding: gzip, deflate

DNT: 1

Connection: keep-alive

Attention :

Inutile d’utiliser des moyens techniques raffinés pour masquer votreadresse IP si votre navigateur fournit un quasi-identifiant !





Réponse HTTP

HTTP/1.1 200 OK

Date: Fri, 02 Dec 2011 08:42:09 GMT

Server: Apache

Set-Cookie: PHPSESSID=278949bad4adf439e6bc57707fc6bb4b; path=/

Expires: Thu, 19 Nov 1981 08:52:00 GMT

Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0

Pragma: no-cache

Vary: Accept-Encoding,User-Agent

Transfer-Encoding: chunked

Content-Type: text/html; charset=ISO-8859-1

910




Demande de page si modifiée

Permet l’utilisation d’un cache local. Cf. les balises meta de HTML pourinterdire ou restreindre le cache local :

GET / HTTP/1.1

Host: www.iana.org

If-Modified-Since: Thu, 01 Dec 2011 00:00:00 GMT

HTTP/1.1 304 Not Modified

Server: Apache/2.2.3 (CentOS)

Last-Modified: Fri, 14 Oct 2011 19:04:19 GMT

Vary: Accept-Encoding

Content-Type: text/html; charset=UTF-8

Accept-Ranges: bytes

Connection: Keep-Alive

Date: Fri, 02 Dec 2011 09:26:45 GMT

Age: 1023

X-Cntnt-Length: 4949



HTTP/2

HTTP/2

Spécification publiée en mai 2015 (RFC 7540).Rétrocompatible avec HTTP/1.1.

Évolutions par rapport à HTTP/1.1

Minifying : regroupement de ressources multipes (code HTML,scripts, images. . . ) en un lot unique (par page, par exemple) ;

Server push : le serveur peut envoyer plusieurs réponses pour unemême requête, en anticipant les besoins du client ;

Multiplexage de requêtes/réponses, compression des en-têtes,priorisation des requêtes. . .

Support par les navigateurs principaux (HTTPS uniquement !) et par denombreux serveurs. W3Techs décembre 2016 : 10.8 % du top 10M dessites web supportent HTTP/2.



Cookies HTTP

Cookies HTTP

Un protocole stateless

Du point de vue de HTTP, le serveur n’a aucune mémoire, il ne conservepas d’état pouvant le relier au client ou aux requêtes déjà réalisées.

En théorie (hors applis côté serveur), deux requêtes identiques donnentlieu à des réponses identiques.

Cookies

Les cookies sont des informations textuelles ajoutées dans les en-têtesdes requêtes/réponses HTTP afin d’introduire une différentiation, demanière à simuler des états.Ils sont rattachés à un domaine et peuvent avoir une date d’expirationou une durée de vie.



Cookies HTTP

Cookies HTTP

Contenu des cookies

La taille des cookies est limitée (4 kio max). Ils contiennent en général :

Soit des informations textuelles très brèves ;

Soit un identifiant correspondant à des données stockées sur leserveur.

Utilisation des cookies

Personnalisation : Mémorisation de préférences d’affichage, delangues, de contenus. . .

Gestion de sessions : Mémorisation de l’authentification, d’unpanier. . .

Suivi (tracking) : Mémorisation d’historiques de visites, de clics,d’achats. . .



Cookies HTTP

Cookies HTTP

Familles de cookies

Cookies de session : volatiles ;

Cookies persistants ;

Cookies « sécurisés » : via HTTPS ;HttpOnly cookies : inaccessibles à JavaScript ou à tout ce qui n’estpas HTTP ;

Cookies tiers : principalement pour du tracking publicitaire ;

Supercookies : cookies (a priori malveillants) correspondant à desdomaines top-level ;

Cookies zombies : reconstitués automatiquement après suppressionpar l’utilisateur (via utilisation du cache Flash, du localStorage deHTML5. . . ).



Cookies HTTP

Cookies HTTP

Vol de cookie et/ou de session

Un cookie identifiant une session authentifiée peut éventuellement êtrevolé et rejoué, permettant à l’attaquant de bénéficier des autorisationsde la victime.Les cookies peuvent être obtenus :

Par eavesdropping d’une connexion insuffisamment protégée(contremesures : HTTPS, WPA2, VPN. . . ) ;

Par détournement du traffic HTTP suite à un DNS cache poisoning(contremesures : Secure cookies, « sécurisation » des serveurs DNS) ;Transmission de cookies à un site tiers par Cross-Site Scripting,éventuellement via un proxy malveillant (contre-mesures : HttpOnlycookies, Secure cookies) ;

Utilisation du cookie sans récupération, par Cross-Site RequestForgery (contremesures : « sécurisation » du site visé par le CSRF).



Authentification HTTP


Demandée par un paramétrage du serveur pour l’accès à un répertoire.

GET → 401 → GET avec authentificationDemande de page protégée :

GET...

Refus du serveur :

HTTP/0.1 401 unauthorized

WWW-Authenticate: Basic realm="toto"

Le navigateur réclame un nom et un mot de passe pour le realm « toto »puis renvoie la demande avec nom:mdp encodé en Base64 :

GET...

Authorization: Basic Qwxpl3js





Amélioration de l’authentification Basic

Mode Digest : challenge MD5 impliquant login, mot de passe,realm, URI et un nonce.

SPNEGO : Extension de HTTP, protocole de négotiation de laméthode d’authentification. Le résultat peut par exemple être NTLMou Kerberos. Introduit par Microsoft (IE5), rapidement mis en œuvredans les navigateurs courants.





Authentification dans un tunnel chiffré

Couche SSL/TLS sur TCP/IPCorrespond aux urls https://...Suppose un module SSL/TLS et un paramétrage du serveur (liste d’algosacceptés, gestion de certificats cryptographiques)

Scénario

→ Le client se connecte au serveur et propose une liste d’algos ;← Le serveur choisit un algo et envoie un certificat X509 (clé publiquesignée par une autorité) ;→ Optionnellement : idem par le client ;→ Le client fournit une clé de session chiffrée avec la clé publique duserveur ;Les échanges suivants sont chiffrés avec cette clé.


https://...


WebDAV

WebDAV

Web-based Distributed Authoring and Versioning

Principe : passer par HTTP pour pousser des ressources en ligne, lesmodifier, les organiser, de manière collaborative.

Retour à la vision de Tim Berners-Lee (le web est à la fois en lecture eten écriture, cf. fonctionnalités du navigateur WorldWideWeb).

Création d’un groupe de travail IETF à la fin des années 90 (RFC 2518en 1999, RFC 4918 en 2007).Finalement, la gestion de version est laissée pour un autre projet(Delta-V, RFC 3253, interface avec SVN notamment).

Parmi les extensions de WebDAV : CalDAV, basé sur iCalendar.



WebDAV

WebDAV

Commandes HTTP exploitées

PUT : Création ou remplacement d’une ressource ;

DELETE : Suppression d’une ressource.

Extensions à HTTP :

PROPFIND, PROPPATCH : gestion de propriétés XML et de lastructure des données ;

MKCOL : création de collections (répertoires) ;

COPY, MOVE : copie/déplacement d’une URI à une autre ;

LOCK, UNLOCK : Gestion de verrous exclusifs ou partagés.



HTML et CSS



3 TCP/IP, DNS, URLs

4 Le protocole HTTP

5 HTML et CSS

6 Extensions du web



HTML (HyperText Markup Language)

Langage de description de documents, à balises (CERN 1991, standardW3C)

Restriction de SGML (Standard Generalized Markup Language, ISO)

Censé définir la structure plutôt que la mise en page, mais. . .

Succession rapide des premières versions : problèmes decompatibilité, extensions propriétaires. . .

HTML5 est en cours de finalisation mais déjà largement répandu.Il propose notamment la gestion native de contenus multimédia, du SVG,du MathML, plus de balises sémantiques, des champs de formulaires plusspécifiques, et une syntaxe simplifiée.



Exemple de page HTML5

en globalit é . Son contenu ne s’ affiche pas dans lapage en tant que tel −−>

Example HTML5, titre affiché dans la barre .

sans la page −−>Exemple HTML5, titre affiché dans la Ãafentre

Les balises p et /p permettent de dé limiter les

paragraphes.

Il est possible mettre des

liens vers d’autres pages.



Réalisation de pages HTML

Édition

Mode texte pur, à la main

Via des outils WYSIWYG : Expression (FrontPage), GoLive,DreamWeaver, Nvu, Mozilla Composer, Word, OpenOffice. . .

Navigateurs très tolérants : absence de DOCTYPE, de guillemets, debalises fermantes, de balises html ou body. . .

Validateur en ligne du W3C : http://validator.w3.org/


http://validator.w3.org/


CSS (Cascading Style Sheets)

Langage de mise en forme de documents, associé à HTMLDans un en-tête (balises , un fichier séparé (lié dans l’en-tête par) ou à l’intérieurd’autres balises (option STYLE).

Ensemble de règles contrôlant la fonte, la couleur, la taille, la position, lesimages de fond... S’appliquent :

À un type de balise donné (,

. . . , , ) ;

À une classe ou un identificateur spécifié dans une balise ;

À une imbrication de balises donnée ;

Aux pseudo-classes :link, :visited, :active, :hover.



Exemple de CSSLe CSS suivant fait que la page précédente s’affiche ainsi

−−>



Extensions du web



3 TCP/IP, DNS, URLs

4 Le protocole HTTP

5 HTML et CSS

6 Extensions du webApplicatifs côté serveurApplicatifs côté clientXML et Web Services



Architectures trois-tiers

c©The Silicon Whisperer



Où placer les traitements ?

Des combinaisons sont possibles. . .



Applicatifs côté serveur

Formulaires HTML

Principale source d’interaction avec l’utilisateur : alimentation du serveuren données.

Parametre 1 Parametre 2

Parametre 3

QuelconqueAB

Chk1

Validation (GET ou POST) → traitement côté serveur et affichaged’une nouvelle page (contenu dynamique).




CGI

Common Gateway InterfaceStandard pour lancer un exécutable sur une requête du client, et renvoyerla sortie de l’exécutable au lieu du contenu d’un fichier.Spécifie comment passer les paramètres à l’exécutable.

Indépendant du langage.Langages couramment utilisés : Perl, C, langages de shell, Python. . .

Problème : un processus par requête

→ Lenteur et charge mémoire, stateless.

Méthodes pour déporter la gestion des sessions vers le client (paramètresde requête, champs cachés de formulaires, cookies).Tend à être remplacé par des modules (cas typique de PHP) ou desenvironnements serveur spécifiques (pour Java par exemple).




CGI

#!/bin/kshecho "Content-Type: text/html"echoecho ’Resultat testbvsh’echo ’Resultat script’#−−−−−−−−−−−−−−−−−−−eval ‘/usr/local/bin/www/cgiparse -form‘#−−−−−−−−−−−−−−−−−−−echo "Parametre 1 : $FORM_P1
"...

# var. d’environnement : big brother is watching youecho "Votre adr. IP : $REMOTE_ADDR
"echo "Votre navigateur : $HTTP_USER_AGENT
"echo "La page d’où vous venez : $HTTP_REFERER
"




PHP

Personal Home Page → PHP : Hypertext Preprocessor

À l’origine, bibliothèques PERL pour créer et maintenir une page persodynamique.Aujourd’hui, langage indépendant, orienté objet depuis la version 5.Collection de bibliothèques logicielles très vasteInterprété en local (langage de scripts), par un module Apache ou IIS,un script CGI (legacy) ou FastCGI.

Architecture classique : LAMP (Linux-Apache-MySQL-PHP)Variantes : WAMP/MAMP.Environnements WAMP tout-en-un : Xampp, EasyPHP. . .

À suivre : cours/BE dédié à PHP




Technologies Java EE

Architecture de serveurs d’applications MVC (Modèle - Vue - Contrôleur) fondée surJava, proposant divers types de composants logiciels.

Servlets

Objets Java côté serveur, traitent une requête HTTP et construisent la réponsecorrespondante, en bénéficiant de toute l’expressivité de Java.

JSP (Java Server Pages) et JSF (Java Server Faces)

Composants de présentation servant de squelette à des pages web, pouvant inclure desappels à des méthodes Java sous forme de balises.

EJB (Enterprise Java Beans)

Objets spécifiques à Java EE. Encapsulent des traitements métier spécifiques, ouconstituent le modèle de l’application (gèrent persistance et publication des données).

À suivre : deux séances de cours/BE sur Java EE




Autres technologies

ASP

Technologie Microsoft comparable à PHP.Propriétaire → pas de contribs de la communauté → braindead.A très largement évolué pour devenir ASP.NET, intégré dans leframework de développement web de Microsoft.

Python / Zope

Python : langage de script orienté objet, adapté au web et au réseau,nombreuses bibliothèque.Zope : serveur d’application Python (avec BD objet) proposant destechnologies similaires à PHP, aux Servlets/JSP, EJB. . .

Ruby on Rails

Langage (Ruby) et plate-forme (Rails) de développement rapide pour leweb.MVC, priorité au confort du développeur, de plus en plus à la mode.

+ environ deux milliards d’autres technos, côté serveur comme côtéclient.



Applicatifs côté client

JavaScript

Inspiré de la syntaxe Java, mais très différent toutefois !Langage interprété par le navigateur, intégré à HTML ou dans un fichierséparé.

Entre balises ...

Essai JavaScript

function square (number) { return number∗number }

Blabladocument.write ("sqr(5)=", square(5))Blabla




JavaScript

Dans un fichier séparé

Comme paramètre de balise

Expression entre &{ et }

Comme handler d’événement

Autres événements : onMouseOver, onChange, onSubmit, onLoad. . .




JavaScript et DOM

DOM : Document Object ModelLe document est traduit sous la forme d’un arbre, accès direct auxcomposantes.

Exemple : Accès à la valeur d’un champ de formulaire

Voir la bibliothèque JQuery pour l’accès au DOM.




JavaScript : structure du langage à objets

Langage orienté prototype : pas de classes, que des instances ;

Constructeur = simple fonction ;

Attributs créés par la première affectation ;

Fonctions utilisables comme des méthodes.

function voiture (modèle, propio) {this .modèle = modèlethis . proprio = propriothis . affiche = affiche

}function affiche () {

document.write ( this .modèle+" de "+this.proprio)}...

v = new voiture ("Safrane", "toto")v. affiche ()




Applets Java

Code mobile, portable, sûr

Balise HTML pour le chargement d’une applet ;

Pas d’installation (mais nécessité d’une JVM) ;

Sécurité :

Code vérifié par la JVM ;Exécution par défaut dans un « bac à sable » (pas d’accès auxfichiers, sockets uniquement avec le serveur source) ;Élargissement paramétrable par politique de sécurité (voir les outilspolicytool, keytool, jarsigner).

Toute la puissance de Java (classe JApplet) : graphisme, sockets, RMI,Corba, JDBC, Web Services. . .

Une technologie à déconseiller ?

De nombreuses JVM pour navigateurs sont (très) vulnérables, il estdéconseillé de tout bonnement désactiver Java dans un navigateur web.




Applets Java

Exemple d’inclusion

...

Votre browser ne supporte pas Java

...

Paramètre BASE="url" si le .class n’est pas dans le même répertoireParamètre ARCHIVE="applet.jar" si le .class est dans un .jar




Flash

Langage et technologie propriétaires (Adobe)

Points comparables avec les applets Java :

Code pré-compilé, mobile ;

Exécuté dans une machine virtuelle dédiée (plugin) ;

Code censé être portable.

Différences avec les applets :

Graphismes principalement vectoriels ;

Sécurité moins expressive, très peu personnalisable ;

Propriétaire, portabilité limitée par Adobe (dernière version rarementdispo sous Linux ou Mac, rien pour Linux 64) ;

Encore utilisé dans certains domaines, assez incompatible avec lesprincipes d’interopérabilité du Web, en train d’être tué et remplacé parHTML5. Problèmes de sécurité importants.



XML et Web Services

XML

eXtensible Markup LanguageLangage de structuration de données (W3C), sous-ensemble de SGML.

Balises définies suivant le besoin et la sémantique (6= HTML).Standard et extensible.

Culture petits poisGaston LagaffeSpirou



XML et Web Services

XML

Applications

OpenDocument ;

RSS/Atom ;

Pages web en XML+CSS ou XML+ XSLT ;

Format de manifests pour déploiement/compilation ;

Format pivot et d’interconnexion, paramétrage d’applications ;

Description de formulaires ou autres (XForms/W3C,InfoPath/Microsoft, XUL/Mozilla) ;

Invocation distante : XML/RPC, SOAP (Web Services) ;

. . .



XML et Web Services

DTDs et Schémas XML

Deux manières de spécifier les balises et leur organisation, de définir unformat.

DTD (Document Type Definition)

Définit des noms de balises, de propriétés et leurs imbrications.Pas du XML.Pas de précisions sur le domaine des données, peu expressif.

Schémas XML

Un schéma est un document XML.Précise le type des données.Notion de namespace pour éviter les collisions ().



XML et Web Services

Analyse XML

SAX

Simple API for XML.Simple. . . pour des tâches pas compliquées !Récupération de quelques infos, par appel de callbacks à l’analyse.

DOM

Document Object ModelPratique pour tout récupérer.Transformation du document en un objet arborescent.Parcours et recherche pratiques.

Vérificateurs : XML bien formé, XML valide (par rapport à une DTD ouun schéma).Ex : xmllint.



XML et Web Services

Transformation XML

Principe : Le XML décrit la structure du document, XSLT décritl’affichage par génération de HTML (côté client ou serveur).XSLT : eXtensible Stylesheet Language Transformation(JAXP pour Java, xsltproc, Cocoon sous Apache, Sablotron en PHP. . . )

< xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

Bibliographie

XSLT et ses implémentations peuvent être une source de vulnérabilitéssignificative.



XML et Web Services

Web Services

SOAP (W3C)

Simple Object Access Protocol Requête en HTTP + XML (schémaSOAP particulier).Invocation distante d’un service, réponse encodée en HTTP + XML.

WSDL (W3C)

Web Services Description Language.Langage XML décrivant l’interface d’un service Web interrogeable parSOAP : messages, ports, codage.

UDDI (W3C)

Universal Description Discovery and Integration.Annuaire sur les fournisseurs, les services, lien avec WSDL.Conçu comme un service commercial, très peu utilisé finalement.



XML et Web Services

Web Services

Concrètement :

Un web service = une classe Java, C# ou autre+ un fichier .wsdl

Services REST

Representational State TransferPas de SOAP : simplement du HTTP (GET, POST, PUT, DELETE) et desURI (style formulaires).Stateless : le client doit mémoriser l’état.



XML et Web Services

AJAX

Asynchronous JavaScript and XML (→ « Web 2.0 »)Technologie : Javascript, objet XMLHttpRequest, DOM + exécution (etBD) côté serveur.



XML et Web Services

Autoformation

http://www.developpez.com/

http://www.developpez.net/forums/

Couvre énormément de technologies, nombreux cours et tutoriel (souventde bonne qualité), forum très actif, modéré et orienté professionnels.


http://www.developpez.com/http://www.developpez.net/forums/


XML et Web Services

Plan de la mineure

04/01 : Introduction, serveurs web ;

11/01 : Rien ? PHP ?

18/01 : Exécution côté client [NP] ;

25/01 : Rien ? PHP ?

01/02 : Java EE 1/2 ?

15/02 : Java EE 2/2 ?

22/02 : Sécurité des applis web ;

01/03 : Rien ? BE ?

08/03 : Rien ? Soutenance BE ?

Évaluation : BE notés (Java EE + quelque chose en PHP/JS/MySQL).



XML et Web Services

Iconographie et autres sources

Tim Berners-Lee (p. 4) : Captsolo/Flickr (http://www.flickr.com/photos/captsolo/64564258/), CC-BY-SA 2.0, 2005 ;

First Web Server (p. 5) : Coolcaesar (http://commons.wikimedia.org/wiki/File:First_Web_Server.jpg), GFDL/CC-BY-SA3.0, 2005.

Robert Cailliau (p. 6) : CERN, publié sous copyleft(http://commons.wikimedia.org/wiki/File:Robert_Cailliau_On_Desk.jpg).

ViolaWWW (p. 7) : University of Berkeley, 1992.

NCSA MosaicTM “Spinning Globe” logo (p. 8) et NCSA MosaicTM 0.6 beta screenshot (p. 9) : National Center forSupercomputing applications, University of Illinois (http ://www.ncsa.illinois.edu/News/Images/), 1993.

Logo Yahoo ! (p. 10) : Yahoo ! (http ://www.yahoo.com), 1994.

Logo Netscape (p. 10) : AOL/Netscape (récupéré sur http ://mozilla.tlk.fr/faq5.php), 1994.

Microsoft Internet Explorer 1.0 (p. 10) : Microsoft (http ://windows.microsoft.com/en-US/internet-explorer/products/history),1995.

Logo Apache (p. 10) : Apache Software Foundation (http ://www.apache.org/), 2011.

Microsoft Internet Explorer 1.0 screenshot (p. 11) : Microsoft(http ://windows.microsoft.com/en-US/internet-explorer/products/history), 1995.

Page d’accueil Altavista (p. 12) : Altavista (récupéré sur http ://www.webdesignshock.com/web-design-history), 1995.

Illustration résolution DNS, (p. 20), DNS iterations.svg, créé par Mro, récupéré surhttp://fr.wikipedia.org/wiki/Fichier:DNS_iterations.svg, licence CC-BY-SA 3.0, 2010.

Bernard Vivinis, Client-Serveur (transparents Supélec), 08/01/2010.


http://www.flickr.com/photos/captsolo/64564258/http://commons.wikimedia.org/wiki/File:First_Web_Server.jpghttp://commons.wikimedia.org/wiki/File:Robert_Cailliau_On_Desk.jpghttp://fr.wikipedia.org/wiki/Fichier:DNS_iterations.svg

Une brève histoire du WebPrésentationLes premières années du web

Clients et serveursTCP/IP, DNS, URLsLe protocole HTTPPrésentation de HTTPHTTP/2Cookies HTTPAuthentification HTTPWebDAV

HTML et CSSExtensions du webApplicatifs côté serveurApplicatifs côté clientXML et Web Services

Documents

Introduction Guillaume Piolle (+ Nicolas Prigent)guillaume.piolle.fr/doc/devweb-intro.pdf · Une br eve histoire du Web Clients et serveurs TCP/IP, DNS, URLs Le protocole HTTP HTML