Chapitre 1. Généralités sur les e- services

Transcription

1 Chapitre 1. Généralités sur les e- services Module de e-services Master 1. Télécom Mars 2011 FEI-USTHB 1

2 Introduction Grâce à des serveurs connectés et une bonne bande passante, des postes clients se connectent pour constituer la toile ou le WEB (World Wide Web) Tout le monde peut créer sa page web et des contenus web Quelle est alors la technologie sousjacente du web? FEI-USTHB 2

3 LES BASES DU WEB Le Web fait appel à un certain nombre de concepts de base. Les trois plus importants sont : L architecture Client-serveur L adresse URL où se trouve le serveur de données ou d applications L Hypertexte FEI-USTHB 3

4 Connexions à Internet Connexion directe Modem Réseau Téléphonique Adaptateur Réseau Numérique Internet Internet Fournisseur d'accès FEI-USTHB 4

5 Plusieurs possibilités de Connexions à Internet Par connexion directe (LAN) pour les réseaux locaux Par Fournisseur d accès : Modem Par Routeur et adaptateur avec protocole TCP/IP et Modèle OSI FEI-USTHB 5

6 Réseaux Locaux, Internet, Application du Web FEI-USTHB 6

7 Modèle TCP/IP - OSI FEI-USTHB 7

8 Transition Réseaux locaux Internet Applications Web FEI-USTHB 8

9 Infrastructure Internet Réseau mondial de réseaux interconnectés Les échanges suivent les protocoles : TCP (Transmission Control Protocol), orienté "connexion". Lorsqu'une machine A envoie des données vers une machine B, la machine B est prévenue de l'arrivée des données, et témoigne de la bonne réception de ces données par un accusé de réception. Le contrôle CRC des données intervient. UDP (User Datagram Protocol) est un protocole non orienté connexion de la couche transport du modèle TCP/IP, il ne fournit pas de contrôle d'erreurs et, IP (Internet Protocol) FEI-USTHB 9

10 Services sur Internet Internet : principaux services Web & E- Mail Web Bon démarrage Puissance d accès impressionnante Mais aussi participation illimitée Connaître les techniques sous-jacentes Action FEI-USTHB 10

11 I. Les Bases du Web FEI-USTHB 11

12 Architecture Client-Serveur Le Web s appuie sur la notion d architecture client-serveur Un Serveur est une machine puissante qui fournit des services (données, applis) Des programmes tournent en permanence : ce sont des serveurs web ou http. FEI-USTHB 12

13 Architecture Client-Serveur Chaque ordinateur connecté a une adresse IP ou un nom symbolique / nom de domaine Le programme client (navigateur) se connecte au programme serveur (serveur web) grâce au protocole TCP/IP et établit une connexion bidirectionnelle fiable pour accéder à des informations (document, image, ) FEI-USTHB 13

14 Architecture Client-Serveur Réponse Client TCP/IP Serveur Requête FEI-USTHB 14

15 Architecture Client-Serveur Les postes clients font tourner, un programme client pour les requêtes de services. Ce client est un navigateur web qui cherchera des pages web à partir d un serveur web Serveur : Machine & Démon Le Daemon ou démon correspond au service rendu; c est un programme qui tourne en tâche de fond sur une machine ou répond à des requêtes si nécessaire, ou déclenche certaines actions en réponse à des évènements ou un planning. FEI-USTHB 15

16 Applications du client-serveur au Web (HTTPD) Protocole : (HyperText Transfer Protocol) Serveur : HTTPD (Démon HTTP) Pages Web Multi-connexion FEI-USTHB 16

17 Architecture Client-Serveur Les documents sont échangés sous le protocole HTTP (HyperText Transfer Protocol) et le daemon qui se charge de répondre aux requêtes : HTTPD Client : Machine cliente & Logiciel Client, 2 cas : Soit le client cherche à visualiser une page sur sa machine alors le navigateur va chercher le fichier correspondant FEI-USTHB 17

18 Architecture Client-Serveur Soit l utilisateur veut accéder à une page distante alors le navigateur doit se connecter au serveur distant à travers le réseau. FEI-USTHB 18

