EWS, WS 2016/17, Pfahler O-1

Größe: px

Ab Seite anzeigen:

Download "EWS, WS 2016/17, Pfahler O-1"

Silvia Bayer
vor 5 Jahren
Abrufe

1 Vorlesung und Übung Universität Paderborn Wintersemester 2016/2017 Dr. Peter Pfahler Projekt Gästebuch EWS, WS 2016/17, Pfahler O-1 Projekt im Zusammenhang Aufgabe: Web-Seite mit einem einfachem Gästebuch. Besucher wird aufgefordert, etwas einzutragen. Einträge werden gespeichert und angezeigt. Plan für Interaktionen: EWS, WS 2016/17, Pfahler O-2

2 Projekt Gästebuch Gestaltung mit Cascading Style Sheets Einfaches Formular (vor Abschicken prüfen) Anzeige der bisherigen Einträge EWS, WS 2016/17, Pfahler O-3 Planung der Phasen Phasen 1 und 2 als Zweige im PHP-Programm Phase 1: 1a. Aufforderung zum Eintragen 1b. HTML-Formular zum Eintragen 1c. Prüfen, ob etwas eingetragen wurde (in JavaScript) Phase 2: 2a. Eintrag an Datei anfügen 2b. Dank 2c. Alle Einträge aus der Datei lesen und anzeigen Gestaltung mit CSS Datei gaestebuch.txt existiert auf dem Serverrechner und ist vom Web-Server schreib- und lesbar. EWS, WS 2016/17, Pfahler O-4

