Conception Internet 2. Partie 2 - Web Dynamique. Fabrice Lefèvre fabrice.lefevre@univ-avignon.fr

Transcription

1 Conception Internet 2 Partie 2 - Web Dynamique Fabrice Lefèvre fabrice.lefevre@univ-avignon.fr

2 HTML et ses limites Client HTML CSS Majorité des traitements au Pages niveau HTML du serveur dynamiques Pas de réelle gestion des événements utilisateurs Serveur http HTML PHP Smarty CSS CGI L1S2 CI-2 23

3 Pages web dynamiques Deux approches : Coté serveur (source) un programme/script est interprèté sur le serveur AVANT la transmission HTTP SSI, CGI, Servlet Java, ASP, PHP... Coté client (utilisateur) un programme/script est interprété par le navigateur AVANT l'affichage du document HTML ou lors de certains événements utilisateurs (déplacement de la souris...) Javascript, JScript, VBScript, tcl, applets... L1S2 CI-2 24

4 HTML Dynamique (1) DHTML, standard de développement qui repose sur : une vue orientée objet de la page web et de ses éléments. chaque élément <tag id="id_du_tag"> blabla </tag> est identifié par son... identifiant et accessible de manière univoque. La structure entière de la page peut être représentée sous la forme d'une arborescence, permettant l'accès direct (et la modification) à chacun de ses éléments. le recours éventuel à des langages de script pour la gestion des événements. Cela pourrait être du VBscript, mais nous nous limiterons au JavaScript. l'appel systématique aux feuilles de style CSS qui permettent une modification précise de l'apparence de chacun des éléments. L1S2 CI-2 25

5 HTML Dynamique (2) Vise l'utilisation maximale des possibilités des navigateurs récents, sans l'emploi de ressources externes (plugiciel ou autre). Initié par Netscape, supporté par Microsoft versions 4.x et suivantes des navigateurs grandes variabilités d'interprétation L1S2 CI-2 26

6 HTML Dynamique (3) Avantages permet de produire du contenu dynamique est d'une relative simplicité offre plus de possibilités que le JavaScript seul Inconvénients fonctionnement variable selon le navigateur (Netscape vs Microsoft) standard entre les mains des compagnies standard sujet à être remplacé par une nouvelle technologie (XML) Concurrent principal : Flash (sur-puissant mais format propriétaire) L1S2 CI-2 27

7 DOM (1) Modèle Objet de Document, (ou DOM, Document Object Model) est un outil permettant l'accès aux documents HTML et XML. Permet deux choses au développeur : fournit une représentation structurée du document codifie la manière dont un script peut accéder à cette structure à travers les objets qu'elle contient au niveau des propriétés et des méthodes Donc, en pratique, Permet de lier une page Web à un langage de programmation ou de script L1S2 CI-2 28

8 DOM (2) Le DOM ne désigne pas une application particulière, ou bien un produit spécifique ou une présentation propriétaire d'une page Web. Il s'agit d'une interface qui permet de standardiser les moyens d'accès à une page Web Toutes les propriétés et méthodes et tous les événements disponibles au développeur pour manipuler et créer des pages dynamiques sont organisés sous forme de hiérarchies d'objets L1S2 CI-2 29

9 Interprétation DOM (1) <TABLE> <TABLE> <TBODY> <TBODY> <TR> <TR> <TD>Bois <TD>Bois ombragé</td> ombragé</td> <TD>Éolien</TD> <TD>Éolien</TD> </TR> </TR> <TR> <TR> <TD>Au <TD>Au cours cours de de l'eau, l'eau, Charlie</TD> Charlie</TD> <TD>Adrien</TD> <TD>Adrien</TD> </TR> </TR> </TBODY> </TBODY> </TABLE> </TABLE> L1S2 CI-2 30

10 Interprétation DOM (2) document.table[0].tbody.tr[1].td[1] L1S2 CI-2 31

11 JavaScript Langage interprété (dont la syntaxe s'apparente vaguement au langage Java) Développé par la firme Netscape pour la version 2.0 de son navigateur Repris par l'organisation ECMA (European Computer Manufacturers Association) d'ou son appellation d'ecmascript Code indépendant du processeur et du système d'exploitation Accès aux périphériques (disque dur,...) limités pour éviter des problèmes de sécurité L1S2 CI-2 32

12 JavaScript : limites Code JavaScript interprété par le navigateur Possibilité de désactiver cette interprétation au niveau des navigateurs code JavaScript totalement ignoré par le navigateur JavaScript ne doit pas supporter la responsabilité de sécuriser les interactions client/serveur Ex de la vérification de la syntaxe des adresses si réalisée uniquement par du code JavaScript, possibilité de désactiver ce dernier et de renvoyer une fausse adresse pour «hacker» le serveur mail toto@toto.fr ; cat /etc/passwd Tests de sécurité et de validation des données peuvent être redondants sur le client et le serveur! L1S2 CI-2 33

13 JavaScript : pros and cons Avantages Bonnes possibilités d'interactivité Langage simple Facile à déployer (un simple éditeur texte et un navigateur qui le supporte) Inconvénients Se désactive par l'utilisateur Fonctionnement inégal entre les navigateurs Script ouvert. Le code que vous écrivez étant visible par tous, vous ne devez pas écrire de code sensible, par exemple la validation d'un examen L1S2 CI-2 34

14 Java et les applets (1) Langage Java (développé par Sun) Objectif : offrir un outil universel qui permettrait de contrôler autant un téléphone portable qu'un ordinateur de forte puissance Java repose sur l'emploi d'un interpréteur, le Java Virtual Machine ou JVM, qui décode le programme Java et le traduit dans le langage de la machine hôte Langage orienté objet. Syntaxe ressemble grandement à celle du C++, avec de nombreuses améliorations (gestion de la mémoire...). L1S2 CI-2 35

15 Java et les applets (2) Applets : petit programme intégré à une page Web. applet exécuté en vase clos, sans danger pour l'ordinateur hôte. contrairement au JavaScript ou au VBScript, le code source ne sera pas visible au sein de la page HTML. Sun assure la pérennité du langage Java en ne cessant de le développer et de lui adjoindre d'autres technologies. Bien qu'il souffre d'une certaine avidité en ressources matérielles, il s'agit d'un langage plein de promesses pour l'avenir. L1S2 CI-2 36

16 Java et les applets (3) Avantages large éventail de possibilités bibliothèque d'objets abondante et vaste documentation disponibles universel et sécurisé Inconvénients requiers une bonne connaissance de la programmation orientée-objet courbe d'apprentissage plus élevée (développement) exigeant en ressources matériels (Mémoire, temps CPU) par défaut, le Java est interprété et peu performant par rapport aux langages compilés tels le C et le C++ L1S2 CI-2 37

17 JavaScript vs Java JavaScript Java Interprété Dédié au Web Accès aux balises HTML Compilé Langage généraliste Pas d'accès aux balises HTML Dépendance forte avec le langage HTML Applet Java : exécution indépendante du HTML L1S2 CI-2 38