JAVASCRIPT et CGI en 2 leçons

Transcription

JAVASCRIPT et CGI en 2 leçons
JAVASCRIPT et CGI
en 2 leçons
Leçon n°2 : CGI
Plan
❚
❚
❚
❚
❚
❚
Qu’est-ce que CGI ? où et comment ...
Les langages usuels des CGI
Les variables d'environnement CGI
La gestion des entrées
La gestion des sorties
Traitement d'un formulaire
❚ Différences entre CGI et …
❚ Présentation du TP
Ph. Leray
CGI
1
Qu’est-ce que CGI ?
❚ CGI = Common Gateway Interface
❚ Passerelle entre le serveur Web et l'utilisateur
❙ ex : traitement d'un formulaire
transfert des données du
navigateur formulaire au serveur
formulaire
formulaire
merci! !
merci
1
appel d'un script CGI
serveur
2
script
CGI
3
sortie du script CGI
Ph. Leray
CGI
2
Où utiliser CGI ?
❚ CGI = Passerelle entre l'utilisateur et des
données présentes sur le serveur
❙ bases de données
❙ fichiers de données divers (mail, …)
❚ Scripts
❙ appelés dans les pages HTML
❙ situés et exécutés sur le serveur
➨ Création dynamique de pages HTML
Ph. Leray
CGI
3
Comment utiliser CGI ?
❚ Choix du langage de script
❙ selon le serveur
❙ selon les fonctionnalités offertes par le langage pour
❘ interagir avec le serveur
• obtention des variables systèmes, …
❘ interagir avec les données
• manipulation de fichiers texte
• faire des requêtes SQL
• produire des graphiques, …
Ph. Leray
CGI
4
Les langages usuels des CGI
❚ Perl
❘
❘
❘
❘
Unix, Windows, MacOs
Outil puissant de manipulation de textes
Utilisation de commandes systèmes proches d'Unix
Extensions :
• pour l'écriture rapide de CGI (CGI.pm)
• la manipulation de graphiques (GD.pm)
• manipulation de bases de données
– SQL: Sprite
– Oracle: DBI
– Sybase : sybperl
• ...
Ph. Leray
CGI
5
Les langages usuels des CGI
(suite)
❚ C, C++
❘
❘
❘
❘
Unix, Windows, MacOs
Langage "universel"
langage compilé … pas besoin d'interpréteur sur le serveur
Besoin de librairies spécifiques pour avoir des fonctionnalités
intéressantes :
• écriture rapide de CGI
• création de graphiques (GD)
• manipulation de bases de données
– SQL:
– Oracle:
– ...
Ph. Leray
CGI
6
Les langages usuels des CGI
(fin)
❚ Shell (ex: Bash)
❘ Unix
❘ Utilitaires de manipulation de texte (sed, awk)
❘ Besoin de programmes supplémentaires pour traiter
certaines variables systèmes (ex: uncgi), pour la
manipulation de bases de données, graphiques, …
❚ Tcl
❘ Unix
❘ Fonctionnalités intéressantes (BD, graphique, …)
❚ Applescript
❘ MacOS
❚ Visual Basic
Ph. Leray
❘ Windows
CGI
7
Stockage et contenu des CGI
❚ Sécurité "serveur" :
❙ le serveur ne peux pas permettre l'exécution de
n'importe quel script
❙ les scripts "autorisés" sont rangés dans un (ou
plusieurs) répertoire(s) cgi-bin
❘ ex sur servasi :
webmaster : home/webasi/cgi-bin
étudiants : home/etud/asi99/pub/cgi-bin
(cgi)
(etudcgi)
❘ pour exécuter un cgi "webmaster" prog.pl
http://servasi.insa-rouen.fr/cgi/prog.pl
❘ pour exécuter un cgi "étudiant" prog2.pl
http://servasi.insa-rouen.fr/etudcgi/prog2.pl
Ph. Leray
CGI
8
Stockage et contenu des CGI
(fin)
❚ Sécurité "programmeur" :
❙ vos scripts ne doivent pas permettre l'exécution
de n'importe quelle commande système
(genre rm -r, format…)
Ph. Leray
CGI
9
Variables d'environnement CGI
❚ Informations fournies par le serveur
❙ client
❘
❘
❘
❘
nom / IP de la machine
types MIME reconnus
URL du document précédent
données envoyées, …
❙ serveur
❘ version CGI
❘ nom / IP du serveur, ...
Ph. Leray
CGI
10
Variables d'environnement
(suite)
❚ Exemple Perl
#!/usr/bin/perl
# Infos sur le serveur
print "Content-type: text/html\n\n";
print "<HTML>\n";
print "<HEAD><TITLE>About this Server</TITLE></HEAD>\n";
print "<BODY><H1>About this Server</H1>\n<HR><PRE>";
print "Server Name: ", $ENV{'SERVER_NAME'}, "<BR>\n";
print "Running on Port: ", $ENV{'SERVER_PORT'}, "<BR>\n";
print "Server Software: ", $ENV{'SERVER_SOFTWARE'}, "<BR>\n";
print "Server Protocol: ", $ENV{'SERVER_PROTOCOL'}, "<BR>\n";
print "CGI Revision: ", $ENV{'GATEWAY_INTERFACE'}, "<BR>\n";
print "<HR></PRE>\n</BODY></HTML>\n";
exit (0);
Ph. Leray
CGI
11
Variables d'environnement
(fin)
❚ Exemple Bash
#!/bin/bash
echo "Content-type: text/html"
echo ""
echo "<HTML>"
echo "<HEAD><TITLE>About this Server</TITLE></HEAD>"
echo "<BODY><H1>About this Server</H1>"
echo "<HR><PRE>"
echo "Server Name: $SERVER_NAME <BR>"
echo "Running on Port: $SERVER_PORT<BR>"
echo "Server Software: $SERVER_SOFTWARE <BR>"
echo "Server Protocol: $SERVER_PROTOCOL <BR>"
echo "CGI Revision: $GATEWAY_INTERFACE<BR>"
echo "<HR></PRE>"
echo "</BODY></HTML>"
Ph. Leray
CGI
12
Les types MIME
❚ MIME = Multipurpose Internet Mail Extensions
❙ A l'origine : description du contenu des mails
❙ Maintenant : description du contenu d'un document
❚ Quelques types MIME courants :
❙
❙
❙
❙
❙
Ph. Leray
text/html
text/plain
image/gif
image/jpeg
audio/x-wav
Document HTML
Fichier texte
Image Gif
Image JPEG
Fichier son Windows *.wav
CGI
13
Gestion des entrées
❚ Entrées = données issues du formulaire HTML
❚ Deux types d'envoi de formulaire
❙ GET
❘ Envoi des données dans la requête HTTP
http://moteur.de.recherche/cgi-bin/search.pl?key=XXX
❘ la variable QUERY_STRING récupère les données
❙ POST
❘ Envoi des données dans un "flux" d'entrée (STDIN)
❘ la variable CONTENT_LENGTH donne la taille des données
❘ il faut que le script lise le flux STDIN pour récupérer les données
❙ Comment connaître la méthode utilisée ?
❘ la variable d'environnement REQUEST_METHOD
Ph. Leray
CGI
14
Gestion des entrées
(fin)
❚ Attention à l'encodage des données
❙ les données sont codées pour ne pas interférer
avec l'URL
❙ les caractères spéciaux (espace, symbole, …) sont
remplacés par leur code ISO 8859
❘ / devient %2F
❘ l'espace devient %20
➨ il faut penser à décoder les entrées d'un CGI si
nécessaire
Ph. Leray
CGI
15
Gestion des sorties
❚ La sortie d'un script CGI peut prendre
différentes formes :
❙ HTML
❙ graphique
❙ PS, PDF …
❘ (il faut vérifier que le navigateur accepte les types MIME
correspondants)
❙ Commandes HTTP diverses…
Ph. Leray
❘
❘
❘
❘
Content_length
Content_type
Expires
...
: nb d'octets
: type MIME de la sortie
: date d'expiration dans le cache
CGI
16
Gestion des sorties
(suite)
❚ Ex de sortie HTML simple (Perl):
#!/usr/bin/perl
# hello.cgi
print "Content-Type: text/html\n\n";
print
print
print
print
print
print
Ph. Leray
"<html> <head>\n";
"<title>Hello, world!</title>";
"</head>\n";
"<body>\n";
"<h1>Hello, world!</h1>\n";
"</body> </html>\n";
CGI
type MIME
de la sortie
création d'un
fichier HTML
classique
17
Sortie graphique
❚ Le script CGI peut appeler
❙ un utilitaire
❙ une bibliothèque graphique
pour "construire" une image en fonction des
données
❚ Exemple d'utilisation :
❙ statistiques de connexions
❙ compteur graphique
❙ ...
Ph. Leray
CGI
18
Sortie graphique
(suite)
❚ Exemple d'utilitaires :
❙ interpréteurs Postscript (Ghostscript, …)
❘ puissant, mais lourd à utiliser !
❙ librairie graphique gd (accessible avec Perl, Tcl, C)
❘ assez puissant, bien pour les figures simples
❘ pas besoin d'interpréteur/utilitaire externe
❙ Gnuplot
❘ bien pour le tracé de graphiques
❘ produit une image au format ppm que le CGI doit
transformer en gif (utilitaire unix = ppmtogif)
❙ Problème actuel : les interpréteurs ne créent plus
d'image gif ...
Ph. Leray
CGI
19
Traitement d'un formulaire
❚ Exemple Bash+uncgi
(formulaire HTML)
…
<form action="http://servasi.insa-rouen.fr/cgi/uncgi/formulaire.sh"
name="" method=get>
Nom : <input type="text" name="nom" size=40 maxlength=200>
<BR>
Prénom : <input type="text" name="prenom" size=40 maxlength=200>
<BR>
Profession : <input type="text" name="profession" size=40 maxlength=200><BR>
Société : <input type="text" name="societe" size=40 maxlength=200>
<BR>
E-mail : <input type="text" name="email" size=40 maxlength=200>
<BR>
Remarques : <textarea name="remarques" cols="40" rows="10"></textarea> <BR>
<input type="submit" value="Envoyer">
<input type="reset" value="Effacer">
</form>
Ph.
Leray
CGI
...20
Traitement d'un formulaire
❚ Exemple Bash+uncgi
(script 1/2 : traitement)
#!/bin/bash
# Script de reception d'un formulaire HTML
# Ph. Leray - avril 2000
mail -s "Inscription Entree Libre" asi<<__EOF__
Nom : $WWW_nom
Prenom : $WWW_prenom
Profession : $WWW_profession
Societe : $WWW_societe
E-mail : $WWW_email
Remarques : $WWW_remarques
__EOF__
… à suivre
Ph. Leray
CGI
traitement des données
recues = envoi d'un mail à
asi contenant toutes les infos
le programme uncgi (appelé
avant le script) traite la variable
CGI QUERY_STRING et crée
des variables systèmes
correspondant aux zones du
formulaire
21
Traitement d'un formulaire
❚ Exemple Bash+uncgi
(script 2/2 : sortie HTML)
… suite
echo "Content-type: text/html"
echo ""
echo "<HTML>"
echo "<H1>Confirmation</H1>"
echo "<BR>$WWW_nom $WWW_prenom : "
echo "Inscription bien recue"
echo "<BR><BR>Merci !<BR><BR>"
echo '<A HREF="http://servasi.insa-rouen.fr/actualite/jtasi.html">'
echo "Retour à la page d'Entrée Libre</A>"
echo "<BR><BR><BR><BR><BR><BR><BR><BR><BR>"
echo "</HTML>"
Ph. Leray
CGI
message de
réception du
formulaire
envoyé à
l'utilisateur
comme résultat
du CGI
22
Différence entre CGI et …
❚ Javascript :
❙ script inclus dans le HTML
❙ exécuté par le navigateur client
❚ CGI :
❙ script hébergé par le serveur HTTP
❙ exécuté par le serveur
❙ renvoie un document au navigateur
Ph. Leray
CGI
23
Différence entre CGI et …
❚ SSI : "Server Side Includes"
❙ directives inclues dans le fichier
HTML "d'origine"
❙ exécution des directives par
<HTML>
le serveur lorsque la page
<HEAD><TITLE>Test SSI</TITLE></HEAD>
est demandée
<BODY>
Serveur :
❙ le client ne voit que le
<!---#echo var="SERVER_NAME"-->
résultat de la directive
<BR>Utilisateur :
<!--#echo var="REMOTE_HOST"-->
❙ directives limitées :
❘ affichage de variables
d'environnement
❘ inclusion de fichiers
❘ exécution d'un script CGI !
Ph. Leray
CGI
<BR>Heure locale:
<!--#echo var="DATE_LOCAL"-->
<BR>Modification:
<!--#echo var="LAST_MODIFIED"-->
</BODY>
</HTML>
24
Différence entre CGI et …
❚ ASP : "Active Server Page"
(Microsoft)
❙ directives inclues dans le fichier
HTML "d'origine"
❙ exécution des directives par le
serveur lorsque la page est
demandée
❙ le client ne voit que le résultat
de la directive
❙ directives puissantes
❘ langage de programmation
mélange de Javascript, Visual Basic
Script…
Ph. Leray
CGI
25
Différence entre CGI et …
❚ PHP : "Personal Home Page"
❙ directives inclues dans le fichier
HTML "d'origine"
❙ exécution des directives par
<HTML>
le serveur lorsque la page
<HEAD><TITLE>Test PHP3</TITLE></HEAD>
est demandée
<BODY>
Utilisateur :
❙ le client ne voit que le
<? echo $REMOTE_ADDR ?>
résultat de la directive
<BR><BR>
<H2>Exemple de fichier html avec du
❙ directives puissantes !
❘ langage de programmation
évolué
❘ interaction BD
❘ graphique
Ph. Leray
CGI
PHP</H2>
<PRE>
<? include "test-php3.ph3" ?>
</PRE>
</BODY>
</HTML>
26
Présentation du TP
❙ 1 : un compteur en mode texte
❙ 2 : formulaire de sondage
❘ 2.a : création du formulaire + traitement des données
❘ 2.b : affichage du résultat
❙ 3 : suivi des connexions d'une 1ère page
❘ 3.a : récupération des données :navigateur, page précédente…
❘ 3.b : affichage des résultats récapitulatifs
❙ 4 : envoi de mail au webmestre par un formulaire
❙ 5 : livre d'or
❘ 5.a : création du formulaire + sauvegarde du résultat
❘ 5.b : consultation du livre d'or
❙ 6 : annuaire (fichier texte, pas de BD)
❙ ???
Ph. Leray
CGI
27
Bibliographie
❚ Livres de référence :
❙ Programmation CGI - S. Gundavaram (O'Reilly)
❙ Perl in a Nutshell
❚ Tutoriels on-line :
❙ liste de tutoriels : http://www.edelweb.fr/
EdelStuff/EdelPages/AdminW3/cours_cgi.html
❙ Cours, scripts, … : http://cgi.xhtml.net/
❙ Tout sur les CGI :http://www.cgi-resources.com/
❙ Tout sur Perl : http://www.cpan.org/
❙ Tout sur PHP : http://fr.php.net/
❚ Exemples on-line :
❙ site d'O'Reilly : http://www.editions-oreilly.fr/
Ph. Leray
CGI
28

Documents pareils