L'essentiel des architectures Internet et Intranet

INTRODUCTION

Internet

• Internet est un système mondial d'interconnexion de réseaux informatiques, utilisant un ensemble standardisé de protocoles de transfert de données.

• un réseau de réseaux, sans centre névralgique, composé de millions de réseaux aussi bien publics, privés, universitaires, commerciaux et gouvernementaux.

• Internet transporte un large spectre d'information et permet l'élaboration d'applications et de services variés comme lecourrier électronique, la messagerie instantanée et le World Wide Web.

Intranet

• C ’est un ensemble de services Internet interne à un réseau local donc accessible qu’à partir d ’un poste du réseau local

• utilise les standards client/serveur d’internet

• Mise à disposition d ’informations sur l’entreprise, échange de données entre collaborateurs, etc.

• Pour la mise en place matérielle il suffit d’ un serveur web

Extranet

• Un extranet est une extension du système d’information de l’entreprise à des partenaires situés au-delà du réseau et ce de manière sécurisée (authentification par login et mot de passe).

• Offre à certains clients un accès privilégié à certaines ressources informatiques de l’entreprise par l’intermédiaire d’une interface Web

Internet/ Intranet/ Extranet

Destinataires

Exemples de contenu

Lieu d'accès

Authentification

Internet

Externes à

l'organisation

Présentation des

activités

Extérieur (public) Facultative

Intranet

Internes à

l'organisation

Outils collaboratifs Réseau de

l'organisation (privé)

Automatique (par le

réseau)

Extranet

Externes à

l'organisation

Informations partenaires Extérieur (privé) Obligatoire

Site WEB

• Désigne l'ensemble des pages et des documents reliés entre-eux par des liens Hypertextes qui sont accessibles et consultables grâce à un serveur web aux internautes depuis Internet.

Serveur WEB

• Serveur accessible depuis internet, installé au sein d'une DMZ offrant à des internautes l'accès et la consultation sites web.

• DMZ (Zone démilitarisée) : est un sous-réseau séparé du réseau local et isolé de celui-ci et d'Internet par un pare-feu. Ce sous-réseau contient les machines étant susceptibles d'être accédées depuis Internet.

DMZ (Zone démilitarisée)

Serveur web : Technologies de base

• un ordinateur tenant le rôle de serveur informatique sur lequel se trouve un ou plusieurs logiciels tournant en parallèle et permettant le fonctionnement d'applications Web.

• Par exemple : Apache (serveur HTTP), MySQL (serveur de base de données) et PHP, tous libres.

• Sous Linux, cette combinaison s'appelle LAMP (sigle de « Linux, Apache, MySQL, PHP ») ;

• sous Windows, WAMP (« Windows, Apache, MySQL, PHP ») • sous Mac, MAMP (« Macintosh, Apache, MySQL, PHP »). • Mais aussi : Windows / IIS / SQL Server / ASP .Net • La plupart des ordinateurs utilisés comme serveur Web sont reliés

à Internet et hébergent des sites web du World Wide Web. Les autres serveurs se trouvent sur des intranets et hébergent des documents internes d'une entreprise, d'une administration, etc.

Serveur web : Technologies de base

Exemples de technologies :

• plateforme : WAMP, LAMP, MAMP

• langages de programmation : Php, Javascript, Sql

• langages de présentation (IHM) : Html (et plus précisément XHTML), Css

• frameworks PHP (OO) : Zend Framework, CakePhp, Symfony, Code Igniter, etc.

• frameworks Javascript : Mootools, Scriptaculous (pas user freindly), Dojo (très lourd) ou Jquery (IHM moyenne)

• gestionnaire de versions : Subversion couplé à TortoiseSVN (une interface cliente pour Windows).

• environnements de développement : Eclipse ou PDT (pour l’édition des fichiers Php), Aptana (pour l’édition des fichiers HTML, Javascript et CSS), Subclipse (pour la gestion des versions de tous les fichiers sources)