19 Applications du client-serveur au Web (HTTPD) FEI-USTHB 19

20 L URL Une page web doit être localisée. La notation URL (Universal/Uniform Resource Locator) a été développée pour repérer une source de données Repérer une page, une image? Sources de données de forme complexe Service Source de données Utilisateur Mot de passe Serveur Port FEI-USTHB 20

21 L URL Dans le cas de la page web, l'url contient le nom du protocole d accès au fichier (HTTP, HTTPS), le nom du serveur (adresse IP ou nom symbolique), le chemin d accès au fichier et le nom du fichier : <Protocole> ://<nom serveur>/<chemin> Exemples : e_spin_s_invite_en_electronique_dans_nos_ordinateurs <Service>:[//][Nom][:Pass][@]<serveur>:<port>/<chemin> FEI-USTHB 21

22 L URL : cas du web Minuscules et Chiffres Les séparateurs /. et # sont parfois réservés Séparateur particulier pour les recherches :? Problème de maintenance car si un URL change il faut mettre à jour tous les liens qui l utilisent FEI-USTHB 22

23 Technologie du web : HTTP HyperText Transfer Protocol Assurer le transfert des données hypermédia Rappel du schéma de Dialogue : Connexion (TCP/IP) (URL) Requête (description service) (HTTP & URL) Réponse (résultat / erreur) (HTTP) Fin de la connexion FEI-USTHB 23

24 Dialogue Connexion (TCP/IP) Requête (description service) Réponse (résultat / erreur) Fin de la connexion Application Client = Navigateur en local ou en réseau Google Chrome, Firefox, Internet Explorer, Lynx, Opera, Mosaic, Fonctionnalités communes & Plug-in, Langages FEI-USTHB 24

25 Dialogue par HTTP Le navigateur Web client établit une connexion TCP avec le serveur Web qui contient la page qui l'intéresse. Une fois la connexion établie, le client émet une requête HTTP contenant une commande, une URL, Lorsque le serveur Web reçoit la requête il essaie d'exécuter la commande qu'elle contient. Il retourne ensuite comme réponse le résultat obtenu qui peut être des données, un message d'erreur, etc. Une fois que le client a reçu sa réponse la connexion est fermée et détruite. FEI-USTHB 25

26 Hypertexte et Topologie du Web Hypertexte & Hypermédia texte, son, image, vidéo dynamique & événementiel Langage Utilisé : HTML Insertion de Liens utilisant URL Topologie : Information distribuée au sein d une même page Liens tout azimut & Multiples chemins Toile d araignée FEI-USTHB 26

27 Illustration de l Hypertexte et de la Topologie du Web FEI-USTHB 27

28 Technologie du web : HTML Utilisé depuis Il a été longtemps le language standard d'édition de pages hypertexte pour le Web. Le web a été initialement construit par le CERN Il permet d accéder à un large ensemble de ressources d information accessible par le réseau Internet. Versions disponibles : HTML 4, HTML 5, XHTML FEI-USTHB 28

29 Technologie Web : HTML Un document hypertexte est essentiellement textuel, dynamique et parfois interactif. HTML permet de donner à certains mots la qualité d hyperlien ou lien constitué d une adresse URL que l on peut atteindre en cliquant dessus et qui permet d avoir des informations éparpillées sur la toile : on dit qu elles sont distribuées sur le réseau Internet FEI-USTHB 29

30 Technologie Web : HTML Page Web = Fichier Texte = Portabilité Avec le son et les images hypermedia. FEI-USTHB 30

31 Technologie Web : HTML Le document hypertexte est balisé avec le langage HTML langage à balises Balise : mot clef/commande désignant l effet exemple : B pour Bold (gras) Table pour Tableau Balise : zone d influence Balise ouvrante <Mot_clef> : début de zone Balise fermante </Mot_clef> : fin de zone FEI-USTHB 31

32 Technologies du Web : HTML - Exemples Exemple de Balisage Je suis une étudiante de M1 en télécoms option CM Code: Je suis une <I>étudiante</I> de M1 en télécoms option <B>CM</B> FEI-USTHB 32

