HTML Formulare / CGI / JavaScript / Perl

Transcription

Übungen Informatik I
HTML Formulare / CGI /
JavaScript / Perl
http://www.fbi-lkt.fh-karlsruhe.de/lab/info01/Tutorial
http://de.selfhtml.org
Helga Gabler, Stefanie Schwall, Christian Pape
Übungen Informatik 1
1
HTML
Inhalt
•
•
•
HTML Formulare
JavaScript
CGI / Perl
2
HTML
Formulare
•
Formulare (engl.: forms)
–
–
–
–
•
können mit JavaScript bearbeitet werden
Formulardaten können an ein CGI- Programm übergeben werden
werden mit dem <FORM>- Tag eingeleitet
bestehen aus mehreren Kontrollelementen (grafische Objekte auf der
Webseite, die mit der Maus oder Tastatur verändert werden können)
Es folgt ein Screenshot eines einfachen Formulars:
3
HTML
Formulare - Beispiel
Und das ist der Quelltext zum Formular auf der Folie davor:
…
<FORM ACTION="mailto:test@fh-karlsruhe.de" METHOD="post"
ENCTYPE="text/plain">
<TEXTAREA NAME="adresse" COLS="60" ROWS="4">E-MAIL:
1. gahe000@fh-karlsruhe.de
2. scst0051@fh-karlsruhe.de
</TEXTAREA>
<p> Ihre Meinung bitte! </p>
<br> <INPUT NAME="userInfo" TYPE=“text“ SIZE="40" MAXLENGTH="20">
<p> <INPUT TYPE="submit" VALUE="Anfrage senden">
  
