Normes avancées du Web
                         Sujets spéciaux en TI

                    Le Web 2.0 : concepts et outils...
Normes avancées du Web




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
Normes avancées du Web
 Ajax
 Same  Origin Policy (SOP)
 Services Web
 Architecture      SOA
 REST
 RSS  2.0
 Atom ...
Pourquoi des normes avancées?
 Pour implémenter les fonctionnalités du Web 2.0
 Améliorer l'expérience-utilisateur par des...
Ajax


             Ajax




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
Ajax – Une véritable percée!




                    AJAX
                                                            Le p...
Ajax – Une véritable percée!
  Ajax (Asynchronous JavaScript & XML)
  Fini le pénible rechargement de pages!
  Réalise des...
Ajax – Diagramme de collaboration
                                                                                        ...
Ajax – Diagramme de séquence

Avee le Web traditionnel qui est asynchrone, le
fureteur est gelé en attendant la réponse du...
Ajax - Avantages & inconvénients




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
Ajax - Avantages
   Réponses rapides aux actions de l'utilisateur
   Applications Web riches, rapides et légères
   Pas...
Client léger HTML vs client riche Ajax




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal ...
Client léger HTML vs client riche Ajax


                         Client HTML
                          (fureteur)
       ...
Ajax - Inconvénients


                    JS
                         Ajax




GTI-780 / MTI-780               ETS - Mont...
Ajax - Inconvénients
   Phénomène de mode
   Problèmes de compatibilité entre les différents fureteurs
   Ne fonctionne...
SOP : Same Origin Policy



             SOP




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Mon...
Contrainte de sécurité SOP
  Pour des raisons de sécurité, un script JavaScript* provenant d'une
  page donnée n'a accès q...
Contournement de la règle SOP
  Les applications Web centrées client bénéficieraient d'un accès élargi
  aux services hébe...
Services Web


             Services
             Web



GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   E...
Services Web
  Origine : protocole de communication entre objets distribués ORB
  (Object Request Broker) comme CORBA*, DC...