• gestionnaire de bug : Trac, Jira, etc.

Navigateur Web ou BROWSER

• Definition : Un navigateur web (browser en anglais) est un logiciel destiné à la consultation des ressources du World Wide Web notamment les pages au format HTML. En outre, l'ajout de modules d'extension (ou plug-in en anglais) permet au navigateur de reconnaître et d'interpréter d'autres formats présents sur le Web tels que le Javascript, les CSS, le DHTML, le XHTML ou encore les animations au format Flash. En plus du protocole HTTP, le browser supporte aussi le HTTPS (Secure Sockets Layer (SSL)), FTP (File Transfer Protocol))

• Historique : – 1990: WorldWideWeb (plus tard rebaptisé Nexus) (Next) – 1992 : Erwise (premier navigateur graphique) (système X-Window) – 1993 : NCSA Mosaic (multiplateformes) – 1995: Netscape Navigator (par Marc Andreessen) et Internet Explorer 1 de

MicroSoft – 2000: IE devient le navigateur le plus utilisé (procés pour abus de position

dominante vs Netscape )

Parts de marché des navigateurs (-> 12/2011)

Navigateur Web ou BROWSER

• Fonctionnement : Le navigateur Web est composé de : – Moteur de rendu HTML : composant logiciel de base

qui permet aux logiciels d'afficher les éléments d'une page Web. Ils sont de ce fait le cœur des navigateurs Web (Exemple : Gecko de la Fondation Mozilla, Trident de Microsoft, Presto de Opera Software, etc.)

– interface utilisateur : IHM – gestionnaire d'extensions : appelées plugins (module

d'extension) : par exemple : pour afficher des pages PDF ou du Flash.

Introduction aux architectures et technologies du Web

Notions d'architectures

• L'architecture en couches consiste à diviser une application en différents modules, qui constituent autant de couches. L'objectif est de proposer une meilleure répartition des rôles (chaque module a un rôle clairement défini), la séparation des traitements, ainsi qu'une réduction des dépendances entre les services. Chaque module se doit d'être indépendant des autres pour permettre une meilleure maintenabilité.

• Une application peut aisément se diviser en : – deux niveaux (2-tier) : client/serveur – trois niveaux distincts (3-tier) : les données, le traitement de ces

données, et leur affichage. – N niveaux (N-tier ou multi-tier) : sépare l’application en plusieurs

couches

Client Lourd

• un client lourd (en anglais « fat client » ou « heavy client ») désigne une application cliente graphique qui effectue une partie ou la totalité des traitements sans faire intervenir le serveur.