33 HTML - Attributs Attributs Exemple: grand <FONT SIZE+=2> très grand</font> grand Résultat: grand très grand grand FEI-USTHB 33

34 Technologies du Web : HTML - Liens Exemple: Je suis un étudiant de M1 Télécom Code: Je suis un étudiant de <A HREF=" M1Télécoms</A> FEI-USTHB 34

35 HTML l ossature <html> <head> <title>page de F.Boumghar</title> </head> <body> <h1> Bienvenue sur le site de F.Boumghar! </h1> <p><h2> Le bonjour de votre Professeur de e- services du Master 1 Télécom </h2> </p> </body> </html> FEI-USTHB 35

36 Affichage de l ossature sur page web test.html tableau-binome-ssgp1-dria aitouti.html dellys boualem_bouredji amir.html Université des Sciences et de la Technologie HOUARI BOUMEDIENE.htm ongwara.html Test1.html FEI-USTHB 36

37 Concept del hypertexte Editer des liens. Un lien permet de créer une référence vers une autre page en utilisant l'url de celle-ci. Ex : "Je suis étudiant à l'université." et que je ne veux plus du mot en gras mais je veux créer un lien partant du mot 'Université' et pointant sur la page Je suis étudiant à l'<a HREF=" Sa réalisation à l'écran sera probablement "Je suis étudiant à l'université." 7 Mars 2011 FEI-USTHB 37

38 II. Le web 2.0 Plateforme contenant des informations stockées dans des bases de données distribuées Syndication de contenus et de services FEI-USTHB 38

39 Technologies du web 2.0 Logiciel de serveur Apache 2.2 Fil RSS (syndication de contenu) Des navigateurs Des applications diverses FEI-USTHB 39

40 Parts de marché pour Apache..\Biblio\serveurs-web de-parts-demarche-pour-apache.shtml Parts de Marché en Logiciel de serveur (Juillet 2009) FEI-USTHB 40

41 Les outils 2.0 Protocoles de communication : Asynchrones : Mail, Forum, wiki Synchrones : Chat Blog ou journal Réseaux sociaux Les fils de syndication de format RSS ou Really Simple Syndication, pour la veille documentaire Format d'échange de données, défini en XML version 1.0. FEI-USTHB 41

42 Fils RSS On peut recueillir des données de sources multiples dans ce format. On désigne les sources par fil ou flux RSS. Les navigateurs récents peuvent directement lire des fichiers RSS, mais on peut aussi utiliser un logiciel spécialisé que l'on appelle lecteur RSS ou aggrégateur ( FEI-USTHB 42

43 Pourquoi utiliser RSS? Pour faire de la veille et recueillir l'actualité ou les informations fournies par des sites web, sous une forme exploitable par des ordinateurs. Pour l'afficher sur un site ou simplement la lire si vous êtes utilisateur final. Et pour l'éditeur à l'origine du contenu, cela permet de faire connaître les nouvelles de son site. FEI-USTHB 43

44 Comment publier le contenu de son site dans un flux RSS? Moyens de générer un flux RSS : Utiliser la librairie RSS de PHP, ce qui suppose une génération dynamique des pages. On utilisera un script en PHP, qui produira le code HTML affiché sur la page. Utiliser un outil d'extraction de texte. FEI-USTHB 44

45 Comment publier le contenu de son site dans un flux RSS? (suite) Pour faire connaître l'existence d'un flux RSS, une balise de lien est utilisée XML ou RSS <a type="application/rss+xml" href=" Flux RSS de cette page</a> Les flux au format Atom (plus interopérable que RSS), utilisent la valeur: "application/atom+xml". Remplacez xul.fr par le nom de domaine de votre site. FEI-USTHB 45

46 Site web Le web 2.0 est défini par son contenu. Un site peut-être considéré comme relevant d'une approche web 2.0 s'il utilise de manière privilégiée les techniques suivantes : Cascading Style Sheets CSS ou feuilles de style en cascade pris en charge par les navigateurs, balisage XHTML ; XHTML se fonde sur la syntaxe définie par XML des microformats pour réutiliser le contenu existant comme les métadonnées; (adresses, ) FEI-USTHB 46

