bd web
DESCRIPTION
BD Web. 1. Introduction au Web 2. Technique de base CGI 3. Les pages actives ASP 4. Les pages active JSP 5. Les pages actives PHP. 1. Qu'est-ce-que le Web ?. Service Internet permettant de naviguer à travers des pages web. - PowerPoint PPT PresentationTRANSCRIPT
1
BD Web
1. Introduction au Web
2. Technique de base CGI
3. Les pages actives ASP
4. Les pages active JSP
5. Les pages actives PHP
2
1. Qu'est-ce-que le Web ?
Service Internet permettant de naviguer à travers des pages web.
HTTP (HyperText Transfer Protocol) est le protocole le utilisé pour envoyer les requêtes et recevoir les pages
HTTP spécifié par le consortium W3C est actuellement à sa version 1.1.
HTTPS est une version sécurisée permettant de crypter les échanges.
3
HTML
Langage dérivé de SGML définissant un jeu de balises fixes pour coder et transférer des documents avec présentations intégrées sur le Web.
Les documents sont liés entre eux par des hyperliens 1-1
Les éléments de données sont marqués par des balises selon leur rôle et mise en forme
4
Principales balises
La balise de début <HTML> elle doit être fermée à la fin du document par </HTML>.
La balise de titre <TITLE> elle permet d’indiquer le titre de la page éditée de manière spéciale par les navigateurs ; se termine après
le titre par une balise </TITLE>. Les balises de niveaux
Exemple: <H1> Bienvenue sur le Web </H1>, <H2> Les BD et le Web </H2>. Les balises de mise en forme
Exemple: <B> Ceci est en gras </B>, <I> Ceci est en italique </I>. Les balises d’intégration d’images et de son
<IMG SRC = "URL de l’image">. Les amarres vers d’autres documents
exemple <A HREF = "URL de l’amarre"> cliquez ici </A>. Les listes non numérotées du type
<UL> <LI> alinea 1 <LI> alinea 2 </UL>. Les listes numérotées du type
<OL> <LI> alinea 1 <LI> alinea 2 </OL>.
5
Exemple (1)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD> <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=iso-8859-1"> <META NAME="GENERATOR" CONTENT="Mozilla/4.06 [fr] (Windows2000; I)
[Netscape]"> <META NAME="AUTHOR" CONTENT="Gardarin"> <TITLE>SYSTEMES D'INFORMATION XML</TITLE></HEAD>BODY> <HR> <H1>SYSTEMES D'INFORMATION XML</H1> <PRE><I>Georges GARDARIN</I></PRE> <HR>
6
Exemple (2)
<P>l'ouvrage de référence
en matière de bases de données et XML.
<BR>présente les points suivants :
<UL>
<LI>XML, origines et évolution, XQuery, optimisation et implantation;</LI>
<LI>concepts de base des services Web, Architecture .NET, Sécurité ;</LI>
<LI>Intégration de données;</LI>
</UL>
Ce livre indispensable présente donc une synthèse très complète des techniques XML.
</BODY>
</HTML>
7
Scénario typique
1.Le navigateur demande l'URL http://www.gardarin.org/test.html au browser.
2.Le client envoie la requête /test.html au serveur HTTP www.gardarin.org.
3.Le serveur reçoit la requête /test.html.
4.Le serveur envoie au client le fichier test.html encapsulé en format MIME.
5.Le client réceptionne l'objet test.html en format MIME.
6.Le navigateur interprète et affiche l'objet test.html.
http://www.prism.uvsq.fr/test.html
GET / test.html
test.html
Text/html … (test.html)blablabla
Serveur HTTP
Client
8
W3C et HTML
W3C Organisme chargé de standardiser les protocoles et langages
relatifs à Internet
HTML 4.01 Dernière version de HTML, les nouveaux développements
portant sur XML (langage à tags ouverts)
DHTML (Dynamic HyperText Markup Language) Ensemble de specs complémentaires au HTML permettant de
rendre une page web dynamique côté client
9
DHTML
Javascript permet d'exécuter des scripts (programmes en texte)
sur le navigateur du client
DOM (Document Object Model) définit une arborescence d'objets représentant la
structure du document permet de manipuler l'ensemble des objets contenus
dans le document (avec Javascript)
10
Feuilles de style CSS
Les feuilles de style (CSS - cascading StyleSheets) permettent de définir de façon annexe au document
les styles de chaque balise peuvent être incluse dans le même fichier ou
référencées. Un même document peut avoir plusieurs styles selon
le terminal d'affichage.
11
Exemple
@import "truc.css"
BODY {
color: #000 ;
background: #FBFBFF ;
margin-left: 9% ;
margin-right: 6% ;
font-family: "Helvetica", sans-serif ;
line-height: 1.35 ;
}
@import "truc.css"
BODY {
color: #000 ;
background: #FBFBFF ;
margin-left: 9% ;
margin-right: 6% ;
font-family: "Helvetica", sans-serif ;
line-height: 1.35 ;
}
[ ... ]TD, TH { font-family: "Helvetica",
sans-serif line-height: 1.35 ;}
H1, H2 { margin-top: 1.2em ; margin-left: -7% ; color: #900 ; clear: both ;}[ ... ]
[ ... ]TD, TH { font-family: "Helvetica",
sans-serif line-height: 1.35 ;}
H1, H2 { margin-top: 1.2em ; margin-left: -7% ; color: #900 ; clear: both ;}[ ... ]
<LINK REL="stylesheet" HREF="fichier.css"><LINK REL="stylesheet" HREF="fichier.css">
12
Limites HTML statique
Maintenance difficile du fait de l'obligation de modifier manuellement chacune des pages
Impossibilité de renvoyer une page personnalisée selon le visiteur
Impossibilité de créer une page dynamiquement selon le contenu d'une base de données
13
Site Web BD
Site Web dynamique partage d ’une base de données globales utilisation de templates côté serveur avec accès SQL standardisation des méta-données et des formulaires accès via SQL optimisé avec indexation du contenu augmentation de la productivité des développeurs
14
Application: Commerce électronique
Présentation de catalogues contact du consommateur exploration des produits
Accès hiérarchique aux description et prix Visualisation multimédia 2 ou 3D, démonstrations
Couplage aux BD de l’entreprise Transactions sur Internet
saisie de la commande paiement sécurisé via Internet
carte de crédit, monnaie digitale, chèque électronique suivi de la commande
15
Les techniques
CGI (Common Gateway Interface) consiste à activer des programmes (généralement écrits en perl ou en
javascript voir en C), puis de leur faire renvoyer un contenu HTML
ASP (Active Server Pages) de Microsoft permet de simplifier l'écriture de tels scripts en manipulant des objets en
VBScript.
JSP (Java Server Pages) permet d'utiliser la puissance de Java pour créer des pages web
dynamiques.
PHP (Hypertext Preprocessor) Langage simple bien adapté au Web
16
ClientServeur Web
Prog. CGI
Page HTML
téléchargement
url longue
Page HTML
donnéesréponse
2. Common Gateway Interface (CGI)
Protocole d’appel dynamique de programme sur un serveur Web depuis un client Surcouche de HTTP pour passer des paramètres Programmes ou scripts invoqués par CGI
17
Scénario
Bases dedonnées
Scripts
d'application
ServeurHTTP
Navigateur
Passerelle
.
...
Serveur d'application
SQL
Param
HTMLUrl Longue/cgi-bin/p?param
HTML
p
18
Vue Synthétique
19
Qu'est-ce que l'interface CGI ?
Définition et propriétés standard de programmation pour accéder aux données des
formulaires HTML côté serveur la passerelle invoque les scripts en passant les paramètres sous
une forme codée un processus séparé est activé à chaque appel de programme
L'envoi de paramètres à un script CGI se fait par l'intermédiaire d'un formulaire HTML. créé à l'aide de la balise <FORM> contenant des boutons, des
champs, des listes et/ou des cases à cocher repérés par les noms de paramètres, et un bouton de soumission du formulaire
20
Exemple de Formulaire
<HTML><HEAD><TITLE> Exemple de formulaire</TITLE></HEAD><BODY><H1>Exemple de formulaire</H1><FORM METHOD=POST ACTION="/cgi-bin/invite.exe">Nom: <INPUT TYPE=TEXT SIZE=30 NAME="nom"><BR>Adresse e-mail: <INPUT TYPE=TEXT SIZE=20 NAME="email"><BR><P>Commentaires:<BR><TEXTAREA COLS=60 ROWS=15 NAME="comment"></TEXTAREA><INPUT TYPE=SUBMIT VALUE="OK"></FORM> …
21
Variables d'environnement
Données stockées dans des variables permettant au programme d'avoir des informations sur son environnement
Informations sur le serveur DATE_GMT, DATE_LOCAL
Date actuelle au format GMT et local DOCUMENT_ROOT
Racine des documents Web sur le serveur HTTP_HOST
Nom de domaine du serveur SERVER_SOFTWARE
Type (logiciel) du serveur web ...
22
Informations sur le client
CONTENT_LENGTH Longueur du corps de la requête
CONTENT_TYPE Type de données du corps (format
MIME)
HTTP_COOKIE Cookie du client si jamais un
cookie est effectivement présent sur le disque du client
HTTP_REFERER URL de la page qui a appelé le
script CGI
HTTP_REQUEST_METHOD Méthode d'appel (GET, POST, ...)
HTTP_USER_AGENT Navigateur et OS du client
PATH chemin d'accès au script CGI
PATH_INFO chemin d'accès au script CGI
QUERY_STRING Paramètres du script
REMOTE_ADDR Adresse IP du client appelant le
script CGI
23
Get ou Post ?
GET envoie les paramètres du formulaire via l'URL en ajoutant l'ensemble des paires nom/valeur à l'URL du script,
séparé de celui-ci par un point d'interrogation, ce qui donne une URL longue (limitée à 255 caractères) du type: http://nom_du_serveur/cgi-bin/ script.cgi?
champ1=valeur1&champ2=valeur2... passe les données dans la variable QUERY_STRING
POST code les données de la même manière mais envoie les données à la suite des en-têtes HTTP, dans un champ
appelé corps de la requête les données présentes dans le corps de la requête sont
accessibles via le fichier de flux d'entrée standard STDIN
24
Les scripts serveur
Programme ou script (fichier de commandes) capable de recevoir des paramètres depuis des clients, d’accéder à une ou plusieurs sources de données de générer des résultats sous forme HTML ou XML.
Langages de scripting ou de programmation Interprété ou compilé Perl, JavaScript, VB Script, Python C, C++, Java, VB, C#, L4G
25
Exemple de Script Perl
#! /usr/local/bin/perl print "content-type : text/html\n\n"; // Fixe le format MIME print "<HTML>"; print "<HEAD>"; print "<TITLE>Hello world</TITLE>"; print "</HEAD>"; print "<BODY>"; print "Hello world!"; print "</BODY>"; print "</HTML>";
26
CGI – évaluation
Avantages utilisable avec n’importe quel navigateur et serveur Web simple - intégré avec HTML serveurs dans tous les langages
Inconvénients supporte mal le multi-utilisateur pas de gestion de contexte (session)
Extensions version« fast CGI »
27
3. Les ASP de Microsoft
Standard mis au point par Microsoft en 1996 Développement d'applications Web dynamiques Intégration de scripts serveur au sein d'une page HTML à
l'aide de balises spéciales Compilés avec la version .NET
Environnement de programmation côté serveur permettant de représenter sous forme d'objets les interactions
entre le navigateur du client, le serveur web, ainsi que les connexions à des bases de données via SQL (ADO)
28
Déclaration et Exemple
Intégration de scripts dans des pages HTML ou XML
<SCRIPT language="VBScript|Jscript" [runat="server|client"] [type="text/vbscript | jscript"] [src="url"] > code du script </SCRIPT>
<% code du script %> Impression du texte et
interprétation du code par le serveur d’ASP
Exemple simple:<%@ LANGUAGE="VBSCRIPT" %>
<HTML>
<HEAD><TITLE>Exemple de script ASP</TITLE>
</HEAD>
<BODY>
<% FOR i = 1 to 10 %>
Bienvenue au cours BD Web
<% Next %>
</BODY>
</HTML>
29
Exemple d’accès BD
Intégration indirecte des requêtes
nécessite un script dialogue avec les formes,
boutons, tables, ... émission des requêtes récupération des résultats
Accès par objets VBScript Accès à la base via des ADO Création d’objets données
<HTML><%
Vin=Request.QueryString("NumVin")Set NObj=Server.CreateObject("VINS.NumVin") if NObj.GetCru(Vin)=False then
Server.Redirect("NumVin/entryform.htm")
%><H1> VIN CHOISI :<%=NObj.Cru%> </H1> <TABLE><TR><TD>Degre</TD><TD>Millesime</
TD><TD>Region</TD></TR><TR><TD><%=NObj.Degre%></TD><TD><%=NObj.Mill%></TD><TD><%=NObj.Region%></TD></TR></TABLE><H2> DATE DE SELECTION : <%=time()%><
%=date()%></H2></HTML>
30
Objets d'environnement
31
4. Les JSP du monde Java
Possibilité de définir des documents mixtes HTML Java (Scriptlets) Appel de servlet (balise <servlet>) Communication par des variables Utilisation de tags <% … %> (similaire aux ASP)
Compilés en Servlet Lors de la première utilisation Prise en compte automatique des mises à jour
Possibilité d'intégrer des JavaBeans
32
Exemple de JSP
Intégration de Java dans HTML
Directives de pages importation de packages sessions demandées buffers et threads
Possibilité de variables globales
Facilités d'éditions expressions Java converties objets textes et flots binaires
PrintWriter OutputStream
<HTML><HEAD><TITLE> Exemple de JSP </TITLE></HEAD><BODY><!-- Fixer les parametres de la page --><%@ page language = "java" %><!-- Declarer une variable caracteres --><% char c = 0; %><!-- Scriplet - Code Java --><% for (int i = 0; i < 26; i++) { c = (char) (0x41 + i) ;%><!-- Afficher c --><% = c %><% } %></BODY></HTML
33
Objets d'environnements
Objet Description
request Objet contenant la requête du client
responseObjet contenant la réponse de la page JSP. Généralement inutilisé (HTML en flux de sortie)
pageContext Objet contenant des informations sur l'environnement du serveur
session Objet contenant la session en cours
application Objet contenant le contexte de servlet
out Objet contenant le flux de sortie
config Objet contenant la configuration de la servlet
page Objet désignant la page elle-même
exception Objet représentant une exception non interceptée
34
Les servlet Java
Servlet Moteur multi-thread d'exécution de classe côté serveur Approche API objet (e.g., services, httprequest) L’utilisateur surcharge de méthodes standards Dialogue au-dessus de HTTP, RMI, … via CGI améliorée
Accès aux BD JDBC : interface type ODBC (CLI RDA) depuis Java SQLJ : incorporation d'ordres SQL dans Java pré-compilés
35
Architecture Servlet
ServletContainer
Create Thread Pool
Instantiate Servelet
Call init() methodHTTP Request
Allocate Thread Call service() method
Do service()
Return ResponseFree Thread
HTTP Response Terminate Thread Pool
Call destroy() method
Mécanisme d ’exécution de services
au-dessus de HTTP Multithreads et performant dispatcher de requêtes HTTP
Génération de contenus HTML
format MIME supportés JPEG, GIF, etc.
36
Accès BD : JDBC
// ConnexionConnection con =
DriverManager.getConnection(url);// Création d'une instructionStatement statement = con.createStatement();// Exécution d'une requeteString query = "SELECT * FROM Employés";ResultSet resultset = statement.executeQuery(query);// Traitement des résultatswhile(resultset.next()) {System.out.println(resultset.getString(2) + " " +
resultset.getString(3)); }// fermeture de la connexioncon.close();}
Application Serveur dedonnées
Base dedonnées
SQL
ResultSet
37
5. PHP de Apache (Open Source)
Langage de scripts intégré aux pages HTML
Les scripts PHP sont entre balises <?php .. … ?>
Possibilité de récupérer les variables de formulaires HTML
$variable
Exemple :<html>
<head> <title>Hello World</title>
</head> <body> <?php echo "Hello world"; ?> </body>
</html>
38
Gestion de formulaires en PHP
PHP transforme tous les champs en variables d' environnement (globales) Directement accessibles par nom Également accessibles dans les tableaux associatifs
$HTTP_POST_VARS et $HTTP_GET_VARS : suivant la méthode d' envoi GET ou POST
Attention: Il ne faut pas avoir deux zones de formulaires avec le
même nom sur la même page
39
Accès aux BD
Méthode similaire quelque soit le SGBD: Oracle, Sybase, DB2, MS SQL Server MySQL, PostgreSQL, InterBase Pilote ODBC
Il faut suivre la séquence : 1.Connexion 2.Requête 3.Exploitation des résultats 4.Fermeture de la connexion
40
Exemple : insertion d’un vin
Saisie du numéro, cru et millésime par une forme HTML
Insertion dans MySQL en PHP<?php mysql_connect("localhost","root","");
$connexion_reussi=mysql_selectdb("test"); if (!$connexion_reussi) echo "Connexion râtée";
mysql_query("insert into vins (num, cru, date) values ('$num', '$cru', NOW()) ") or die("Impossible d'insérer le vin");
echo "Merci"; ?>
41
6. Bilan Pages Actives
Mixage HTML + scripts serveur
Compilés en code intermédiaire ou interprétés
Accès aux BD intégrés Évolution vers XML
séparation fond et forme complément à XSL