• Le client lourd mêle la logique de présentation (l'interface graphique) avec la logique applicative (les traitements).

• Les traitements sont exécutée sur le système d'exploitation de l'utilisateur

L'architecture client-serveur

C’est un modèle de fonctionnement logiciel qui peut se réaliser sur tout type d'architecture matérielle, à partir du moment ou ces architectures peuvent être interconnectées. On parle de fonctionnement logiciel dans la mesure où cette architecture est basée sur l'utilisation de deux types de logiciels, à savoir : • un logiciel serveur et • un logiciel client s'exécutant sur 2 machines différentes. L'élément important dans cette architecture est l'utilisation de mécanismes de communication entre les 2 applications.

L'architecture client-serveur

• Le client demande un service au serveur

• Le serveur réalise ce service et renvoie le résultat au client

L'architecture client-serveur

• Service : Le serveur est fournisseur de services. Le client est consommateur de services.

• Protocole : C'est toujours le client qui déclenche la demande de service. Le serveur attend passivement les requêtes des clients (sauf pour le WCF/polling).

• Partage des ressources : un serveur traite plusieurs clients en même temps et contrôle leurs accès aux ressources.

• Localisation : Le client masque aux clients la localisation du serveur.

• Hétérogénéité : Le client est indépendant des plates-formes matérielles et logicielles.

• Redimensionnement : Il est possible d'ajouter et de retirer des stations clientes. Il est possible de faire évoluer les serveurs.

• Intégrité : Les données du serveur sont gérées sur le serveur de façon centralisée. Les clients restent individuels et indépendants.

• Souplesse et adaptabilité : On peut modifier le module serveur sans toucher au module client. La réciproque est vraie.

L'architecture client-serveur

• Exemple : une application de gestion fonctionnant sous Windows ou Linux et exploitant un SGBD centralisé. – Les postes clients : l’application (IHM+Traitement :

client lourd)

– Le serveur : SGBD (serveur de Données)

• Le dialogue entre client et serveur se résume donc à l'envoi de requêtes et au retour des données correspondant aux requêtes.

L'architecture client-serveur : avantages

• des ressources centralisées : le serveur est au centre du réseau, il peut gérer des ressources communes à tous les utilisateurs

• une meilleure sécurité : car le nombre de points d'entrée permettant l'accès aux données est moins important

• une administration au niveau serveur : les clients ayant peu d'importance dans ce modèle, ils ont moins besoin d'être administrés

• un réseau évolutif : grâce à cette architecture il est possible de supprimer ou rajouter des clients sans modifications majeures (matérielles ou logicielles)

L'architecture client-serveur : Inconvénients

• un coût élevé dû à la technicité du serveur • un maillon faible : le serveur est le seul maillon faible du

réseau client/serveur, étant donné que tout le réseau est architecturé autour de lui ! Heureusement, le serveur a une grande tolérance aux pannes (notamment grâce au système RAID)

• Le poste client est fortement sollicité, il supporte la grande majorité des traitements applicatifs

• Les applications se prêtent assez mal aux fortes montées en charge car il est difficile de modifier l'architecture initiale,

• La relation étroite qui existe entre le programme client et l'organisation de la partie serveur complique les évolutions de cette dernière,

L'architecture 3-tiers

• Les limites de l'architecture deux tiers proviennent en grande partie de la nature du client utilisé (frontal) qui est complexe et non standard (même s'il s'agit presque toujours d'un PC sous Windows ou Linux),

• La solution résiderait donc dans l'utilisation d'un poste client simple communicant avec le serveur par le biais d'un protocole standard.

• l'architecture 3-tiers est une extension du modèle client/serveur. Dans ce but, on applique les principes suivants : • Les données sont toujours gérées de façon centralisée, • La présentation est toujours prise en charge par le poste client, • La logique applicative est prise en charge par un serveur

intermédiaire.

L'architecture 3-tiers

L'architecture 3-tiers

Dans cette architecture 3 niveaux sont nécessaires : • COUCHE DE PRESENTATION : Un poste client ( l'ordinateur demandeur de

ressources) équipé d'une interface utilisateur ( client léger : généralement un navigateur web) chargé de la présentation. Donc le premier niveau = l'affichage et les traitements locaux (dialogue avec l’utilisateur, contrôles de saisie, mise en forme de données...)