47 Site web (suite) techniques d applications riches telles qu AJAX ; syndication (une partie d'un site est accessible depuis d'autres sites) et agrégation de contenu RSS/Atom[1] ; catégorisation par étiquetage (classification basée sur l indexation); utilisation appropriée des URL ; architecture REST ou services web XML. [1] L'appellation Atom se réfère à deux standards liés. Le Format de Syndication Atom est un format de document basé sur XML conçu pour la syndication de contenu périodique, tel que les blogs ou les sites d'actualités. Le Protocole de Publication Atom (APP) est un protocole simple basé sur HTTP pour la création et la mise à jour de ressources Web. FEI-USTHB 47

48 CSS ou pages de style CSS (Cascading Style Sheets) est un format de données utilisé pour créer des feuilles de styles attachées aux pages web. Il est utilisé dans les applications Web pour dissocier le contenu - changeant - des pages web de leur présentation qui est constante. FEI-USTHB 48

49 CSS CSS permet de réaliser des économies sur les communications entre le serveur et le navigateur web et mettre en place une charte graphique. FEI-USTHB 49

50 Du Web 2.0 avec style grâce au CSS3 Avec CSS3, la propriété border-radius arrondit les angles de n importe quel élément HTML. CSS3 opacity pour la gestion de l'opacité La transparence enfin maîtrisée! Les arrière plans multiples avec CSS background pour appliquer plusieurs images d'arrière-plan sur le même élément, sans devoir en imbriquer plusieurs. FEI-USTHB 50

51 CSS3 et PAO Plusieurs colonnes : De la P.A.O. sur le Web? Les propriétés column-width et columngap vont générer une mise en page sous forme de colonnes multiples, où le texte va s'écouler automatiquement d'une colonne à la suivante. FEI-USTHB 51

52 Les ombrages La propriété box-shadow crée un ombrage solide ou dégradé sur tous les éléments HTML exemple-ombrage-box-shadow-css.html FEI-USTHB 52

53 AJAX (Asynchronous Javascript and XML) Manière de construire des applications web et des sites web dynamiques basés sur diverses technologies Web : Javascript, CSS, XML, le DOM (Document Object Model) et le XMLHttpRequest (objet ActiveX ou Javascript) Les applications Ajax fonctionnent sur tous les navigateurs web En utilisant Ajax, le dialogue entre le navigateur et le serveur se déroule ainsi : un programme écrit en langage de programmation Javascript, incorporé dans une page web, est exécuté par le navigateur. Celui-ci envoie des demandes au serveur Web, puis modifie le contenu de la page actuellement affichée par le navigateur Web en fonction de la réponse reçue du serveur, évitant ainsi la transmission et l'affichage d'une nouvelle page. Ajax permet de modifier partiellement la page affichée par le navigateur pour la mettre à jour sans avoir à recharger la page entière. Par exemple le contenu d'un champ de formulaire peut être changé, sans avoir à recharger la page avec le titre, les images, le menu, etc. FEI-USTHB 53

54 Architecture REST REST est l'acronyme de «Representational State Transfer» REST définit un ensemble de contraintes sur les systèmes hypermedia distribués comme le WWW afin d optimiser les qualités désirées comme : la séparation des tâches, la simplicité, la généricité ou les performances réseaux. REST fournit un véritable modèle pour décrire le fonctionnement que devrait avoir le web aujourd hui. Le Web en général et tous les sites qui ont du succès avec plus de cent millions de visiteurs par mois comme Google, Yahoo, Ebay et Amazon utilisent le style d'architecture REST et le proposent comme méthode privilégiée pour intégrer leurs services Web dans les applications des utilisateurs. FEI-USTHB 54

