Remerciez-le!

Remerciez @Admin pour avoir partagé cet document gratuitement, de la manière la plus simple, en partageant sur les réseaux sociaux.

Licence p_ARSSI Prof : S .Alaoui 2016/2017 Plan Introduction au web Http Ser

Licence p_ARSSI Prof : S .Alaoui 2016/2017 Plan Introduction au web Http Serveurs web Environnement de développement La passerelle CGI Les langages de programmation du web Les servlets Les JSP  Le modèle MVC 2 Lp_ARSSI Programmation web avancée Introduction au web et http L'Internet est un très grand réseau permettant de nombreuses chose différentes : Envoyer des mails, des fichiers , communiquer de manière instantanée. On désigne par web l'ensemble des sites offrant un contenu public (avec éventuellement des restrictions d'accès). 3 Lp_ARSSI Programmation web avancée Le World Wide Web (WWW), littéralement la « toile (d’araignée) mondiale », communément appelé le Web, et parfois la Toile, est un système hypertexte public fonctionnant sur Internet. Le Web permet de consulter, avec un navigateur, des pages accessibles sur des sites. L’image de la toile d'araignée vient des hyperliens qui lient les pages web entre elles. 4 Lp_ARSSI Programmation web avancée Introduction au web Le Web n’est qu'une des applications d’Internet ; distincte d’autres applications comme : • le courrier électronique, • La messagerie instantanée, • et le partage de fichiers en pair à pair. Le Web a été inventé par Tim Berners-Lee et Robert Cailliau plusieurs années après Internet, mais c’est lui qui a rendu les médias grand public attentifs à Internet. 5 Lp_ARSSI Programmation web avancée Introduction au web Le World Wide Web est désigné par de nombreux noms et abréviations synonymes :  WorldWideWeb, World Wide Web, World-wide Web, Web, WWW, W3, Toile d’araignée mondiale, Toile mondiale, Toile. Bien que « mondial » s’écrive world-wide ou worldwide en anglais, l’orthographe World Wide Web et l’abréviation Web sont maintenant bien établies. 6 Lp_ARSSI Programmation web avancée Introduction au web Le web La navigation sur le web se fait à l'aide d'un logiciel particulier que l'on appelle navigateur. Il peut s'agir par exemple :  Mozilla,  Opera,  Lynx Internet Explorer Ces navigateurs permettent (dans la théorie) d'accéder de manière semblable à différents contenu. 7 Lp_ARSSI Programmation web avancée Le contenu des pages web est matérialisé sous formes de différentes pages que l'on peut consulter les unes à la suite des autres.  La manière dont ces pages sont organisées et aussi affichées chez la personne les regardant, est définie par des langages de description qui seront abordés ensuite. Parmi toutes ces pages, on en distingue principalement deux types :  Celles statiques  Celles qui sont dynamiques. 8 Lp_ARSSI Programmation web avancée Le web Sites statiques le mécanisme de fonctionnement le plus simple :  Les URL correspondent à un fichier renvoyé par le serveur web.  Le contenu des pages d'un site statique ne dépend donc pas de variables telles que la date ou de bases de données.  Pour changer le contenu d'une page, il est nécessaire de changer le contenu du fichier.  les visiteurs peuvent seulement voir le contenu du site mais pas y participer. 9 Lp_ARSSI Programmation web avancée Pour les réaliser, seuls les langages dits de « frontend » Le HTML : permet d'écrire le contenu de sa page. Le CSS : permet de la décorer. JavaScript : permet d'ajouter du dynamisme du côté du navigateur ( des animations graphiques). 10 Lp_ARSSI Programmation web avancée Sites statiques Sites dynamiques  Un contenu qui peut évoluer dans le temps. Des programmes Tournent du côté des serveurs (backend) pour générer les pages du site.  Peuvent se servir de bases de données ( autres sources de données ) pour composer les pages qui seront affichées dans le navigateur. Ce dynamisme apporte des fonctionnalités que ne peuvent offrir les sites dits statiques. exple : les visiteurs peuvent y participer (commentaires sur un blog...). 11 Lp_ARSSI Programmation web avancée Pour les réaliser, on a également besoin de HTML, CSS et de JavaScript, côté serveur utilisent d'autres langages qui peuvent créer dynamiquement les pages :  Java,  C#,  PHP,  Ruby,  Python, etc... Leurs rôles est d'analyser les requêtes des visiteurs pour ensuite fabriquer une réponse adaptée. 12 Lp_ARSSI Programmation web avancée Sites dynamiques Le HTML et les pages statiques  Le langage HTML (HyperText Markup Language). Le standard pour la diffusion de documents sur le web Définir la présentation du document  Les liens hypertextes vers d'autres documents à l'aide de balises de formatage. Le W3C, l'organisme chargé de standardiser les normes relatives à internet a actuellement (début 2001) spécifié la version HTML 4.01. 13 Lp_ARSSI Programmation web avancée Un ensemble de langages complémentaires au HTML et permettant de rendre une page web plus dynamique : Le langage HTML 4.0 ou supérieur Le Java script , permettant d'effectuer des opérations sur le navigateur du client . Le DOM (Document Object Model) définissant une arborescence d'objets représentant la structure du document. Le DHTML (Dynamic HyperText Markup Language) 14 Lp_ARSSI Programmation web avancée web et http  Le terme « web » désigne le service internet permettant de naviguer à travers des pages web.  Le protocole utilisé pour ce type de communication est le protocole HTTP (HyperText Transfer Protocol), ce qui explique le fait que vous saisissiez des URL commençant par http://. Le protocole HTTP en est actuellement à sa version 1.1 (spécifié par le consortium W3C). 15 Lp_ARSSI Programmation web avancée Les protocoles Rendent possible le dialogue entre des machines différentes Un protocole de communication définit : l'ensemble des procédures (ou règles) pour réaliser une communication : ➢ Le dictionnaire : les primitives (demande connexion, acquittement, ➢ Le scénario du dialogue : enchaînement des primitives (diagramme de l'échange) ➢ Les modalités : taille et représentation des informations, temps d’attente, etc … ➢ Les messages échangés : les différents champs (taille et contenu) 16 Lp_ARSSI Programmation web avancée Protocole HTTP Le Protocole HTTP ( HyperText Transfert Protocol ) la couche Application,  orienté texte (ASCII), basé sur TCP. deux spécifications la 1.0 et la 1.1 un client web (navigateur par exemple) un serveur (apache par exemple). 17 Lp_ARSSI Programmation web avancée Le protocole HTTPS (protocole HTTP sécurisé) : L'utilisation de systèmes de commerce électronique Un protocole sécurisé Permettant de chiffrer les requêtes échangées entre le navigateur et le serveur. 18 Lp_ARSSI Programmation web avancée Protocole HTTP Un serveur web Un serveur web peut :  héberger les ressources qu’il dessert,  les récupérer sur des hôtes distants,  délivrer ces ressources telles quels( ressources statiques),  modifier en fonction de différents critères ( ressources dynamiques). 19 Lp_ARSSI Programmation web avancée Un serveur web peut être : Un hôte spécialisé, Une partie d'une infrastructure spécialisée ou bien encore un hôte plus généraliste. Site web, L'ensemble des ressources HTTP associées à un nom de domaine et un ou plusieurs noms d'hôtes. Adresse web • Une URL de page web, • Ecrite sous une forme simplifiée limitée à un nom d’hôte. • Prévue pour accueillir les visiteurs. Un serveur web 20 Lp_ARSSI Programmation web avancée Environnement de développement Un ensemble d'outils et de procédés destinés à assister et formaliser le travail de création de logiciels. L'objectif créer des outils qui assistent les développeurs dans toutes les étapes de la réalisation du logiciel: définition, conception, programmation, test et maintenance. 21 Lp_ARSSI Programmation web avancée Ces outils tiennent également compte des différents rôles au sein d'une équipe de programmation: programmeur, manager, et responsable qualité Environnement de développement 22 Lp_ARSSI Programmation web avancée Comporte typiquement les outils nécessaires : analyser, écrire, et déboguer.  Les différents outils ont un look and feel identique et peuvent être interconnectés. Exp : possible d'ouvrir l'éditeur de texte ou le compilateur à partir du débogueur voire de modifier le code source en cours de débogage directement depuis le débogueur. un programme 23 Lp_ARSSI Programmation web avancée  Editeur de texte incorporé, avec la possibilité de le substituer par un autre éditeur.  Comporte typiquement des fonctions de mise en évidence alignées avec le langage de programmation:  Indentation automatique des blocs de code,  Marquage des délimiteurs (parenthèses ou accolades),  Mise en évidence des mots clés du langage par de la couleur ou des caractères gras. Environnement de développement 24 Lp_ARSSI Programmation web avancée Environnement de développement Un environnement de développement peut également comporter les outils suivants : un outil de création d'interface graphique. un outil pour réaliser automatiquement des tests. des outils d'analyse du code source. Par exemple un générateur de graphique qui permet d'obtenir le diagramme en arbre de l'utilisation d'une fonction du programme. 25 Lp_ARSSI Programmation web avancée Un moteur de recherche qui tient compte du langage de programmation: Des outils destinés à assister aux opérations préliminaires à la programmation. Un outil de contrôle de versions. Un tel outil permet à plusieurs programmeurs de travailler simultanément sur les fichiers de code source du programme7 Environnement de développement 26 Lp_ARSSI Programmation web avancée Environnements de développement intégré Un ensemble d'outils destinés à programmer dans un langage donné, qui sont distribués ensemble.  Il permet de manipuler les outils de programmation depuis une interface graphique simplifiée.  Il existe au moins autant d'environnements de développement intégré qu'il existe de langages de programmation  uploads/s3/ cours-web.pdf