<INPUT TYPE="reset“ VALUE="Zurücksetzen">
<P> Bitte teilen Sie uns Ihre Meinung mit und senden sie
mit der Sendetaste ab. </P>
</FORM>
4
HTML
Formulare – Beispiel: Erklärung
<FORM ACTION="mailto:test@fh-karlsruhe.de" METHOD="post" ENCTYPE="text/plain">
Ein Formular wird also mit dem <FORM>- Tag eingeleitet, dieses enthält folgende
Attribute:
- ACTION: gibt den Empfänger der Formulardaten an (es handelt sich hierbei entweder um
ein Programm, das auf dem Server läuft, oder um einen Mail- Client (=“mailto:…“)
- METHOD: gibt die Übertragungsmethode an (get oder post Î nächste Folie)
- ENCTYPE: legt die Form der Codierung fest (wichtig bei action=“mailto:…“)
<TEXTAREA NAME="adresse" COLS="60" ROWS="4">
Mit dem <TEXTAREA>- Tag wird ein mehrzeiliges Eingabefeld erzeugt, es enthält folgendes
Attribut:
NAME: legt eine eindeutige Bezeichnung fest
<INPUT NAME="userInfo" TYPE=“text“ SIZE="40" MAXLENGTH="20">
<INPUT TYPE="submit" VALUE="Anfrage senden">
Mit dem <INPUT>- Tag wird ein einzeiliges Eingabefeld erzeugt, dazu gibt es folgende
Attribute:
TYPE: es legt die Art des Kontrollelements fest

“submit“: Schaltfläche, die den Sendevorgang auslöst

“reset“: Schaltfläche, die das Formular wieder in den Ursprungszustand setzt
VALUE: legt die Beschriftung der Buttons fest
5
HTML
Formulare – Übertragungsmethoden
•
Wie schon erklärt, wird mit dem Attribut METHOD im <FORM>Tag die Übertragungsmethode festgelegt, d. h. wie die
Kommunikation mit dem Empfängerprogramm erfolgt
•
Es gibt zwei Möglichkeiten:
–
–
Æ
GET: Bedeutet für CGI- Programme, dass sie die Daten in einer
Umgebungsvariable über das System des Servers geliefert bekommen
POST: Bedeutet für CGI- Programme, dass eine Tastatureingabe
simuliert wird, d. h. sie erhalten die Daten so, wie wenn sie jemand vor
Ort eintippt. Für E-Mails werden Formulare mit der POST- Methode
vollständig angelegt und abgeschickt
Für E-Mails also immer POST für das Attribut METHOD anzugeben!
6
HTML
Formulare – Formularelemente
•
Ein Formular kann mehrere Elemente haben, diese werden je nach
Informationstyp ausgesucht, z. B. muß der User einen Text
eintippen, oder einfach nur bejahen, bzw. verneinen
•
In HTML stehen spezielle Kontrollelemente zur Verfügung:
•
–
–
–
INPUT- Typen
Beschriftungen
Notizfelder
Beispiel:
<FORM ACTION="mailto:test@fh-karlsruhe.de" METHOD="post"
ENCTYPE="text/plain">
<TEXTAREA NAME=„name“> Notizfeld </TEXTAREA>
<LABEL FOR=„inpname“> Beschriftung </LABEL>
<INPUT ID=„inpname“ VALUE=„senden“ TYPE=„submit“>

</FORM>
7
HTML
Formulare – INPUT- Typen
Sie werden mit dem <INPUT>- Tag erzeugt
Das Attribut TYPE legt fest, welches Element erzeugt wird:
PASSWORD:
<INPUT TYPE="password“ NAME="kennwort“ SIZE=“8“ MAXLENGTH="12">
für die Eingabe nicht erkennbarer Daten (z. B. Passworteingabe: ******)
CHECKBOX:
<INPUT TYPE="checkbox" NAME="zutat" VALUE="salami">Salami<br>
<INPUT TYPE="checkbox" NAME="zutat" VALUE=“Pilze“ checked>Pilze<br>
Æ kleines quadr. Kästchen, das per Mausklick angekr. werden kann
RADIO:
<INPUT TYPE="radio" NAME="Zahlen" VALUE="Visa"> Visa<br>
Æ kleiner runder Kreis, der per Mausklick ausgefüllt werden kann
TEXT: Eingabe num. und alphanum. Daten. Æ rechteckiges Eingabefeld
SUBMIT: Æ Schaltfläche zum Absenden der Formulardaten
RESET: Æ Schaltfläche, die das Formular in seinen Ursprungszustand
zurücksetzt
8
HTML
Formulare – Auswahllisten
•
•
Mit dem <SELECT>- Tag werden Auswahllisten definiert, es gibt folgende
Attribute zu diesem Tag:
–
NAME: Beschriftung
–
SIZE: Anzahl sichtbarer Zeilen
–
MULTIPLE: steuert ob eine Mehrfachauswahl möglich ist
Mit dem <OPTION>- Tag werden innerhalb der <SELECT>- Tags Optionen
aufgelistet, hier gibt es folgende Attribute:
–
SELECTED: zeigt eine Vorauswahl an
–
VALUE: wenn statt des angezeigten Wertes eine andere Information
übertragen werden soll
<SELECT NAME=“Auto“ SIZE=“2“ MULTIPLE>
<OPTION SELECTED> Opel </OPTION>
<OPTION> Ford </OPTION>
<OPTION> VW </OPTION>
</SELECT>
9
HTML
Formulare – weitere Formularelemente
Klickbuttons herkömmlich:
<input type="button" name="Verweis" value="Informatik-Tutorial"
onClick="self.location.href=
'http://www.fbi-lkt.fh-karlsruhe.de/lab/info01'">
Klickbuttons modern:
<button name="Klickmich" type="button" value ="Informatik-Tutorial"
onClick="self.location.href=
'http://www.fbi-lkt.fh-karlsruhe.de/lab/info01'">
<p> <b>Info1 Portalseite</b></p>
</button>
Felder für Datei uploads
<input name="Datei" type="file" size="50" maxlength="100000"
accept="text/*">
Formulare mit CSS formatieren -> selfhtml
10
HTML
Inhalt
•
•
•
HTML Formulare
JavaScript
CGI / Perl
11
JavaScript
Einführung
JavaScript
-
-
wurde 1995 von der Firma Netscape eingeführt und lizenziert
ist kein direkter Bestandteil von HTML, sondern eine
eigene Programmiersprache.
-
wurde zu dem Zweck geschaffen, Web-Seiten zu optimieren.
-
wird client-seitig, zur Laufzeit vom Web-Browser interpretiert.
-
-
JavaScript-Programme werden wahlweise direkt in der HTML-Datei
oder in separaten Dateien notiert.
ECMA-Script: Standardisierte Variante der ECMA (Genf)
Für Web-Seiten, bei denen Information im Vordergrund steht, und die auch
von Suchmaschinen-Robots und Benutzerrandgruppen wie
Sehbehinderten erfasst werden sollen, müssen Sie darauf achten,
JavaScript nur so einzusetzen, dass die Web-Seiten auch ohne
eingeschaltetes JavaScript ordentlich angezeigt werden, und dass die
Navigation zwischen den Seiten auch ohne JavaScript funktioniert.
12
JavaScript
JavaScript-Bereiche in HTML definieren
<html>
<head> <title>Beispiel zum Funktionsaufruf aus einem Tag</title>
</head>
<script type="text/javascript">
<!-alert("Hallo Welt!");
//-->
</script>
<body>
</body>
</html>
//: JavaScript-Kommentar: um Fehlermeldungen in scriptfähigen
Browsern zu unterdrücken
JavaScript-Bereich kann auch im body stehen, üblich ist wie oben
13
JavaScript
Kommentare
Einzeiliger Kommentar
Mehrzeiliger Kommentar
beginnt mit
beginnt mit
endet mit
//
/*
*/
Wichtig um Informationen für Entwickler abzulegen
•
welche Aufgabe hat die Funktion oder
•
Bedingung unter der die Funktion arbeitet
Beachte:
Keine sensitive Informationen (Passwörter), da im Quelltext
für jeden sichtbar
14
JavaScript
Funktionsaufruf über HTML-Tag
<html>
</head>
<!-function Meldedich(text) {
alert(text);
}
//-->
</script>
<body>
<h3>
<a href="javascript:Meldedich('Hallo');">Klicken Sie bitte hier!</a>
</h3>
<a href="javascript:history.back()"> Eine Seite zurück </a>
</body>
</html>
15
JavaScript
Event-Handler
¾ stellen das Bindeglied zwischen HTML und JavaScript dar
¾ reagieren auf bestimmte Tastatur- und Mausereignisse
¾ werden als Attribute in HTML-Tags geschrieben
¾ beziehen sich auf das entsprechende HTML-Element.
¾ sind HTML 4.0 Standard
¾ beginnen immer mit on , zum Beispiel
¾ Notation: EventHandler=“JavaScript-Anweisung“
Bsp.: onClick=“Meldedich(‘Hallo‘)“
<html>
<body>
<form>
<input type=button value="Klick mich"
onClick="alert('er hat es getan!')">
</form>
<a href="funktionen.html"
onmouseover="history.back();"> zurück</a>
</body>
</html>
16
JavaScript
Vordefinierte Objekte
Dass JavaScript eine Erweiterung von HTML ist, liegt vor allem an
den vordefinierten Objekten. Über diese vordefinierten Objekte
können Sie beispielsweise einzelne Elemente eines HTML-Formulars
abfragen oder ändern.
Die JavaScript-Objekte sind in einer Hierarchie geordnet:
window(Browserfenster)
document (Dokument im Browserfenster)
forms, ... (Formular,… im Dokument )
elements
(Formularelemente, z.B. Auswahllisten, Buttons …)
parent
window
frames[]
document
forms[]
location
images[]
elements[]
links[]
anchors[]
17
JavaScript
<html>
<head> … </head>
<body>
<script type="text/javascript„>
var counter = 0;
function doIt() {
counter++;
document.forms[0].elements[0].value=
"Klick " + counter + "!";
}
</script>
<form>
<input type=button value="Klick!" onClick="doIt()">
</form>
</body>
</html>
18
JavaScript
Elemente können auch mit ihren Namen direkt angesprochen werden.
elements
(Formularelemente, z.B. Auswahllisten, Buttons …)
<input type="text" name="email">
Document.forms[0].email.value
19
JavaScript
JavaScript in separater Datei
JavaScript-Datei quadrat.js:
function Quadrat() {
var Ergebnis = document.Formular.Eingabe.value *
document.Formular.Eingabe.value;
alert("Das Quadrat von " +
document.Formular.Eingabe.value + " = " + Ergebnis);
}
HTML-Datei
<html>
<script src="quadrat.js" type="text/javascript">
</script>
</head>
<body>
<form name="Formular" action="">
<input type="text" name="Eingabe" size="3">
<input type="button" value="Quadrat errechnen" onClick="Quadrat()">
</form>
</body>
</html>
20
JavaScript
if / submit (für Aufgabe 2)
<html>
<head>
function checkWort() {
if ( document.forms[0].q.value == "" ) {
alert("Geben Sie einen Suchbegriff ein");
return false;
}
}
</script>
</head>
<body>
<h1>Geben Sie einen Suchbegriff ein</h1>
<form action="http://www.google.de/search" onSubmit="return checkWort() ">
Nummer: <input type="text" name="q"> <p>
<input type=submit value="Suchen">
</form>
</body>
</html>
http://www.home.fh-karlsruhe.de/~pach0003/uebungen/03_html_cgi/test.html
21
JavaScript
Event-Handler - Beispiele
onLoad (beim Laden einer Datei)
Tritt ein, wenn eine HTML-Datei geladen wird.
<body onLoad="NaviFenster()">
<h1>Seite mit "Fernbedienung"</h1>
</body>
onReset (beim Zurücksetzen des Formulars)
function ResetCheck() {
var chk = window.confirm("Wollen Sie alle Eingaben
loeschen?");
return(chk);
}
</script>
<form name="Test" onReset="return ResetCheck()" action="">
onSubmit: (selfhtml)
<form action="onsubmit.htm" onSubmit="return CheckInput();">
22
HTML
Inhalt
•
•
•
HTML Formulare
JavaScript
CGI
23
CGI (Common Gateway Interface)
Einführung
•
Das CGI (= Common Gateway Interface) eines WWW- Servers
ermöglicht es beliebige vorbereitete externe Programme
auszuführen
CGI spezifiziert die erforderlichen Schnittstellen für die Eingabe,
bzw. Weiterleitung von Informationen vom WWW- Client zum
Programm und für die Rückgabe von Informationen an den WWWClient
Die perfekte Sprache für die CGI- Programmierung sind Perl und
PHP
CGI wurde im wesentlichen von folgenden Personen entwickelt:
•
•
•
–
–
–
–
Tony Sanders
Ari Luotonen
George Phillips
John Franks
24
Einführung – Anwendungen
•
Die Hauptanwendung ist die direkte Generierung von HTML- Seiten
aus Informationen, die nicht als HTML- Seiten vorliegen
•
Zum Beispiel:
–
CGI- Programme sind manchmal eine
Schnittstelle zu einer bereits existierenden Datenbank:
•
Sie konvertieren die Eingabe in etwas, das die Datenbank versteht
und
•
sie konvertieren die Ausgabe in etwas, das ein Web- Browser
versteht (z. B. HTML)
–
CGI- Programme ermöglichen die Interaktion mit Benutzern eines
WWW- Servers, z. B. um ein Bestellformular umzusetzen
25
Einführung – Umgebung eines CGI- Programms
26
Einführung – Systemumgebung
•
Hier benutzen wir Perl als Programmiersprache für CGI, da PHP
nicht installiert ist
•
Zum Programmieren braucht man:
–
–
Einen Editor (z. B. Textpad)
Ein Verzeichnis für die CGI- Dateien, das dem WWW- Server bekannt
sein muß (hier an der FH: im .public_html- Verzeichnis):
Æ z. Bsp.: .public_html/cgi/
–
Einen Perl- Interpreter und den Pfad dazu, wo dieses Programm auf
dem Server installiert ist (mit dem Befehl: which perl)
Æ /usr/local/bin/perl
–
Perl- Programmbibliotheken (enden auf .pm): Wichtig ist das PerlModul cgi.pm, das eine Reihe von Funktionen, die das Programmieren
von CGI- Skripten erleichtern, beinhaltet
27
Einführung – Das Modul „cgi.pm“
–
cgi.pm:
- ab Version 5.004 in Standard-Perl-Distribution
- ist von Lincoln Stein;
- ist plattformunabhängig (läuft auf UNIX, Linux, VMS,
Windows, Macintosh ...)
- ist im RZ installiert
–
Informationen (vollständige Dokumentation) und Hilfe über das Modul
findet man im Manual: man CGI (oder perldoc CGI)
Pfadvariable: MANPATH
Die Syntax der CGI-Programme werden unter UNIX lokal getestet, und
erst dann (fehlerfrei) über den Browser aufgerufen.
Damit CGI-Programme in dem aktuellen Verzeichnis gefunden werden,
muss die PFAD-Variable richtig gesetzt sein:
–
Pfad testen:
Pfad setzen:
echo $PATH
export PATH=$PATH:.
Pfadvariable zu perldoc: export PATH=$PATH:/opt/perl5/bin
28
CGI (Perl)
Programmierung
•
Wir werden die Programmierung an dem einfachen Beispiel eines
Formulars erklären:
–
–
–
–
Das Formular selber wird im HTML- Dokument mit den <FORM>- Tag
definiert
Jedes Textfeld dieses Formulars hat einen Namen (NAME) und einen Wert
(VALUE)
Wie schon besprochen, kann ein Formular per Email versendet werden
(ACTION=„mailto:…“)
oder an eine CGI- Anwendung übertragen werden
(ACTION =„http://www.home.fh-karlsruhe.de/~papa0011/cgi/test.cgi“)
Æ Das CGI- Programm wird also im ACTION- Attribut in einem URL
angegeben
Schickt der User jetzt das Formular ab, greift der Browser auf den URL des
CGI- Programms zu, nachdem er einen Abfragestring (query string) an
den URL angehängt hat
29
CGI (Perl)
Programmierung – Der query string
•
Der query string ist eine Zeichenkette, die dem CGI- Programm in der
Umgebungsvariable QUERY_STRING zur Verfügung gestellt wird
Die Angabe des query string kann
•
–
–
•
von Hand erfolgen
vom WWW- Client generiert werden
Der query string besteht aus mehreren Paaren der Form
NAME=VALUE und wird dem Pfad zum CGI- Programm angehängt
Beispiel eines Formulars:
http://www.home.fh-karlsruhe.de/~gahe0001/cgi/Meinungsumfrage.cgi ?
Doz=Paulchen+Panther & Typ=Inhalt & Note=Schlecht &
Doz=Daniel+Duesentrieb &Typ=Inhalt & Note=Gut & User=Daniel &
Email=duda0013 %40 fh-karlsruhe.de
Æ Der query string wird mit ? eingeleitet
Æ Name-/Werte- Paare werden mit & getrennt
Æ Zeichen werden kodiert (@ Î %40)
30
CGI (Perl)
Programmierung – Übertragung
•
Unser URL wird nun vom Web- Server www.fh-karlsruhe.de
empfangen
•
Dieser ruft das CGI- Programm Meinungsumfrage.cgi auf und
übergibt die Namen/Werte- Paare als Argumente, welche vom
cgi.pm automatisch ausgepackt werden, oder-falls das Modul nicht
installiert ist - entsprechend aufgesplittet werden muß.
•
... Nun wird das CGI- Programm ausgeführt
31
CGI (Perl)
Programmierung
Query-String mit CGI-Modul
Das Modul cgi.pm zum Parsen (Analysieren) der CGI- Anfrage wird am Anfang des
CGI- Programms mit folgender Anweisung eingebunden:
use CGI;
Mit dem Modul stehen dem cgi-Programm die Namen/Werte-Paare aus dem Formular
wie folgt zur Verfügung:
...
use strict;
# Deklaration und Quoting erzwingen
use CGI qw(:all);
my( $q, $dozent, $username, $note, $typ, $emailadr);
$q = CGI->new(); # aktuelle Anfrage
$dozent
$username
$note
$typ
$emailadr
$emailadr
…
= $q -> param(„Doz");
= $q -> param(„User");
= $q -> param(„Email");
= $q -> param(„Typ");
= $q -> param("Email");
=~ s/%([a-fA-F0-9][a-fA-F0-9])/\@/g;
32
CGI (Perl)
Programmierung – Das Modul cgi.pm einbinden
•
use CGI;
Mit der use- Anweisung wird ein Code aus einer anderen
Datei zur Compile- Zeit nachgeladen
•
Die Anweisung kann mit optionalen Argumenten versehen
werden, die angeben, auf welche Funktionen und Variablen
zugegriffen wird (vgl. in UNIX können Befehle auch mit
Argumenten versehen werden, z.B. ls -la), z. B. wird der
Zugriff auf die Funktion param() so angegeben: use CGI
qw(param);
•
Die qw- Notation wird verwendet, um die Importliste später
erleichtern zu können
33
CGI (Perl)
Programmierung
•
Query-String ohne CGI-Modul
falls cgi.pm nicht installiert ist, muss der query-String wie folgt
aufgesplittet werden:
...
?Doz=Paulchen+Panther&Typ=Inhalt&Note=Schlecht&Doz=Daniel+Duesentrieb&Typ=
Inhalt&Note=Gut&User=Daniel&Email=duda0013%40fh-karlsruhe.de
$i=0;
foreach $Feld (@Formularfelder) {
($name, $value) = split(/=/, $Feld);-> Doz=... Email=…
$value =~ tr/+/ /;
-> (Transliteration) ersetzt + durch ““
$value =~ s/%([a-fA-F0-9][a-fA-F0-9])/pack("C", hex($1))/eg;
-> %40 -> @
$value =~ s///g;
-> löscht alle Zeichen < ... \n
im ganzen String (g)
$Formularname[$i] = $name;
$Formularvalue[$i] = $value;
$i++;
}
34
CGI (Perl)
Import- Tags
Import- Tags sind Labels (Bezeichnungen) für eine
Gruppe zu importierender Funktionen:
use CGI qw(:cgi);
param()
use CGI qw(:form);
Methoden zur Argument- Verarbeitung wie
Methoden, die Formulare generieren
use CGI qw(:standard); Standardfunktionen (html2, form, cgi)
-
header(): Zeichenkette mit der Zeile Content-type + Leerzeile
start_html(zeichenkette): Zeichenkette als HTML- Title
h1(zeichenkette): Zeichenkette als HTML- Überschrift 1. Ordnung
p(zeichenkette): Zeichenkette als neuer HTML- Absatz
use CGI qw(:shortcuts); Methoden, die HTML- Programme vereinfachen
use CGI qw(:all); alle verfügbaren Methoden
35
CGI (Perl)
Programmierung – Vollständiges CGI- Skript in Perl
ohne cgi-Modul:
#!/usr/local/bin/perl –w
my $Title =“ein skript“;
print “content-type:text/html \n\n“;
print “<html><head><title>Hallo Welt</title></head><body>\n“;
print “<h1>$Title</h1>\n“;
print “<p>Das ist ein einfaches Skript</p>“;
print “</body></html>“;
mit cgi-Modul:
#!/usr/local/bin/perl -w
use CGI qw(:standard);
print header,
start_html(-title=>$TITLE, -bgcolor=>'white'),
h1($TITLE);
print $q -> p, „Das ist ein einfaches Skript</p>“;
print $q -> end_html;
36
CGI (Perl)
Programmierung – Ein einfaches Programm
•
Ein einfaches CGI- Programm um eine dynamische WebSeite zu generieren - „Here-Dokument“:
# !usr/local/bin/perl
# Hallo- Das einfachste aller CGI- Programme
print <<ENDE_des_mehrzeiligen_Textes;
Content-type: text/html
<HTML>
…
ENDE_des_mehrzeiligen_Textes
37
CGI (Perl)
Programmierung – Ein einfaches Programm- Erklärung
•
•
•
•
•
•
•
•
•
•
Mit # wird in Perl ein Kommentar eingeleitet
In der ersten Zeile wird der Pfad zum Perl- Interpreter angegeben
print ist eine Anweisung, die etwas auf dem Bildschirm ausgibt
Jede Anweisung muß mit ; enden
Mit << wird eine Anfangsmarke gesetzt
Die Endmarke (ENDE_des_mehrzeiligen_Textes) leitet ein HEREDokument ein. Sie ermöglicht es, eine mehrzeilige Zeichenkette
auszugeben. Æ erspart also, vor jede Zeile ein print zu schreiben
Die Zeile Content-type: text/html gibt an (Direkt erste Zeile
nach << !), was für eine Art von Ausgabe generiert wird (hier also
ein HTML- Dokument)
Danach muß eine Leerzeile folgen
Dann folgt der HTML- Code, der an den Browser des Users
geschickt, dort formatiert und angezeigt wird
Mit der Zeile ENDE_des_mehrzeiligen_Textes wird die Ausgabe
abgeschlossen
38
CGI (Perl)
Programmierung – Ein einfaches Programm- Beispiel
#!/usr/local/bin/perl
use CGI qw(:standard);
$cgi = new CGI;
$parameter = $cgi->param('parameter');
$inhaltVariable = "Hallo";
print <<ENDE_des_mehrzeiligen_Textes;
Content-type: text/html
<HTML>
<HEAD></HEAD>
<BODY>
<H1>${inhaltVariable}</h1>
${parameter}
</BODY>
</HTML>
ENDE_des_mehrzeiligen_Textes
39
CGI (Perl)
Programmierung – Beispiele
•
CGI- Programme können mit jedem HTML- Dokument
zusammenarbeiten, also nicht nur mit Formularen
Beispiel:
•
–
–
–
Im HTML Dokument steht folgender Link:
<A HREF=„http://www.irgendwo.org/cgibin/fortune.cgi“>Glückskekse verschicken</A>
Das CGI- Programm fortune.cgi enthält nur den Aufruf des fortuneProgramms (Programm, das auf UNIX- Systemen Glückskekse
verschickt)
Î es werden keine Argumente über den URL an das CGI- Programm
gegeben
Mit dem Link:
<A HREF=„http://www.irgendwo.org/cgi-bin/fortune.cgi?date“>
würde das Programm fortune.cgi mit dem Argument date ausgeführt
werden
40
JavaScript
Linkliste
¾
http://www.heise.de/ct/browsercheck/js.shtml
¾
http://java.rrzn.uni-hannover.de/javascript/index.html
¾
¾
¾
¾
„Voodoo JavaScript Tutorial“ und andere Einführungen:
http://rummelplatz.uni-mannheim.de/~skoch/js/script.htm (deutsch)
http://web.urz.uniheidelberg.de/Ausbildung/Unterlagen/JavaScript/einleit.html
http://www.stars.com/Authoring/JavaScript/Tutorial/ (englisch)
Selfhtml:
http://www.teamone.de/selfhtml/
Netscapes neueste JavaScript-Referenz:
http://developer.netscape.com/tech/javascript/index.html
Webbuilding:
http://www.cnet.com (englisch)
41
HTML
Linkliste
•
•
•
•
•
•
Gute Informationen gibt es auf dem Online- Tutorium:
http://www.fbi-lkt.fh-karlsruhe.de/lab/info01/Tutorial/index.htm
Ein sehr gutes Online- Tutorium von Stefan Münz mit sehr vielen
Informationen und Beispielen findet man hier:
http://selfhtml.teamone.de/
Ein guter HTML- Editor von Ulli Meybohm ist hier zu finden:
http://www.meybohm.de
Eine HTML- Einführung von Hubert Partl:
http://www.boku.ac.at/htmleinf/
Die „Goldenen Regeln für schlechtes HTML“:
http://www.karzauninkat.com/Goldhtml/
Ein sehr gutes Buch für den Einstieg ist:
„HTML- Von der Baustelle bis JavaScript“ von Helmut Erlenkötter
erschienen im Juni 2000 im Rowohlt Taschenbuch Verlag (ISBN: 3
499 60085 4)
42
CGI (Perl)
Linkliste
•
•
•
•
•
•
CGI- Einführungskurs mit Perl:
http://userpage.fu-berlin.de/~ahahn/www/cgikurs/index.html
Informationen zum Perl- Modul cgi.pm
http://www.rrz.uni-hamburg.de/RRZ/W.Wiedl/Skripte/CGIPerl/MODUL/CGIMODUL.HTM
http://www.cpan.org
Informationen auch zu PHP:
http://www.php-und-javascript.com
Perl und CGI:
http://www.wiik.de/papers/perl/node1.html
Übersicht über verschiedenste Online- Tutorials
http://www.online-tutorial.de
Übersicht über verschiedenste Online- Tutorials
http://www.online-tutorial.de
43