55 Exemples de sites basés «web 2.0» Réseau social : Facebook En juillet 2010, il rassemble plus de 500 millions de membres à travers la planète3, Début janvier 2011, Facebook a été valorisé 50 milliards de dollars américains Wikipédia : bases de connaissance construites collaborativement sur un wiki Site commercial : ebay ( algerie, Timbres, Collections sur ebay - Achetez, vendez!.htm FEI-USTHB 55

56 Did you know 2.0 () Dans les 8 prochaines secondes, combien de naissances (34) En Inde? (5) En Chine (4) Aux USA (1) Quel sera le monde pour eux? Did you know ure=related FEI-USTHB 56

57 Did you know 2.0 En UK en 1900, une seule université En 2006 le nb d étudiants en graduation : 1.3 Million aux USA ; 3.1 Million en Inde et, 3.3 Million en Chine. Combien d étudiants en Inde parlent en anglais : 100% Dans 10 ans, il est prévu que le numéro 1 parlant anglais dans le monde sera la CHINE Qui aurait prévu cela il y a 60 ans? Il y a 40 ans? Il y a 20 ans? A quelle date le premier message texte commercial a été transmis? (Décembre 1992) Quel est le nombre de messages textes commerciaux (envoyés et reçus) aujourd hui (> à la population de la terre) En quelle année, Internet a commencé à être utilisé largement par le grand public? (début 1995) Quels sont les revenus annuels de e-bay en 2006? ($6 Billions). E-Bay a été créé en Combien de recherches sur Google ont été réalisées en un mois (2.7 billion FEI-USTHB 57

58 Did you know 2.0 Le changement est survenu! Nous sommes entrain de préparer les étudiants à des métiers et des technologies qui n existent pas afin de résoudre des problèmes qui n en sont pas encore. «Nous ne pouvons résoudre des problèmes en utilisant le même type de réflexion utilisée lorsque nous les créons» - Albert Einstein Il y a des étudiants en Australie, en Autriche, au Bengladesh et aux USA qui : Se rappellent ; Comprennent ; Appliquent ; Analysent ; Evaluent ; Créent ; Communiquent ; Collaborent. Sur des projets, chaque jour. La discussion a démarré en Aout 2006 et elle se poursuit encore ; en Juin 2007, 5 million de conversations dans le monde ont été initiés et se poursuivent sur le site shifthappens.wikispaces.com Voir Did you know 4.0 FEI-USTHB 58

59 Quel est le Pays qui : Sera le plus riche dans le monde? Le plus fort militairement? Le centre du monde des affaires et des finances? Aura un système d éducation le plus fort? Dont la devise sera le standard de valeur mondial? Qui aura le plus haut standing de vie? FEI-USTHB 59

60 Sites existants en Algérie? Sommes-nous/Trophees-Med-IT (CMS) Voir e-algérie version béta (décembre 2009) FEI-USTHB 60

61 Indicateurs TIC en Algérie Equipements publics pour 1000 habitants (Cyber café, Taxiphones, Cabines téléphoniques publiques) Densité téléphonique pour 100 habitants Equipements informatiques et de communication (Taux de foyers ayant un ordinateur pour 100 foyers et Proportion de la population possédant un équipement TV pour 100 habitants) FEI-USTHB 61

62 Indicateurs TIC en Algérie indicateurs Equipements informatiques éducation, Enseignement supérieur et Formation Professionnelle Accès à internet abonnés résidentiel (Taux d accès à internet haut débit pour 100 habitants, Taux d accès à internet bas débit pour 100 habitants) Accès internet abonnés professionnel (entreprise) Tarifs d accès internet FEI-USTHB 62

63 Indicateurs TIC en Algérie Usage personnel Internet bas débit Usage professionnel d internet Voir le site mptic.dz : TIC,15 FEI-USTHB 63

64 Indicateurs TIC en Algérie Présentation de l indicateur Désignation Chiffres en valeur absolue Chiffres en valeur relative Indicateur 1 : Cyber café "Equipements publics Taxiphones pour 1000 habitants (Cyber café, Taxiphones, Cabines téléphoniques publiques)". AT Cabines publiques de téléphones ORIA TOTAL FEI-USTHB 64

65 Références Bibliographiques E-Service Intelligence, K. Janusz, Lu Jie Z.Guangquan, R. Da., Springer Berlin Heidelberg EN63 rest-choisir-la-bonne-architecture-web-services.html "Architectural Styles and the Design of Network-based Software Architectures", Thèse, Roy Thomas Fielding, 2000 FEI-USTHB 65