Der große Vorteil dynamischer Webseiten ist die Möglichkeit, auf bestimmte
Anforderungen (z.B. Wünsche und Anfragen der BesucherInnen) flexibel zu reagieren.
Hier wird vorgestellt, wie die Daten zur Steuerung eines Scripts (Parameter) eingegeben
und gesendet werden. Eingabe und Absenden der Daten kann wahlweise manuell, teil- oder
vollautomatisch erfolgen.
HTML-Links kann man an Texte, Bilder und an die meisten anderen
Objekte knüpfen. Ein Klick auf das vom
<a>...</a>-Element umschlossene Objekt löst das Ereignis
(Event) onclick aus.
Wenn mit dem href-Argument eine Web-Adresse, ein Verzeichnis
(Ordner) oder eine Datei angegeben ist, dann versucht der Browser, das Ziel zu laden.
Wenn nach dem Namen des Ziels Daten angegeben sind, das können
diese gelesen werden, falls es sich dabei um ein Programm handelt.
Als Ziel kann man alternativ auch ein ↓ Javascript-Programm angeben.
In den Beispielen rechts werden Daten mit HyperLinks übergeben, d.h. ohne ein
HTML <form>-Element.
Die Daten werden nach einem ?-Zeichen an den Dateinamen
angehängt - Allerdings muss man alle in den Daten enthaltenen Sonderzeichen
→
URI-codieren.
So lassen sich häufig verwendete Daten besonders rasch und bequem absenden.
Bewegen sie die Maus über die Links und sehen sie dabei auf die Status-Zeile
ihres Browsers.
Klicken sie die Links und sehen sie die Reaktion des Ziel-Scripts.
►
Unicode-Zeichen werden doppelt codiert: Zuerst
→ HTML, danach
→ UTF8. Dazu muss die Webseite im Zeichensatz charset=utf-8 angelegt sein,
was in jedem Fall empfehlenswert ist.
Beispiel: Ä (Unicode u00C4) wird im HTML-Quelltext des Absenders
zu Ä und als UTF-Code %C3%84 übertragen.
Dieses Beispiel zeigt, wie leicht man auf Client-(AnwenderInnen)-Seite unerwartete,
unerwünschte oder sogar gefährliche Daten absenden kann. ►
Das erste Beispiel sendet potentiell gefährliche HTML-Befehle in den Daten des
vorhandenen Felds txt1 ►
Das zweite Beispiel sendet Daten, die im Options-Feld bgc
gar nicht vorkommen. ►
Das dritte Beispiel sendet Daten eines Feldes hack,
das im Formular gar nicht vorkommt.
Testen sie die Reaktion der Ziel-Seite (auch als Anregung für Tests eigener Ziel-Seiten). ►
Absenden von (potentiell gefährlichem) HTML-Code
Mit → Javascript
Programmen kann man den aktuellen Inhalt (value) jedes Formular-Felds
lesen und/oder schreiben. Hier wird das Argument p in das HTML ↑
Formular-Feld txt1 eingetragen.
Mit Methode submit() wird das Formular gesendet.
Jede Webseite kann beliebig viele Formulare (mit verschiedenen Namen) enthalten, die mit
Javascript frei programmierbar sind.
Alternativ kann man mit der open()-Methode ein neues Fenster öffnen -
wenn dabei ein (PHP)-Script adressiert wird, kann man wie oben für HTML-Links gezeigt Daten
nach der Adresse und einem ?-Zeichen übergeben.
function js_sub(p) {
document.testform.txt1.value = p;
document.testform.submit();
}
Klicken sie einen Link zur Live-Demonstration: ► Sendet einen fixen Text:
Javscript-Programme spielen eine wichtige Rolle bei der
↓ Validierung.
Man verlagert diese wichtige Arbeit auf den Client-PC (Browser) und spart damit
viel kostbare Server-Zeit.
Unabhängig davon muss man am Server die erhaltenen Daten zur Sicherheit
prüfen und filtern.
Validierung von Formular-Daten vor dem Absenden
Jedes (PHP)-Empfangs-Script muss die erhaltenen Daten vor der Verwendung prüfen.
Bei fehlerfreien Daten muss das Empfangs-Script am Server nur einmal laufen.
Wenn jedoch Daten-Fehler entdeckt werden, dann wird ein Korrektur-Zyklus in Gang gesetzt:
Eine eigene Webseite mit der Fehlermeldung wird zurückgesendet, dazu nochmals das
Eingabe-Formular.
Der Zyklus von Eingabe, Prüfung und Fehlermeldung wird so lange fortgesetzt,
bis die/der AnwenderIn zulässige Daten sendet oder abbricht. Jeder kennt derartige
lästige Stituationen, in denen der Server mit den eingetragenen Daten ewig
unzufrieden ist.
Dabei wird der Server erheblich belastet. - Server-Zeit ist kostbar !!!
Professionell erstellte Formulare werden daher immer bereits auf
AnwenderIn-Seite geprüft (validiert): ▲
Die fixe Eingabe-Taste <input type="submit">
wird durch einen <button> außerhalb (!) des
Formular-Elements ersetzt. Dieser startet ein Javascript Validierungs-Programm. ▲
Javascript kann die Daten jedes Formular-Felds lesen und bei Bedarf auch
korrigieren. ▲
Wenn keine Korrektur möglich ist, wird die Validierung abgebrochen und ein
Alarmfenster mit Fehlermeldung angezeigt. ▲
Das Programm kann automatisch Zufalls-Daten in versteckte Felder eintragen, um damit
↓ Caching zu verhindern. ▲
Nur dann, wenn alle Daten korrekt sind, werden die Daten mit
Javascript-Methode submit() an das Ziel-Script abgesendet.
Für AnwenderInnen entfällt die Wartezeit für Absenden, Prüfung am
Server, Erstellung und Übersendung der Fehlermeldung, da die Prüfung am
eigenen PC blitzschnell erfolgt.
Der Vorteil für den Server liegt in der wesentlich geringeren Belastung,
da keine Fehler-Zyklen durch falsche Eingangsdaten auftreten. ▲
Unabhängig davon müssen die Daten auch auf Server-Seite validiert werden.
Diese Prüfung ist eine Sicherheits-Maßnahme gegen Hacker und wird daher
anders programmiert.
Caching verhindern
Cache
In jedem PC-Umfeld werden (Web)-Dateien, die von einem Programm angefordert
wurden, lokal gespeichert. •
Jedes Browser-Programm speichert die erhaltenen Daten
in einem eigenen Cache-Verzeichnis (Ordner). •
In den meisten Netzwerken gibt es darüber hinaus Proxy-Server,
welche die angeforderten Daten aller PC des LAN zwischen-speichern.
Das ist für gleichbleibende Daten sinnvoll: Sie werden nur bei der ersten
Verwendung vom entfernten Server angefordert. Bei jeder weiteren Verwendung werden diese
Daten aus einem der lokalen Cache-Speicher entnommen.
Variable Daten
werden u.a. von den meisten dynamischen Webseiten geliefert, z.B. von Perl- oder
PHP-Programmen. Die erhaltenen Daten müssen in diesem Fall stets neu angefordert
werden und dürfen nicht aus einem der Cache-Speicher stammen. •
Die meisten Browser und Proxy-Server erkennen das richtig. •
In einem Fall treten allerdings oft Probleme auf: Wenn ein PHP-Programm mit den
gleichen Argumenten variable Daten liefert, dann wird es oft
nicht erneut angefordert, sondern die Daten der ersten Verwendung aus einem Cache entnommen.
Problem-Fälle
Das Cache-Management funktioniert unzuverlässig, wenn ein (PHP)-Programm bei
gleicher Anforderung (keine Argumente, oder gleiche Argumente) variable Daten liefert.
Ein typischer Fall liegt vor, wenn das PHP-Programm die aktuelle Zeit oder Zufalls-Daten
sendet, z.B. mit derartigen gleichbleibenden Anforderungen:
Die HTTP-Anweisung kann man in jedem Fall verwenden (z.B. auch für
→ dynamische Grafik). ●
Leider werden diese Angaben nicht immer beachtet.
Zufalls-Argumente
Es gibt einen Trick, um schon bei der Anforderung (auf Client-Seite) das Caching
zuverlässig zu verhindern: Man sendet ein zusätzliches Argument mit
Zufalls-Daten, z.B.
Das Argument trick des Beispiels erhält bei jeder
Anforderung andere Daten
(eine →
Zufalls-Zahl), wird jedoch vom Empfangs-Programm send_data.php
ignoriert.
●
Der Trick funktioniert fast immer, erfordert jedoch ein kleines Javascript-Programm in der
Anforderungs-Webseite. Man integriert es am besten in das
↑ Validierungs-Programm,
welches vor dem Absenden die eingetragenen Formular-Daten kontrollieren sollte.
Es gibt viele Möglichkeiten, um mit Javascript Zufalls-Argumenten zu erzeugen.
Das Beispiel rechts ist stark auf die wesentlichen Details reduziert und zeigt, wie
man in einem Formular f1 ein Feld zuf
für die Zufalls-Daten anlegt, das Formular mit einem
Javascript-Programm senden absendet und vorher Zufalls-Daten
in das Feld einträgt.
Beispiel:
Man fügt ein unsichtbares Element in das Anforderungs-Formular ein:
<input type="hidden" name="zuf" />
Die Anforderung erfolgt mit einem button-Element außerhalb
des Formulars:
<button onclick="senden()">
Absenden
</button>
Das Javascript-Programm senden kontrolliert die eingetragenen Daten,
trägt Zufallsdaten in das Feld zuf ein und sendet zuletzt
das Formular ab:
function senden() {
var z=Math.floor(Math.random()*1000);
document.f1.zuf.value=z;
document.f1.submit();
}
Variable Formulare mit PHP
Mit PHP kann man variable Formulare nach Bedarf erzeugen und z.B. mit
Anfangsdaten (value='..') füllen.
Wenn eine dynamische Webseite Eingangsdaten erhält, und diese nochmals in
Formularen aufscheinen, dann ist es guter Stil, die aktuellen Daten bereits in die
entsprechenden Felder einzutragen - Das Formular enthält dann genau die
zuletzt eingetragenen Daten und Änderungen erfordern wenig Aufwand.
Als Absicherung gegen Hacker müssen sie sicherstellen, dass auf diese Weise
kein gefährlicher HTML-Code in die Webseite eingetragen wird. ♦ Details zur Sicherheit auf der
Empfangs-Seite.
Annahme: Variable $name enthält als
Parameter übergebene Daten
Im Feld txt1 des Formulars ist daher der
Text test bereits eingetragen, kann aber
natürlich durch die/den AnwenderIn geändert werden.
GET und POST
Zur Übergabe von Daten zwischen Sender (Webseite mit Formular) und Empfänger
(Ziel-Programm @ Perl, PHP, ..) stehen die beiden Standard-Methoden
GET und POST zur Verfügung
In diesem Kapitel werden die beiden Methoden kurz verglichen. ♣
Tipp: Wenn sie über wenig Erfahrung verfügen, verwenden sie
besser GET, da diese Methode leichter durchschaubar ist.
Die Daten werden beim Absenden vom Browser nach speziellen
→
Regeln in die URI-Adresszeile verpackt. Aus der Ziel-Adresse und z.B. den
Daten von Feld
<input type="text" name="txt1" value="a9z" />
wird diese URI-Adresszeile erzeugt:
ziel.php?txt1=a9z
Die Codierung kann auch manuell oder mit einem (Javascript)-Programm erfolgen (Beispiele
im Kapitel ↑
vorprogrammierte Daten dieser Seite).
Die Daten werden nicht codiert, sondern so abgesendet, wie eingetragen.
Länge
Die maximale Länge des gesamten URL-Strings
(inkl. http... ) beträgt 1024 Zeichen.
Das muss kein Nachteil sein: Je weniger Text übergeben wird, desto geringer
das Sicherheits-Risiko.
Die maximale Länge der Empfangs-Daten wird durch die PHP
→
Konfigurations-Variable post_max_size bestimmt.
Sie beträgt z.B. für diesen Server Live
get_cfg_var('post_max_size') =
Transport
Die Daten (d.h. der URI-String) werden an den Webserver gesendet. Dieser
empfängt den Eingangs-Datenstrom, zerlegt den String und verpackt
allfällig gefundene GET-Daten in die
Umgebungs-Variable QUERYSTRING. Diese Variable wird
an das Ziel-Programm übergeben.
Die Daten werden direkt an das angegebene Ziel gesendet, d.h. an ein (PHP)-Programm.
Dieses muss den Eingangs-Datenstrom selbst verarbeiten und verwendet dazu
normalerweise die Umgebungs-Variable CONTENT_LENGTH
Browser-Adresszeile
Der gesamte URI-String wird in der Browser-Adresszeile der Ziel-Seite angezeigt,
d.h. inklusive Adresse, ? Zeichen und den Formular-Daten. Auch verschlüsselte
und versteckte Felder werden in Klartext angezeigt.
Das ist leichter zu debuggen, kann aber ein Sicherheits-Risiko darstellen.
Die empfangenen POST-Daten werden nicht angezeigt,
die Browser-Adresszeile enthält lediglich die Internet-Adresse der Zielseite.
Decodierung
Das Ziel-Programm (PHP) muss den erhaltenen QUERYSTRING
zuerst an den & Zeichen in Datenfelder zerlegen,
danach die erhaltenen Teil-Strings an den = Zeichen
in Name und Wert.
Alle modernen Programmiersprachen bieten bequeme Möglichkeiten zur Decodierung.
In PHP sind die Daten in den
→
Globalen PHP-Arrays $_GET
und $_REQUEST verfügbar.
Das Globale Array $_REQUEST enthält alle übergebenen
Daten unabhängig von der Methode, und ist daher die bevorzugte Quelle zur
Übernahme dieser Daten im Programm der
→ Ziel-Seite.
♦ Details zu Common Gateway Interface
(CGI)-Programmen sowie zu den Methoden
GET und
POST
PHP
Empfang
So lassen sich häufig verwendete Daten besonders rasch und bequem absenden.
Hacker-Code
Wenn jedoch Daten-Fehler entdeckt werden, dann wird ein Korrektur-Zyklus in Gang gesetzt:
Eine eigene Webseite mit der Fehlermeldung wird zurückgesendet, dazu nochmals das
Eingabe-Formular.
Als Absicherung gegen Hacker müssen sie sicherstellen, dass auf diese Weise
kein gefährlicher HTML-Code in die Webseite eingetragen wird.