Services Web - approches
  Idée : marier HTTP et XML, 2 grandes approches
         RPC : appel de procédure à distance (Re...
Services Web - Avantages & inconvénients




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréa...
Services Web - avantages
  Interopérabilité entre différents composants logiciels écrits en
  différents langages de progr...
Services Web - Inconvénients
  Pas vraiment de normes établies
  Performaces plus faibles que les approches moins
  ouvert...
Architecture SOA


             SOA




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2...
Architecture SOA
   SOA (Service Oriented Architecture) Architecture orientée services

   Basée sur les services Web (WS)...
Architecture SOA
 L'annuaire des services référence tous les services

 Le bus a un rôle d'intermédiaire entre le producte...
SOA - Avantages & inconvénients




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
SOA - Inconvénients
  « Phénomène de mode »
  Tendance à la multiplication des couches et des messages
  Difficile à teste...
SOA - Avantages
  Couplage faible
  Favorise les échanges entre toutes sortes de logiciels, peu
  importe leurs langages d...
SOA & Web 2.0
  SOA et Web 2.0 ont beaucoup d'éléments en
  commun
  Vision commune d'un Internet des services
  Répondent...
REST


             REST




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
REST – La simplicité du Web
  On se connecte sur un serveur, on lui donne un chemin (URL/URI)
  vers un document et le ser...
REST
  REST (REpresentational State Transfer)*
  plus clairement appelé architecture orientée ressources ROA
  (Resource-O...
REST – API uniforme

  Obtenir une représentation d'une ressource : GET


  Créer une nouvelle ressource : PUT avec nouvel...
REST – Amazon S3 un service RESTful
  À part le Web lui-même, il existe d'autres véritables
  services Web REST
  Par exem...
REST – Comparaison avec RPC
  REST et RPC sont différents à plusieurs niveaux

                    REST                   ...
REST – Hybrides REST-RPC
  Il existe aussi des hydrides REST-RPC ou faux services
  REST
         Par exemple Flickr qui u...
REST – Qualités d'un service RESTful
  Adressabilité : une URI/URL pour chaque information utile
  Sans état (stateless) :...
REST – Quelques outils et ressources
 Projet JAX-RS (JSR-311)
 http://cwiki.apache.org/CXF20DOC/jax-rs-jsr-311.html
  Un o...
REST – Projet Restlet
  Projet Restlet – bonne bibliothèque REST avec une intégration à GWT
  http://www.restlet.org/about...
REST – Quelques outils et ressources
  Introduction to REST (article JavaLobby)
  http://java.dzone.com/articles/intro-res...
REST - Avantages & inconvénients




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
REST - Avantages
 REST est de plus en plus populaire
 Les grands sites Web 2.0 comme Amazon, Yahoo!, Flickr offrent des
 s...
REST - Inconvénients
 Pas vraiment conçu pour les transactions, bien que
cela soit possible
 Pas conçu pour les protocoles...
RSS


             RSS




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
RSS
 Fil, flux ou canal RSS: syndication de contenu
 Inventé chez Netscape en 1999 puis amélioré par Dave Winer
 RSS : Rea...
RSS 2.0
    Contenu entre les balises <rss>, métadonnées entre les balises <channel>, <title> : le
    titre de l'item , <...
RSS – baladodiffusion
La baladodiffusion (podcast) qui est la diffusion de contenu multimédia est basée sur les flux
RSS. ...
ROME
 ROME : Rss and atOM utilitiEs : une excellente bibliothèque Java en code
 source libre qui se base sur JDOM
 Support...
RSS - Avantages & inconvénients




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
RSS - Inconvénients
L'information étant rafraîchie régulièrement, l'usager peut
manquer une nouvelle importante
Généraleme...
RSS - Avantages
Usager : permet d'être informé d'un contenu sans aller le
consulter
Diffuseur: attirer des visiteurs, synd...
Atom



             Atom




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
Atom
Atom est un format de syndication créé en 2003 pour combiner la
simplicité de RSS 2.0 (i.e. non basé sur RDF) mais en...
Atom – Exemple de flux Atom
<?xml version="1.0" encoding="UTF-8"?>

<feed xmlns="http://purl.org/atom/ns#" xmlns:dc="http:...
Microformats


             µF




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
Microformats
 Approche de normalisation du format des données basée sur
 XML / XHTML et l'étiquetage sémantique (métadonné...
Microformats – Aspect technique
   Basés sur XML / XHTML et les métadonnées
   Utilisation des attributs : class, rel et r...
Microformats - Exemples
                                       HTML vCard


       Contacts ou personnes (hCard)          ...
Microformats - Avantages & inconvénients




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréa...
Microformats - Avantages
 Réutilisation facile des contenus sur le Web

 On peut même dire que RSS et ATOM s'apparentent a...
Microformats - Inconvénients
 Peu de vraies normes, beaucoup de variantes

 Difficiles de s'y retrouver

 Parfois fastidie...
XSL - XSLT



             XSL / XSLT




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal -...
XSL / XSLT
   Technologies d'extraction et de transformation des données

   XSL (eXtensible Stylesheet Language)

   XSLT...
XSL / XSLT – Petit exemple...
entreeD1.xml
<?xml version="1.0"?>

<doc>Bonjour XSLT</doc>



D1versD2.xsl
<?xml version="1...
XSL / XSLT – Un peu de code...
import javax.xml.transform.*;

// Utilisation de l'interface TraX pour réaliser une transfo...
XSL / XSLT - outils
 Du côté serveur : JAXP (Java API for XML Processing)
 Traitement du XML (validation, analyse, transfo...
JSON



             JSON




GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - Montréal - 2009
JSON
 JSON : JavaScript Object Notation
 Un nombre croisssant de services Web échangent des documents
 en format JSON
 Not...
JavaScript – Notation JSON
     Un prototype JavaScript en notation JSON commence par { et se termine par }. Il
     conti...
Google Gears



             Gears




GTI-780 / MTI-780    * Source Clipart : http://www.clipart.com   ETS - Montréal - 2...
Google Gears
 L'usage des cookies pour la persistance est assez limité
 Google Gears est un plugiciel (extension) du furet...
Google Gears – un peu de code
public void save() throws StorageException {
    // Vérifier que Google Gears est installé
 ...
Questions




                                   ?

GTI-780 / MTI-780   * Source Clipart : http://www.clipart.com   ETS - ...
Prochain SlideShare
Chargement dans…5
×

Normes avancées du Web - GTI780 & MTI780 - ETS - A09

2 040 vues

Publié le

Présentation sur les normes avancées du Web dans le cadre du cours combiné GTI780 / MTI780, Sujets spéciaux en TI, donné par Claude Coulombe, à l'Ecole de technologie supérieure, Montréal, Automne 2009

Publié dans : Technologie
0 commentaire
1 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
2 040
Sur SlideShare
0
Issues des intégrations
0
Intégrations
20
Actions
Partages
0
Téléchargements
75
Commentaires
0
J’aime
1
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Normes avancées du Web - GTI780 & MTI780 - ETS - A09

  1. 1. Normes avancées du Web Sujets spéciaux en TI Le Web 2.0 : concepts et outils École de technologie supérieure par Claude Coulombe GTI-780 / MTI-780 ETS - Montréal - 2009
  2. 2. Normes avancées du Web GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  3. 3. Normes avancées du Web  Ajax  Same Origin Policy (SOP)  Services Web  Architecture SOA  REST  RSS 2.0  Atom 0.3 et 1.0  Microformats  XSL– XSLT  JSON  Gears GTI-780 / MTI-780 ETS - Montréal - 2009
  4. 4. Pourquoi des normes avancées? Pour implémenter les fonctionnalités du Web 2.0 Améliorer l'expérience-utilisateur par des interfaces riches et réactives Répondre aux besoins des architectures hétérogènes et distribuées Implémenter les architectures à base de services Web Assurer la compatibilité entre les différents fureteurs et les différentes technologies serveurs Obtenir de l'information à la carte et des interfaces riches en contenu Faciliter la réutilisation, le partage (syndication) et la transformation des contenus sur le Web Forte tendance : REST, ATOM & JSON GTI-780 / MTI-780 ETS - Montréal - 2009
  5. 5. Ajax Ajax GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  6. 6. Ajax – Une véritable percée! AJAX Le premier à utiliser le terme AJAX fut Jesse James Garrett en février 2005 GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  7. 7. Ajax – Une véritable percée! Ajax (Asynchronous JavaScript & XML) Fini le pénible rechargement de pages! Réalise des requêtes asynchrones au serveur et fait la mise-à-jour de la page Web sans faire de chargement complet Applications Web plus réactives et plus dynamiques Objet XMLHttpRequest inventé par M$ Basé sur du code-client en JavaScript GTI-780 / MTI-780 ETS - Montréal - 2009
  8. 8. Ajax – Diagramme de collaboration Fureteur client Fureteur client Interface utilisateur Appel JavaScript Interface utilisateur HTML + CSS Moteur Ajax Requête HTTP Requête HTTP Réponse HTTP (HTML + CSS) Réponse XML / JSON / Texte Serveur Web Serveur Web et XML / JSON/ Texte Base de données, systèmes de gestion Serveur Base de données, systèmes de gestion Serveur Application Web traditionnelle Application Web Ajax GTI-780 / MTI-780 Source : J.J. Garrett 2005 - http://www.adaptivepath.com/ideas/essays/archives/000385.php ETS - Montréal - 2009
  9. 9. Ajax – Diagramme de séquence Avee le Web traditionnel qui est asynchrone, le fureteur est gelé en attendant la réponse du serveur. Avec Ajax qui est asynchrone, l'exécution dans le fureteur sur le poste client se poursuit sans attendre la réponse du serveur. La réponse sera traitée par une fonction de retour (fonction Callback) quand elle arrivera. L'état de la requête est donné par l'attribut readyState de l'objet XMLHttpRequest. GTI-780 / MTI-780 Source : J.J. Garrett 2005 - http://www.adaptivepath.com/ideas/essays/archives/000385.php ETS - Montréal - 2009
  10. 10. Ajax - Avantages & inconvénients GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  11. 11. Ajax - Avantages  Réponses rapides aux actions de l'utilisateur  Applications Web riches, rapides et légères  Pas de long téléchargement, ni d'installation  Permet de modifier partiellement la page affichée par le fureteur pour la mettre à jour sans avoir à recharger la page entière.  Réduit la quantité d'information demandée au serveur  Fait davantage de traitement du côté client (en JavaScript) et moins sur le serveur et le réseau  Donc économie en traitement serveur & bande passante GTI-780 / MTI-780 ETS - Montréal - 2009
  12. 12. Client léger HTML vs client riche Ajax GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  13. 13. Client léger HTML vs client riche Ajax Client HTML (fureteur) Serveur sans état avec état (stateless) (statefull) Pas d'état persistant entre les transactions qui sont considérées comme indépendantes Client JavaScript (fureteur) Serveur avec état sans état (statefull) (stateless) Pas d'état persistant entre les transactions qui sont considérées comme indépendantes GTI-780 / MTI-780 * Source : http://www.google.com ETS - Montréal - 2009
  14. 14. Ajax - Inconvénients JS Ajax GTI-780 / MTI-780 ETS - Montréal - 2009
  15. 15. Ajax - Inconvénients  Phénomène de mode  Problèmes de compatibilité entre les différents fureteurs  Ne fonctionne pas si JavaScript est désactivé  Les données chargées de façon dynamique ne sont pas indexées par les moteurs de recherche  Le bouton de retour en arrière et les signets ne fonctionnent pas  Si le traitement du côté serveur est long, le traitement asynchrone d'Ajax est également long  Sécurité : davantage d'exposition aux attaques et XSS  Basé sur JavaScript qui a ses propres inconvénients  Pas d'accès* en dehors du domaine du serveur  Plus exigeant sur le poste client (vieux PC ?) GTI-780 / MTI-780 * Note : En anglais « Same Origin Policy » ETS - Montréal - 2009
  16. 16. SOP : Same Origin Policy SOP GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  17. 17. Contrainte de sécurité SOP Pour des raisons de sécurité, un script JavaScript* provenant d'une page donnée n'a accès qu'à des objets JavaScript qui sont issus du même domaine que la page d'origine. La fameuse « Same Origin Policy » apparue avec Netscape 2 en 1996 L'idée est d'empêcher qu'un script malicieux ait accès à de l'information confidentielle contenue dans une autre page De plus le fureteur est limité à deux requêtes simultanées avec le même hôte Il est cependant possible d'accéder à un domaine apparenté Par exemple, soit l'URL d'origine : http://www.abc.com/dir/page.html GTI-780 / MTI-780 * Note : qui roule dans un bac de sable (sandbox) ETS - Montréal - 2009
  18. 18. Contournement de la règle SOP Les applications Web centrées client bénéficieraient d'un accès élargi aux services hébergés sur d'autres serveurs Script signé, pas vraiment pratique! « Couche Proxy » sur le serveur, puisque le serveur n'a pas les contraintes de sécurité du fureteur Le fureteur n'applique pas la règle SOP à toutes les ressources d'une page Web. Par exemple, une balise <img...> peut référer à une URL dans un autre domaine. On peut aussi contourner la règle de sécurité SOP en prenant avantage de la balise <script>. Une balise <script> peut référer à un code qui est sur une autre page. Cependant, il faut pouvoir faire confiance à ce script. – GTI-780 / MTI-780 ETS - Montréal - 2009
  19. 19. Services Web Services Web GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  20. 20. Services Web Origine : protocole de communication entre objets distribués ORB (Object Request Broker) comme CORBA*, DCOM et RMI (format propriétaire binaire, lourdeur, complexité) datant d'avant l'invention du Web Environnements distribués et hétérogènes (différents langages et plateformes) Un service établit une relation entre un composant producteur et un composant consommateur Utilisation de messages « en format ouvert » le plus souvent en XML Possibilité d'activation par des événements* Services synchrones ou asynchrones Cela dit, toute application Web, tout site Web est un service! GTI-780 / MTI-780 * Note : CORBA est un bel exemple de design par comité ETS - Montréal - 2009
  21. 21. Services Web - approches Idée : marier HTTP et XML, 2 grandes approches RPC : appel de procédure à distance (Remote Procedure Call) bâti par dessus HTTP Basés sur l'échange d'objets entre le client et le serveur Souvent appelés services WS-* REST : accès à une ressource via une URI/URL XML-RPC, un protocole de service web simple, précurseur de SOAP, XML-RPC est à la base de plusieurs APIs pour les services de blogues SOAP (Simple Object Access Protocol) avec WSDL (Web Services Description language), invocation du service selon le protocole SOAP Historiquement, SOAP est passé de simple à complexe par l'effet combiné d'une tendance à concevoir pour résoudre tous les problèmes (Over-Engineered) et de la conception par comité. De son côté, REST est un retour aux sources du Web, à suivre... GTI-780 / MTI-780 * Note : une évolution intéressante! ETS - Montréal - 2009
  22. 22. Services Web - Avantages & inconvénients GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  23. 23. Services Web - avantages Interopérabilité entre différents composants logiciels écrits en différents langages de programmation et fonctionnant sur différentes plateformes (OS) Normes et protocoles ouverts, souvent en format texte Basé sur HTTP (port 80) qui traverse les coupe-feux Architecture plus fexible, découplée et adaptable GTI-780 / MTI-780 * Note : une évolution intéressante! ETS - Montréal - 2009
  24. 24. Services Web - Inconvénients Pas vraiment de normes établies Performaces plus faibles que les approches moins ouvertes et plus proches du matériel comme CORBA, DCOM et RMI Problème de sécurité (plus grande surface exposée) GTI-780 / MTI-780 * Note : une évolution intéressante! ETS - Montréal - 2009
  25. 25. Architecture SOA SOA GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  26. 26. Architecture SOA SOA (Service Oriented Architecture) Architecture orientée services Basée sur les services Web (WS) et les composants logiciels Reprend les concepts du calcul distribué Un service établit une relation entre un composant producteur et un composant consommateur Application : ensemble de services qui communiquent par des messages Utilisation de messages « en format ouvert » le plus souvent en XML Possibilité d'activation par des événements* Régie selon des contrats d'échange Souvent définie en termes de couches applicatives Services synchrones ou asynchrones Populaire dans le e-commerce (B2B et B2C) Plateformes JEE et .NET GTI-780 / MTI-780 * Note : une évolution intéressante! ETS - Montréal - 2009
  27. 27. Architecture SOA L'annuaire des services référence tous les services Le bus a un rôle d'intermédiaire entre le producteur et le consommateur du service Un service peut implémenter plusieurs interfaces Un service doit respecter un contrat (ou règles de fonctionnement) SOA Interface Annuaire Service Bus de service d'application des services Contrat Implémentation Interface Logique Données d'affaire * Source : Wikipedia & Dirk Krafzig, Karl Banke, and Dirk Slama. GTI-780 / MTI-780 Enterprise SOA. Prentice Hall, 2005 ETS - Montréal - 2009
  28. 28. SOA - Avantages & inconvénients GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  29. 29. SOA - Inconvénients « Phénomène de mode » Tendance à la multiplication des couches et des messages Difficile à tester Problème de coordination ou orchestration entre les divers services Problème de sécurité (plus grande surface exposée) Problème de réelle interopérabilité On constate une certaine lourdeur et de la complexité Particulièrement SOAP est lourd et complexe Difficile d'imaginer des communications SOAP directe avec une application Web au niveau fureteur (client-centric). Pas de service SOAP dans un client JavaScript – GTI-780 / MTI-780 * Note : le plus souvent en XML ETS - Montréal - 2009
  30. 30. SOA - Avantages Couplage faible Favorise les échanges entre toutes sortes de logiciels, peu importe leurs langages de programmation Favorise la réutilisation Favorise l'interopérabilité Favorise une réponse et une adaptation plus rapides des systèmes informatiques aux changements dans l'environnement technologique SOAP offre des possibilités étendues pour le traitement sécuritaire des Transactions SOA ouvre la voie à des architectures Web à base d'événements (Event Driven) GTI-780 / MTI-780 * Note : le plus souvent en XML ETS - Montréal - 2009
  31. 31. SOA & Web 2.0 SOA et Web 2.0 ont beaucoup d'éléments en commun Vision commune d'un Internet des services Répondent à des besoins et des clientèles différentes i.e. Web 2.0 davantage grand public et SOA pour les entreprises Il y a beaucoup de potentiel à combiner les technologies et les principes du Web 2.0 et de l'architecture SOA Programmation événementielle ou à base d'événements (Event Driven) – GTI-780 / MTI-780 * Note : le plus souvent en XML ETS - Montréal - 2009
  32. 32. REST REST GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  33. 33. REST – La simplicité du Web On se connecte sur un serveur, on lui donne un chemin (URL/URI) vers un document et le serveur nous retourne le contenu HTML du document. C'est simplement HTTP On peut voir cela comme l'échange de documents dans des enveloppes URI, HTML ou XML et HTTP Adressable et sans état (Stateless) Cycle HTTP : 1) Construction de la requête : méthode HTTP + URL/URI + HTTP entêtes + document (dans le cas de GET ou POST) 2) Envoi de la requête à un serveur HTTP 3) Réception et traitement de la réponse : statut de la réponse + entêtes + document retourné GTI-780 / MTI-780 *Note : Thèse de doctorat de Roy Fielding, en 2000 ETS - Montréal - 2009
  34. 34. REST REST (REpresentational State Transfer)* plus clairement appelé architecture orientée ressources ROA (Resource-Oriented Architecture) ou RESTful Web services Repose sur la notion de ressources Pas de gestion d'état (stateless) Chaque ressource est accessible via une URI/URL unique Un ensemble de types de contenus MIME en requête et en réponse Chaque ressource répond à un ensemble de commandes HTTP de base qui correspondent aux opérations classiques dites CRUD – GTI-780 / MTI-780 *Note : Thèse de doctorat de Roy Thomas Fielding, ETS - Montréal - 2009
  35. 35. REST – API uniforme Obtenir une représentation d'une ressource : GET Créer une nouvelle ressource : PUT avec nouvel URI Créer une sous-ressource ou une extension : POST avec URI existante Modifier une ressource : PUT avec URI existante Détruire une ressource : DELETE avec URI existante GTI-780 / MTI-780 *Note : Thèse de doctorat de Roy Fielding, en 2000 ETS - Montréal - 2009
  36. 36. REST – Amazon S3 un service RESTful À part le Web lui-même, il existe d'autres véritables services Web REST Par exemple Amazon S3 (Simple Storage Service) 2 concepts : Un conteneur d'objets ou S3 Bucket https://s3.amazonaws.com/<id bucket> Un objet S3 https://s3.amazonaws.com/<id bucket>/<id objet> Obtenir un objet : requête GET à l'URL de l'objet Créer un nouveau bucket : requête PUT à un URL avec l'id du nouveau bucket Créer un nouvel objet : PUT + URL avec <id bucket> / <id objet> Détruire un objet : DELETE + URL avec <id bucket> / <id objet> http://docs.amazonwebservices.com/AmazonS3/2006-03-01/ GTI-780 / MTI-780 ETS - Montréal - 2009
  37. 37. REST – Comparaison avec RPC REST et RPC sont différents à plusieurs niveaux REST RPC 4 procédures : GET, POST, Différents appels de PUT, DELETE procédures qui varient avec les applications Document dans une Enveloppe SOAP XML dans enveloppe HTTP une enveloppe HTTP Procédure dans la méthode Procédure dans l'URI HTTP pas dans l'URI Usage selon les besoins du Surcharge du POST ou GET, POST, PUT, DELETE utilisation unique du GET ou du POST GTI-780 / MTI-780 *Note : Thèse de doctorat de Roy Fielding, en 2000 ETS - Montréal - 2009
  38. 38. REST – Hybrides REST-RPC Il existe aussi des hydrides REST-RPC ou faux services REST Par exemple Flickr qui utilise le GET pour détruire http://www.flickr.com/services/...&method=flickr.photos.delete Aussi Delicious qui utilise le GET et des méthodes dans l'URI https ://api.del.icio.us/.../add Un exemple très fréquent : Soumission d'un formu- laire avec un POST (le POST est surchargé i.e. il peut être remplacé par différentes procédures non HTTP) Un service qui utilise exclusivement le POST ou le GET est habituellement un service de style RPC GTI-780 / MTI-780 *Note : Thèse de doctorat de Roy Fielding, en 2000 ETS - Montréal - 2009
  39. 39. REST – Qualités d'un service RESTful Adressabilité : une URI/URL pour chaque information utile Sans état (stateless) : chaque requête HTTP est complète et isolée, toute l'information nécessaire est fournie au serveur Représentation : un document échangé, l'état d'une ressource Hyperliens et connectivité : les documents contiennent des hyperliens vers d'autres ressources Sans effet de bord : un GET va lire des informations sans rien changer à l'état du serveur Idempotence : une opération sur une ressource est idempotente si l'effet reste le même que l'on effectue l'opération une fois ou plusieurs fois. PUT et DELETE sont idempotents. POST n'est ni idempotent ni sans effet de bord GTI-780 / MTI-780 *Note : Thèse de doctorat de Roy Fielding, en 2000 ETS - Montréal - 2009
  40. 40. REST – Quelques outils et ressources Projet JAX-RS (JSR-311) http://cwiki.apache.org/CXF20DOC/jax-rs-jsr-311.html Un outil à base d'annotations pour créer des services REST @Path("/commande") public class PriseCommandeService { @GET @Path(“/{id}”) public String getCommande()@PathParam(“id”) int commandeId { // corps de la méthode } } En furetant à l'addresse hypothétique http://www.abc.com/commande/123 JAX-RS va faire une requête HTTP à la méthode getCommande() et va recevoir le contenu retourné par la méthode getCommande() GTI-780 / MTI-780 ETS - Montréal - 2009
  41. 41. REST – Projet Restlet Projet Restlet – bonne bibliothèque REST avec une intégration à GWT http://www.restlet.org/about/ Restlet First steps (tutoriel) http://www.restlet.org/documentation/1.1/firstSteps Restlet-GWT module http://wiki.restlet.org/docs_1.1/13-restlet/28-restlet/144-restlet.html GTI-780 / MTI-780 ETS - Montréal - 2009
  42. 42. REST – Quelques outils et ressources Introduction to REST (article JavaLobby) http://java.dzone.com/articles/intro-rest http://java.dzone.com/articles/putting-java-rest Livre RESTful Web Services Leonard Richardson; Sam Ruby O'Reilly Media, Inc. 8 mai, 2007 GTI-780 / MTI-780 ETS - Montréal - 2009
  43. 43. REST - Avantages & inconvénients GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  44. 44. REST - Avantages REST est de plus en plus populaire Les grands sites Web 2.0 comme Amazon, Yahoo!, Flickr offrent des services REST en plus des services SOAP traditionnels REST est bien intégré au canevas d'applications Ruby On Rails (RoR) GTI-780 / MTI-780 ETS - Montréal - 2009
  45. 45. REST - Inconvénients Pas vraiment conçu pour les transactions, bien que cela soit possible Pas conçu pour les protocoles avec états Exige de transmettre toute l'information nécessaire à l'exécution de la requête (pas d'état dans le serveur) GTI-780 / MTI-780 ETS - Montréal - 2009
  46. 46. RSS RSS GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  47. 47. RSS Fil, flux ou canal RSS: syndication de contenu Inventé chez Netscape en 1999 puis amélioré par Dave Winer RSS : Really Simple Syndication (à l'origine RDF* Site Summary) Permet d'ajouter facilement des contenus de d'autres sites (syndication) Basé sur le XML, le RSS définit une liste d'items de contenu avec une URL par item accompagnée de métadonnées qui décrivent le contenu Utilisé pour du contenu qui change fréquemment (diffusion de nouvelles, cours de la bourse, météo) Afficher les nouveautés d'un blogue (billets récents) Baladodiffusion audio (flux RSS audio) et vidéo (flux RSS vidéo) Disponible par abonnement http://fr.wikipedia.org/wiki/RSS_(format) http://cyber.law.harvard.edu/rss/rss.html GTI-780 / MTI-780 * RDF : Resource Description Framework à la base du Web sémantique ETS - Montréal - 2009
  48. 48. RSS 2.0 Contenu entre les balises <rss>, métadonnées entre les balises <channel>, <title> : le titre de l'item , <description> : description de l'item, <link> : l'URL du site associé à l'item <?xml version="1.0" encoding="UTF-8"?> <rss version="2.0"> <channel> <title>Fil RSS (créé avec Rome)</title> <link>http://rome.dev.java.net</link> <description>Ce fil RSS a été créé avec Rome (utilitaire Java de syndication RSS)</description> <item> <title>Le Bic - Prédictions des marées pour 7 jours</title> <link>http://www.marees.gc.ca/cgi-bin/tide-shc.cgi? queryType=showFrameset&amp;zone=2&amp;language=french&amp;region=4&amp;stnnum=2995</link> <description>Extraction du contenu de la table des marées...</description> </item> <item> <title>Cacouna - Prédictions des marées pour 7 jours</title> ... </item> </channel> </rss> GTI-780 / MTI-780 ETS - Montréal - 2009
  49. 49. RSS – baladodiffusion La baladodiffusion (podcast) qui est la diffusion de contenu multimédia est basée sur les flux RSS. Le logiciel de recherche de baladodiffusion télécharge automatiquement le fichier multimédia associé à l'item du flux RSS. Utilisation de la balise <enclosure> : <enclosure url="http://www.radio.org/balado/exemple.mp3" length="3968800" type="audio/mpeg" /> GTI-780 / MTI-780 * Source : http://fr.wikipedia.org/wiki/Podcast ETS - Montréal - 2009
  50. 50. ROME ROME : Rss and atOM utilitiEs : une excellente bibliothèque Java en code source libre qui se base sur JDOM Support de toutes les versions de RSS et d'Atom Analyse, génération et conversion de flux RSS d'un format à l'autre Sorties vers : String, File, java.io.Writer, org.w3c.dom.Document, org.jdom.Document Entrées depuis : File, java.io.Reader, org.xml.sax.InputSource, org.w3c.dom.Document, org.jdom.Document object Un ensemble de modules : iTunes, A9 Open Search, Google Base, etc. https://rome.dev.java.net/ GTI-780 / MTI-780 * RDF : Resource Description Framework ETS - Montréal - 2009
  51. 51. RSS - Avantages & inconvénients GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  52. 52. RSS - Inconvénients L'information étant rafraîchie régulièrement, l'usager peut manquer une nouvelle importante Généralement pas d'archivage Surabondance d'information (infobésité) Accent sur la nouveauté, pas sur l'analyse et la réflexion La licence RSS 2.0 appartient à la faculté de droit de l'Université Harvard GTI-780 / MTI-780 ETS - Montréal - 2009
  53. 53. RSS - Avantages Usager : permet d'être informé d'un contenu sans aller le consulter Diffuseur: attirer des visiteurs, syndiquer (partager des contenus), recyclage/réutillisation des contenus Bon pour la veille, pour suivre l'actualité ou tenir informer des nouveautés Grâce aux CSS, l'apparence peut être personnalisée Réutiliser le contenu issu d'un autre site tout en personnalisant la présentation GTI-780 / MTI-780 ETS - Montréal - 2009
  54. 54. Atom Atom GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  55. 55. Atom Atom est un format de syndication créé en 2003 pour combiner la simplicité de RSS 2.0 (i.e. non basé sur RDF) mais en conservant certains aspects de RSS 1.0 comme l'espace de nommage Norme non propriétaire accrédité par l'IETF (Internet Engineering Task Force) Créée en réaction au format RSS 2.0 qui appartient à la faculté de droit de l'Université Harvard Atom 0.3 est plus répandu mais la dernière version est Atom 1.0 Atom sert d'API standard pour les blogues (Atom Publishing Protocol) Choisi par Google pour Blogger Propose un API REST (Atom Publishing Protocol) http://tools.ietf.org/html/rfc4287 GTI-780 / MTI-780 ETS - Montréal - 2009
  56. 56. Atom – Exemple de flux Atom <?xml version="1.0" encoding="UTF-8"?> <feed xmlns="http://purl.org/atom/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" version="0.3"> <title>Sample Feed (created with Rome)</title> <link rel="alternate" href="http://rome.dev.java.net" /> <tagline>This feed has been created using Rome (Java syndication utilities</tagline> <entry> <title>Rome v1.0</title> <link rel="alternate" href="http://wiki.java.net/bin/view/Javawsxml/Rome01" /> <author> <name /> </author> <modified>2004-06-08T04:00:00Z</modified> <issued>2004-06-08T04:00:00Z</issued> <summary type="text/plain" mode="escaped">Initial release of Rome</summary> <dc:date>2004-06-08T04:00:00Z</dc:date> </entry> ... </feed> GTI-780 / MTI-780 ETS - Montréal - 2009
  57. 57. Microformats µF GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  58. 58. Microformats Approche de normalisation du format des données basée sur XML / XHTML et l'étiquetage sémantique (métadonnées) But: l'automatisation, la réutilisation, la recherche d'information & l'interopérabilité Conçus d'abord pour les humains mais lisibles par les machines Simplicité : « Si une spécification fait plus d'une page, elle est trop compliquée à implémenter » Il existe une communauté Microformat qui n'est pas un organisme de normalisation. Processus ouvert qui cherche d'abord à se coller aux usages. http://microformats.org GTI-780 / MTI-780 ETS - Montréal - 2009
  59. 59. Microformats – Aspect technique Basés sur XML / XHTML et les métadonnées Utilisation des attributs : class, rel et rev Peu de choses sont obligatoires Souplesse dans l'utilisation des <div> et des <span> •Par exemple une carte de visite en format hCard <address class="vcard"> <p> HTML vCard <span class="fn">Claude Coulombe</span><br/> Formal Name <span class="org">École de technologie supérieure</span><br/> <span class="tel">514-396-8800</span><br/> <span class="email">claude.coulombe@etsmtl.ca</span><br/> <a class="url" href="http://www.etsmtl.ca/zone1/bottins/claudecoulombe">Hyperlien Claude Coulombe</a> </p> </address> Hyperlien original non RESTful : http://www.etsmtl.ca/zone1/bottins/Page_details.asp?Numero=4075 GTI-780 / MTI-780 ETS - Montréal - 2009
  60. 60. Microformats - Exemples HTML vCard Contacts ou personnes (hCard) HTML iCalendar Événements et calendriers (hCalendar) Relation (rel-tag) Coordonnées géographiques (Geo) Liens de vote (VoteLinks) Références bibliographiques (Dublin Core, hCitation) Curriculum Vitae (hResume) GTI-780 / MTI-780 ETS - Montréal - 2009
  61. 61. Microformats - Avantages & inconvénients GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  62. 62. Microformats - Avantages Réutilisation facile des contenus sur le Web On peut même dire que RSS et ATOM s'apparentent aux microformats. Enrichissement des contenus. L'un des microformats les plus simples est le rel-tag. Par exemple, l'auteur d'un blogue va ajouter rel='tag' à un hyperlien pour étiqueter son billet (folksonomie). Soumis à un site comme technorati il peut ensuite voir son billet classé sous cette catégorie. <a href="http://en.wikipedia.org/wiki/Web2" rel="tag">microformat</a> Synchronisation facile des données dans les applications. Par exemple, des événements sont mis à jour sur un site web en format hCalendar et ils se synchronisent automatiquement avec les applications de calendrier. Ajoutent de la sémantique aux personnes, aux lieux, aux événements Un premier pas utile vers le Web sémantique... GTI-780 / MTI-780 ETS - Montréal - 2009
  63. 63. Microformats - Inconvénients Peu de vraies normes, beaucoup de variantes Difficiles de s'y retrouver Parfois fastidieux à produire GTI-780 / MTI-780 ETS - Montréal - 2009
  64. 64. XSL - XSLT XSL / XSLT GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  65. 65. XSL / XSLT Technologies d'extraction et de transformation des données XSL (eXtensible Stylesheet Language) XSLT (XML Stylesheet Language for Transformations) transforme un document source balisé (XML) en un second document (généralement balisé lui-aussi) Les documents obtenus par Ajax sont souvent trop complexes pour être traités « manuellement » à partir de l'API DOM Utilisation de l'extraction XPath ou des transformations XSLT pour obtenir des données utiles Peu valorisées à l'image des bases de données mais essentielles GTI-780 / MTI-780 ETS - Montréal - 2009
  66. 66. XSL / XSLT – Petit exemple... entreeD1.xml <?xml version="1.0"?> <doc>Bonjour XSLT</doc> D1versD2.xsl <?xml version="1.0"?> <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0"> <xsl:template match="doc"> <out><xsl:value-of select="."/></out> </xsl:template> </xsl:stylesheet> => sortieD2.xml <?xml version="1.0"?> <out>Bonjour XSLT</out> GTI-780 / MTI-780 ETS - Montréal - 2009
  67. 67. XSL / XSLT – Un peu de code... import javax.xml.transform.*; // Utilisation de l'interface TraX pour réaliser une transformation // de la la manière la plus simple possible, en trois instructions Java public class TransformDOC1versDOC2 { public static void main(String[] args) throws TransformerException, TransformerConfigurationException, FileNotFoundException, IOException { if (args.length != 3 || args[0].equals("--aide")) { System.out.println("java TransformDOC1versDOC2 D1versD2.xsl entreeD1.xml sortieD2.xml"); return; } TransformerFactory transFact = TransformerFactory.newInstance(); Transformer transformer = transFact.newTransformer(new StreamSource(args[0])); transformer.transform(new StreamSource(args[1]), new StreamResult(new FileOutputStream(args[2]))); } } GTI-780 / MTI-780 ETS - Montréal - 2009
  68. 68. XSL / XSLT - outils Du côté serveur : JAXP (Java API for XML Processing) Traitement du XML (validation, analyse, transformation) qui regroupe un ensemble d'outils Java pour le traitement du XML dont l'analyseur (parser) Xerces. JAXP regroupe les 2 principales interfaces d'analyse (parsage) de documents XML : DOM (Document Object Model) qui construit un arbre en mémoire SAX (Simple API for XML) qui base son analyse sur le déclenchement d'événements (et évocation de fonctions callback) À cela s'ajoute l'API de transformation XSLT qui s'appuie sur le moteur de transformation Xalan Depuis Java 5, JAXP est inclus dans le JDK et fait partie du Java de base Autres ressources serveurs : JDOM, dom4j et StAX Du côté client : la bibliothèque JavaScript Google AjaxSLT http://goog-ajaxslt.sourceforge.net/ GTI-780 / MTI-780 ETS - Montréal - 2009
  69. 69. JSON JSON GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  70. 70. JSON JSON : JavaScript Object Notation Un nombre croisssant de services Web échangent des documents en format JSON Notation beaucoup plus compacte que le XML => consomme moins de bande passante Directement interprétable par JavaScript (un simple eval) => demande moins de traitement On assiste au développement d'un ensemble d'outils pour JSON qui sont directement inspirés de ce qui existe déjà pour XML http://www.json.org/json-fr.html GTI-780 / MTI-780 ETS - Montréal - 2009
  71. 71. JavaScript – Notation JSON Un prototype JavaScript en notation JSON commence par { et se termine par }. Il contient un ensemble de couples attribut/valeur non ordonnés. Chaque attribut est suivi de : et les couples attribut/valeur sont séparés par une , var auto = { fabricant : 'Toyota', modele : 'Prius', couleur : 'vert', proprio : { nom = 'Lyne'; } }; GTI-780 / MTI-780 ETS - Montréal - 2009
  72. 72. Google Gears Gears GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009
  73. 73. Google Gears L'usage des cookies pour la persistance est assez limité Google Gears est un plugiciel (extension) du fureteur qui permet de mémoriser de plus grandes quantités de données sur le poste client Gears fournit une base de données SQL Pour FireFox 1.5 + et IE 6+ http://gears.google.com/ GTI-780 / MTI-780 ETS - Montréal - 2009
  74. 74. Google Gears – un peu de code public void save() throws StorageException { // Vérifier que Google Gears est installé if( ! IsGearsInstalled() ) throw new StorageException("Echec sauvegarde, Gears pas installé"); try { // Créer la table maBDGears si elle n'existe pas Database db = new Database("maBdGears"); db.execute("create table if not exists maBdGears (key varchar(255), value text)"); // Sauvegarder la liste de valeurs contenues dans la Map getValues() dans la table for(Iterator iter=getValues().entrySet().iterator(); iter.hasNext(); ){ Entry entry = (Entry) iter.next(); db.execute("insert into maBdGears values (?, ?)", new String[] { (String) entry.getKey(), (String) entry.getValue() }); } } catch (GearsException e) { throw new StorageException( "Echec sauvegarde", e ); } } GTI-780 / MTI-780 * Source : R. Dewsbury 2008 – Chap.6, p. 306-307 ETS - Montréal - 2009
  75. 75. Questions ? GTI-780 / MTI-780 * Source Clipart : http://www.clipart.com ETS - Montréal - 2009

×