• COUCHE METIER : Un serveur d'application mise en œuvre de l'ensemble des règles de gestion et de la logique applicative. Donc, le deuxième niveau = les traitements applicatifs(vérification d'authentification, calculs divers, etc.),

• COUCHE ACCES AU DONNEES : Un serveur de données qui fournit au serveur d'application les données requises pour répondre au client. Accès aux données persistantes (persistence en anglais) : correspondant aux données qui sont destinées à être conservées de manière continue. Donc, le troisième niveau = les services de la base de données (le SGBD).

Client Léger

• un client léger (thin client) est un client qui ne fait que formuler les demandes de l'utilisateur et lui présenter les résultats.

• Les traitements (la logique métier ) sont effectués entièrement par le serveur

• C’est, donc, une application accessible via une interface web (en HTML) consultable à l'aide d'un navigateur.

• Le navigateur est parfois appelé client universel.

L'architecture 3-tiers : Modèle d’échange

• Les couches communiquent au travers d’un modèle d’échange : les services d’une couche sont mis à la disposition de la couche superieure

– La couche Données offre des services à la couche traitement

– La couche Traitement offre des services à la couche présentation

• Chaque couche ne communique qu’avec ses voisins immédiats

Couche Présentation

Couche Traitement

Couche Données

L'architecture 3-tiers : Avantages

• Tous ces niveaux étant indépendants, ils peuvent être implantés sur des machines différentes, de ce fait : – Le poste client ne supporte plus l'ensemble des traitements, il est

moins sollicité et peut être moins évolué, donc moins coûteux,

– Les ressources présentes sur le réseau sont mieux exploitées,

puisque les traitements applicatifs peuvent être partagés ou regroupés (le serveur d'application peut s'exécuter sur la même machine que le SGBD),

– La fiabilité et les performances de certains traitements se trouvent améliorées par leur centralisation,

– Il est relativement simple de faire face à une forte montée en charge, en renforçant le service applicatif.

L'architecture 3-tiers : Incovénients

• le serveur de traitement constitue la pierre angulaire de l'architecture et se trouve souvent fortement sollicité.

• Dans ce type d'architecture, il est difficile de répartir la charge entre client et serveur.

• On se retrouve confronté aux problèmes de dimensionnement serveur et de gestion de la montée en charge rappelant l'époque des mainframes.

• Les solutions mises en œuvre sont relativement complexes à maintenir et la gestion des sessions est compliquée.

• Les contraintes semblent inversées par rapport à celles rencontrées avec les architectures deux tiers : le client est soulagé, mais le serveur est fortement sollicité.

• L'architecture n-tiers a été pensée pour pallier aux limitations des architectures trois tiers et concevoir des applications permettant de distribuer plus librement la logique applicative, ce qui facilite la répartition de la charge entre tous les niveaux.

L'architecture N-tiers

• L'appellation N-tiers pourrait faire penser que cette architecture met en œuvre un nombre indéterminé de niveaux de service, alors que ces derniers sont au maximum trois (présentation, traitement, données)

• En fait, l'architecture n-tiers qualifie la distribution d'application entre de multiples services et non la multiplication des niveaux de service.

L'architecture N-tiers

Architectures n-tiers : Avantages

Ce type d’architecture supprime les inconvénients des architectures précédentes : • permet l'utilisation d'interfaces utilisateurs riches, • sépare nettement tous les niveaux de l'application, • offre de grandes capacités d'extension, • facilite la gestion des sessions, • Prise en compte de l’hétérogénéité des plateformes, • Amélioration de la sécurité des données : plus grande séparation

entre les traitements métiers et la couche données, • Meilleure répartition de la charge entre les différents serveurs

d’applications (architecture technique sur plusieurs machines physiques)

Client Riche • Un « client riche » est un compromis entre le client léger et le client lourd.

• L'objectif du client riche est de proposer une interface graphique, décrite avec une grammaire de description basée sur la syntaxe XML, permettant d'obtenir des fonctionnalités similaires à celles d'un client lourd (glisser déposer, onglets, multi fenêtrage, menus déroulants).

• Les clients riches permettent de gérer l'essentiel des traitements du côté du serveur.

• Les données sont ensuite transmises dans un format d'échange standard utilisant la syntaxe XML (SOAP, XML-RPC), puis interprétées par le client riche.

• Les principaux standards permettant de définir une application riche sont les suivants :

– XAML (eXtensible Application Markup Language), prononcez « zammel », un standard XML proposé par Microsoft, utilisé notamment dans les applications utilisant le framework .NET ;

– XUL, prononcez « zoul », un standard XML proposé par la fondation Mozilla, utilisé par exemple dans le client de messagerie Mozilla Thunderbird ou dans le navigateur Mozilla Firefox ;

– Flex, un standard XML proposé par la société Macromedia.

Plan

Introduction & Définition

1

2 Fonctionnalités

3 Architecture

4

5

Développement d’application

Exemple d’application

Introduction & définition

• Silverlight est un petit plug-in multi-plateformes pour navigateurs Web. Il permet la lecture de contenus multimédia et la mise au point d'applications Internet enrichies (Rich Internet Applications, ou RIA)

• Mis au point par Microsoft, Silverlight est un concurrent direct de la technologie Flash de Adobe/Macromedia. Silverlight fonctionne avec les navigateurs Internet Explorer, Firefox et Safari (Windows et Mac).

• Silverlight permet de visionner des animations de type vectorielles, mais surtout des contenus multimédias intégrant de l'audio et de la vidéo. Microsoft a mis d'ailleurs l'accent sur les vidéos, basées sur le format maison Windows Media Video.

Introduction & définition

• La suite Expression, permet aux développeurs de créer des

applications Silverlight qui est avant tout un interpréteur de

langage XAML. Ce dernier, promu par Microsoft, est utilisé

pour le rendu et la description d'interfaces.

Silverlight embarque également un petit moteur .Net

qui peut exécuter du code VB.NET et C#.

• Les développeurs Web et les concepteurs graphiques peuvent créer des applications Silverlight de différentes manières. Vous pouvez utiliser le balisage Silverlight pour créer du contenu multimédia et des graphiques et les manipuler avec des langages dynamiques et du code managé. Silverlight vous permet aussi d'utiliser des outils de qualité professionnelle tels que Visual Studio pour le codage et Microsoft Expression Blend pour la disposition et la conception graphique.

Fonctionnalités Silverlight offre les fonctionnalités suivantes :

– WPF et XAML: Silverlight fournit un sous-ensemble de la technologie WPF qui étend considérablement les éléments du navigateur pour la création d'interfaces utilisateur. WPF vous permet de créer de captivants graphiques, animations, contenus multimédia et d'autres fonctionnalités clientes élaborées. Le langage XAML fournit une syntaxe de balisage déclarative pour la création d'éléments

– Extensions de JavaScript: Silverlight fournit des extensions au langage de script de navigateur universel, qui permettent de contrôler l'interface utilisateur du navigateur

– Prise en charge multiplateforme et multi navigateur: Silverlight s'exécute de la même manière sur tous les navigateurs et

plateformes connus

– Intégration avec des applications existantes: Silverlight s'intègre de façon transparente à votre code JavaScript et ASP.NET AJAX pour venir en complément des fonctionnalités déjà créées.

– Accès au modèle de programmation .NET Framework et aux outils associés: Vous pouvez créer des applications Silverlight à l'aide de langages dynamiques et de langages tels que C# et Visual Basic.

– Prise en charge réseau : Silverlight inclut une prise en charge pour HTTP sur TCP. Vous pouvez vous connecter à des services WCF, SOAP ou ASP.NET AJAX et recevoir des données XML ou RSS.

– LINQ: Silverlight inclut LINQ (Language Integrated Query), qui vous permet de programmer l'accès aux données au moyen d'une

syntaxe native intuitive et d'objets fortement typés des langages .NET Framework

Composants de la présentation principale

Fonctionnalité Description

Entrée Gère les entrées de périphériques matériels tels que le clavier et la souris, le

dessin ou d'autres périphériques d'entrée.

Rendu de l'interface

utilisateur

Restitue les graphiques vectoriels, les graphiques de bitmap, les animations et le texte.

Médias Fournit des fonctions de lecture et de gestion pour différents types de fichiers

audio et vidéo, comme les fichiers .WMP et .MP3.

Contrôles Prend en charge des contrôles extensibles qui sont personnalisables par

l'application de styles et la création de modèles.

Deep Zoom Permet de zoomer en avant sur des images haute résolution et de leur

appliquer un mouvement panoramique.

Composants de la présentation principale

Disposition Active le positionnement dynamique des éléments d'interface.

Liaison de données Active la liaison d'objets de données et d'éléments d'interface utilisateur.

DRM Active la gestion des droits numériques pour les ressources multimédias.

XAML Fournit un analyseur pour le balisage XAML.

.NET Framework pour Silverlight

Fonctionnalité Description

Données

Prend en charge les fonctionnalités LINQ (Language-Integrated Query) et LINQ to XML, qui simplifient l'intégration et l'utilisation de données issues de différentes sources. Prend également en charge l'utilisation de classes XML et

de sérialisation pour la gestion des données.

Bibliothèque de classes

de base

Jeu de bibliothèques .NET Framework qui fournissent des fonctions de programmation essentielles, comme la gestion de chaînes, les expressions

régulières, les entrées et sorties, la réflexion, les collections et la globalisation.

Contrôles WPF

(Windows Presentation

Foundation)

Fournit un jeu enrichi de contrôles, notamment Button, Calendar, CheckBox, DataGrid, DatePicker, HyperlinkButton, ListBox, RadioButton et ScrollViewer.

Windows

Communication

Foundation (WCF)

Fournit des fonctionnalités qui simplifient l'accès aux services et données distants. Il s'agit notamment d'un objet de navigateur, d'une requête HTTP et

d'un objet de réponse, de la prise en charge des requêtes HTTP inter-domaines, de la prise en charge des flux de syndication RSS/ Atom, ainsi que

de la prise en charge des services (SOAP…).

CLR (Common Language

Runtime)

Fournit la gestion de la mémoire, le garbage collection, le contrôle de la cohérence des types et la gestion des exceptions.

Fonctionnalités de programmation supplémentaires de

Silverlight

Fonctionnalité Description

Stockage isolé Fournit l'accès sécurisé au système de fichiers de l'ordinateur local à partir du

client Silverlight. Active le stockage et la mise en cache locaux de données isolées pour un utilisateur particulier.

Gestion des fichiers Fournit une boîte de dialogue Ouvrir qui simplifie la création de

téléchargements de fichiers sécurisés.

HTML - Interaction avec

le code managé

Permet aux programmeurs .NET Framework de manipuler directement des éléments d'interface dans le modèle DOM (Document Object Model) HTML

d'une page Web. Les développeurs Web peuvent également utiliser JavaScript pour appeler directement du code managé et accéder à des objets, des

propriétés, des événements et des méthodes scriptables.

Sérialisation Fournit la prise en charge de la sérialisation des types CLR en XML

Bibliothèques XML

Les classes XmlReader et XmlWriter simplifient l'utilisation des données XML à partir de services Web. La fonctionnalité XLINQ permet aux développeurs d'interroger directement les données XML dans les langages de programmation .NET Framework

Empaquetage Fournit la classe Application et les outils de génération qui permettent de créer des packages .xap. Le package .xap contient l'application et le point d'entrée pour le contrôle du plug-in Silverlight à exécuter

Outils de développements

Les applications Microsoft suivantes intègrent des fonctionnalités spéciales pour le développement de Silverlight :

– Microsoft Expression Blend

Cet outil peut servir à créer et à modifier la couche de présentation d'une application en manipulant les contrôles et la zone de dessin XAML, en utilisant des graphiques et en programmant la couche de présentation avec un langage dynamique tel que JavaScript.

– Visual Studio

Visual Studio fournit des outils de productivité qui permettent de développer des applications à l'aide de code managé. Toutes les fonctionnalités existantes de Visual Studio sont disponibles pour Silverlight. En outre, cette version de Visual Studio intègre des fonctionnalités spécifiques de Silverlight, notamment IntelliSense, le débogage et des modèles de projet Silverlight qui permettent de créer et de lier tous les fichiers requis.