docIntroduction - Service web
download 
Plainte Transcription
Introduction - Service web
IFT1148 – Introduction
Michael Blondin
Direction de l’enseignement de service en informatique
Université de Montréal
Hiver 2011
1 / 17
HTML
Le HTML (ou XHTML) est un langage de balisage permettant
de décrire des pages Web.
Exemple
<html>
<head>
<title>Ma page</title>
</head>
<body>
Bonjour tout le monde!
</body>
</html>
2 / 17
Fureteurs
Un fureteur (ou navigateur Web) est un logiciel qui permet de
consulter des pages Web (ex : Firefox, Explorer, Chrome, Safari).
Lorsqu’une page Web est accédée sur un fureteur, celui-ci
communique avec le serveur pour obtenir son code et l’affiche
ensuite à l’écran.
3 / 17
Développement de pages Web
Le développement de pages Web en HTML (XHTML) peut être
fait avec deux types de logiciels :
Éditeur de texte (ex : Notepad, Emacs, vi).
Éditeur HTML avec interface graphique ; dit « WYSIWYG »
(ex : Expression Web, Dreamweaver, FrontPage).
4 / 17
Développement : éditeurs de texte
Avantages :
Souvent plus rapide lorsque l’utilisateur est expérimenté.
Permet d’éviter du code superflu.
Plus flexible.
Parfois plus simple d’obtenir une page compatible avec un
certain fureteur.
Désavantages :
Plus lent lorsque l’utilisateur est débutant.
Parfois laborieux pour certaines tâches complexes.
5 / 17
Développement : éditeurs HTML
Avantages :
Plus rapide lorsque l’utilisateur est débutant.
Permet souvent de générer du code complexe aisément.
Désavantages :
Souvent plus lent lorsque l’utilisateur est expérimenté.
Moins flexible.
6 / 17
Pages Web statiques
Une page Web statique est composée d’un fichier HTML (fichier
« .html ») et son contenu ne change jamais.
Lorsqu’une telle page Web est accédée dans un fureteur, les
opérations suivantes sont exécutées :
1
Le fureteur envoie une requête au serveur.
2
Le serveur envoie le code de la page demandée au fureteur.
3
Le fureteur transforme le code et affiche la page à l’écran.
7 / 17
Pages Web dynamiques
Une page Web dynamique est une page dont le contenu est
modifié en fonction de certains facteurs.
Il y a deux types de pages dynamiques : celles utilisant la
programmation côté client ou côté serveur.
Exemple
Quelques exemples de pages dynamiques :
Un moteur de recherche utilise de la programmation côté
serveur.
Une page Web permettant de convertir des mesures du
système métrique au système impérial utilise typiquement de
la programmation côté client.
8 / 17
Pages Web dynamiques
Les scripts écrits en programmation côté client sont exécutés
par le fureteur (ex : JavaScript) ; la page Web n’a donc pas à
être rafraîchie.
Les scripts écrits en programmation côté serveur sont exécutés
par le serveur (ex : ASP.NET, PHP, JSP) ; la page Web doit
donc être rafraîchie.
Il existe des façons de combiner ces deux paradigmes (ex :
AJAX).
9 / 17
Pages Web dynamiques de type « côté serveur »
Lorsqu’une telle page Web est accédée dans un fureteur, les
opérations suivantes sont exécutées :
1
Le fureteur envoie une requête au serveur.
2
Le serveur remarque que la page est dynamique et exécute le
code source qui lui est associé.
3
La page générée est envoyée au fureteur par le serveur.
4
La page est affichée à l’écran.
10 / 17
ASP.NET
ASP.NET est un ensemble de technologies permettant de
développer des sites Web dynamiques.
Il permet d’utiliser plusieurs langages de programmation (ex :
C#, VB.NET).
Il existe depuis janvier 2002 et est le successeur d’ASP. Sa
plus récente version (avril 2010) est ASP.NET 4.0.
11 / 17
ASP.NET
Une page ASP.NET est (normalement) constituée d’un fichier
« .aspx »et d’un fichier de code (ex : « .cs », « .vb »).
Le premier fichier contient l’information à propos du contenu de la
page comme dans un fichier HTML. Le second contient le code
source associé à la page Web.
12 / 17
ASP.NET : exemple simple
Considérons la page ASP.NET suivante contenant un champ de
saisie, un bouton et une étiquette. Lorsque l’utilisateur entre son
nom et appuie sur le bouton, son nom est affiché.
Exemple
13 / 17
ASP.NET : exemple simple
Après avoir appuyé sur le bouton, nous obtenons le résultat suivant.
Exemple
14 / 17
ASP.NET : exemple simple
Le fichier « .aspx » associé à cette page est le suivant :
Exemple
<html xmlns=‘‘http://www.w3.org/1999/xhtml’’>
<head runat=‘‘server’’>
<title>Exemple</title>
</head>
<body>
<form id=‘‘Formulaire’’ runat=‘‘server’’>
<asp:TextBox ID=‘‘Entree’’ runat=‘‘server’’ />
<asp:Button ID=‘‘Bouton’’ runat=‘‘server’’
onclick=‘‘Bouton_Click’’ Text=‘‘Afficher’’ />
Mon nom est: <asp:Label ID=‘‘Nom’’ runat=‘‘server’’ />
</form>
</body>
</html>
15 / 17
ASP.NET : exemple simple
Le fichier « .cs » associé à cette page est le suivant :
Exemple
public partial class _Exemple : System.Web.UI.Page
{
protected void Bouton_Click(object sender, EventArgs e)
{
Nom.Text = Entree.Text;
}
}
16 / 17
ASP.NET : exemple simple
Lorsque l’usager appuie sur le bouton, les opérations suivantes sont
exécutées :
1
Une requête est envoyée au serveur.
2
Le serveur exécute le code C#.
3
Une page HTML est générée à partir du fichier « .aspx ».
4
La page est envoyée au fureteur.
17 / 17