$meinem Gästebuch!</h1> <?php if (!isset($_post["submit"])) { // Phase 1 else { // Phase 2?$

3 Programmstruktur <html> <head> <title>mein Gästebuch</title> <script type="text/javascript"> // Prüffunktion </script> <style type="text/css"> // Gestaltung </style> </head> <body> <h1>willkommen zu meinem Gästebuch!</h1> <?php if (!isset($_post["submit"])) { // Phase 1 else { // Phase 2?> </body> </html> EWS, WS 2016/17, Pfahler O-5 Phase 1: Formularerzeugung und Prüfung <script type="text/javascript"> function check () { if (document.gastform.eintrag.value.length < 1) { alert("bitte etwas eintragen!"); return false; return true; </script>... echo <<< EINTRAG <h2>hier kannst du etwas eintragen:</h2> <form name="gastform" action="gaestebuch.php" method="post"> <textarea name="eintrag" cols="48" rows="8"></textarea><br> <input type="reset" name="reset" value="löschen"> <input type="submit" name="submit" value="abschicken" onclick="return check();"> </form> EINTRAG; EWS, WS 2016/17, Pfahler O-6

Gestaltung mit Cascading Style Sheets <style type="text/css"> body {background-color:#8080c0; color:#ffff00; textarea {background-color:#ff8000; font-size:120%.

4 Gestaltung mit Cascading Style Sheets <style type="text/css"> body {background-color:#8080c0; color:#ffff00; textarea {background-color:#ff8000; font-size:120%.eintraege {background-color:#ff8000;padding:0.8cm; font-family:monospace; font-size:120%;color:#000000; </style> EWS, WS 2016/17, Pfahler O-7 Phase 2: Daten verarbeiten, Gästebuch anzeigen $gb = fopen("gaestebuch.txt", "a"); // Phase 2a fputs($gb, "<p>". $_POST["eintrag"]."</p>\n"); fclose($gb); echo "<h2>danke für deinen Eintrag</h2>"; echo "<div class = eintraege>"; $gb = fopen("gaestebuch.txt","r"); while (!feof($gb)) { $eintr = fgets($gb); echo $eintr; echo "</div>"; fclose($gb); // Phase 2b // Phase 2c EWS, WS 2016/17, Pfahler O-8

Testen der Anwendung Phase 1: eintragen und abschicken eintragen und löschen nichts eintragen und abschicken Phase 2: Eintrag in leere Gästebuchdatei Eintrag in nicht leere Gästebuchdatei Probleme

5 Testen der Anwendung Phase 1: eintragen und abschicken eintragen und löschen nichts eintragen und abschicken Phase 2: Eintrag in leere Gästebuchdatei Eintrag in nicht leere Gästebuchdatei Probleme mit Schreiben und Lesen der Gästebuchdatei Fehler finden, korrigieren und nochmal testen. Wenn alles funktioniert, eine andere Person erproben lassen. EWS, WS 2016/17, Pfahler O-9 Testergebnis: Problem 1 In unserem Programm sind Schreib-/Lese-Probleme nicht behandelt. Dies führt zu unschönen PHP-Fehlermeldungen, z. B. wenn die Gästebuchdatei nicht schreibbar ist EWS, WS 2016/17, Pfahler O-10

$$gb) { echo "Leider ist das Gästebuch im Moment nicht verfügbar"; else { fputs($gb, "<p>". $_POST["eintrag"].$ $"</p>\n"); fclose($gb); echo "<h2>danke für deinen Eintrag</h2>"; echo "<div class = eintraege>"; $gb = @fopen("gaestebuch.txt","r"); // @ unterdrückt Meldungen if (!$

6 Korrektur: Fehlerbehandlung für Ein-/Ausgabe $gb unterdrückt Meldungen if (!$gb) { echo "Leider ist das Gästebuch im Moment nicht verfügbar"; else { fputs($gb, "<p>". $_POST["eintrag"]."</p>\n"); fclose($gb); echo "<h2>danke für deinen Eintrag</h2>"; echo "<div class = eintraege>"; $gb unterdrückt Meldungen if (!$gb) { echo "Leider ist das Gästebuch im Moment nicht verfügbar"; else { while (!feof($gb)) { $eintr = fgets($gb); echo $eintr; echo "</div>"; fclose($gb); EWS, WS 2016/17, Pfahler O-11 Testergebnis: Problem 2 In unser Gästebuch können HTML-Texte eingetragen werden, die dann in der Gästebuch-Ausgabe vom Browser interpretiert werden (z. B. Bilder, Links, u.v.m.) EWS, WS 2016/17, Pfahler O-12

7 Korrektur: Transformation der HTML-Zeichen Einige Zeichen, z.b. das < haben Spezialbedeutung für HTML (Tag-Klammer). Damit sie nicht interpretiert werden, müssen sie in HTML-Entities transfomiert werden. So muss z. B. das Zeichen < in die Zeichenfolge < transformiert werden. Damit sind HTML-Tags im Gästebuch unschädlich. Durchführung der Transformation z.b. beim Schreiben in die Gästebuch-Datei: Ersetze fputs($gb, "<p>". $_POST["eintrag"]."</p>\n"); durch fputs($gb, "<p>". str_replace("<", "<", $_POST["eintrag"]). "</p>\n"); Alternativ: Verwende PHP-Funktion htmlspecialchars() EWS, WS 2016/17, Pfahler O-13 Korrektur: Transformation der HTML-Zeichen gaestebuch.txt: <p><a href=" PB</a> </p> EWS, WS 2016/17, Pfahler O-14

8 Aufgabe: Erweiterung des Gästebuchs Eingabefeld für Benutzername gestaltet mit Hintergrundfarbe und Schriftart. Persönlicher Dank Autor und Datum der Einträge Trennlinien EWS, WS 2016/17, Pfahler O-15

Ähnliche Dokumente

W7 Projekt im Zusammenhang Gästebuch

W7 Projekt im Zusammenhang Gästebuch 7 Projekt im Zusammenhang Gästebuch ES-7.1 Aufgabe: eb-seite mit einem kleinen Gästebuch; fordert eb-surfer auf, etwas einzutragen; speichert die Einträge und zeigt alle an, die bisher gemacht wurden.