PHP Basics (4)

Drei Schätze haben wir bisher: die Datenbank, die schon auf deinem Webspace unter phpMyAdmin läuft, die query.html und die query.php. Wo sollen die letzteren beiden eigentlich hin? Erstellt hast du sie schon? Sonst tu das bitte genau jetzt. Nutze dazu, wie gesagt, einen guten Editor mit Syntaxhighlighting, z.B. Notepad++. Alternativen wären z.B. der Weaverslave (das Weberknecht-Spinnentier 🙂 ) oder PSPad. Da wir gerade darüber sprechen: in „Wie man eine Access-Datenbank ins Internet bringt (2)“ ist ja die query.html komplett abgedruckt. Allerdings steht in ihrer Zeile 12:

<form action = „XXXXXXX“ method = „post“>

Ersetze „XXXXXXX“ durch die Zeichenfolge „query.php“. Hintergrund: Das Formular der query.html soll die Formulardaten an die query.php senden. Übrigens mit der Methode POST. Die sieben Xe hatte ich sicherheitshalber eingefügt, weil ich geposteten Code immer von verräterischen Teilen säubere. Okay, du hast jetzt beide Dateien irgendwo auf deiner Festplatte. Wohin also sollen sie im weiteren Verlauf? Die Antwort lautet: das sage ich dir erst, wenn wir über FTP gesprochen haben.

Die Rolle von FTP bei unserem Vorhaben

FTP steht für File Transfer Protocol. Ähnlich dem bekannten Hyper Text Transfer Protocol (http:// bekannt aus der Browser-Adress-Zeile) leistet es Datenübertragung. Mit diesem Protokoll kannst du Daten von deiner lokalen Festplatte auf deinen angemieteten Webspace hochladen oder vom Webspace auf deine lokale Festplatte herunterladen. Alles, was du dazu brauchst, ist ein FTP-Tool, ein FTP-Programm. Ich möchte hier mal ausnahmsweise eine deutliche Empfehlung aussprechen: FileZilla. Dieses FTP-Programm ist echt okay. Es ist auch kostenlos und auf Open-Source-Basis gehalten. Alternativen wären WS_FTP oder Netdrive. Installiere dir also ein FTP-Programm.

FTP-Programm_Elemente01

Bild 4-1

So, wie versprochen sage ich dir jetzt, wohin die query.html und die query.php kommen. Sie kommen in dein html-Verzeichnis und dort in das Unterverzeichnis „meine_datenbank“. Um Bekanntschaft mit diesem html-Verzeichnis zu machen, gib im FTP-Programm unter „Server“ ein: ftp.deine-domain.de.

Bild 4-1 Pfeil 1

Das heißt, wenn deine Domain (der URL deiner Internetseite, den du ja von deinem Webspace her kennst) lautet http://www.willi-heinz.de, dann gibst du im FTP-Programm in das Feld Server „ftp.willi-heinz.de“ ein. Daneben oder darunter ist das Feld Benutzername.

Bild 4-1 Pfeil 2

Hier gibst du den von deinem Anbieter/Hoster genannten Benutzernamen ein, z.B. „web444“. Daneben oder darunter wiederum ist das Feld „Passwort“.

Bild 4-1 Pfeil 3

Hier gibst du nun aber weder das Passwort für deinen Login im Portal deines Anbieters noch das Datenbank-Passwort ein. Sondern du gibst das FTP-Passwort deines Webspaces ein. Du findest es von Anbieter zu Anbieter an unterschiedlichen Stellen.

Bsp. Alfahosting: AM PORTAL EINLOGGEN / KUNDENCENTER / MEINE VERTRÄGE / (EIGENES PRODUKT WÄHLEN) / FTP-ZUGANGSDATEN / FTP-PASSWORT. Du musst dich da ein wenig bis zum Ziel durchklicken.

Daneben oder darunter ein drittes Mal ist das vierte Feld Port.

Bild 4-1 Pfeil 4

Das kannst du im Allgemeinen freilassen, das übernimmt dein FTP-Programm für dich. Und es folgt ein heftiger Druck 🙂 auf die RETURN/ENTER-Taste und schwupps! bist du online auf dem Teil deines Webspaces, auf den du Dateien hochladen und von dem du Dateien herunterladen kannst. Natürlich kannst du statt RETURN/ENTER zu drücken auch „verbinden“ klicken.

Bild 4-1, Pfeil 5

Bevor du jetzt aber wie der Teufel die query.html und die query.php hochlädst (wie das geht, falls du es nicht schon gesehen/erahnt hast, sag ich dir gleich), sollten wir uns über das Thema Sicherheit unterhalten. Im Besonderen über das Thema .htaccess. Ja, der Punkt vor diesem Wort stimmt schon.

Du weißt ja, im Internet tummeln sich viele Scherzkekse, Scharlatane und böse Zeitgenossen. Deswegen ist es ratsam, deine schon bald voll internetfähige Datenbank mit einem .htaccess-Schutz zu versehen. Was ich dir dazu vorschlage ist, dass eine (von dir zu schreibende) index.html im Verzeichnis

DEIN WEBSPACE/html

liegt (ungeschützt, das ist okay), aber die query.html und die query.php im Verzeichnis

DEIN WEBSPACE/html/meine_datenbank

(geschützt). Folglich solltest vor dem Hochladen das hier tun: Finde den Bereich deines Webspaces im FTP-Programm. Bei FileZilla ist das der große Bereich im rechten unteren Drittel des Fensters, der offline schneeweiß bleibt. Dort sollte, wenn du FTP-online bist, das Verzeichnis „html“ zu finden sein. Klicke darauf doppelt. Wenn du die Maus so gern ignorierst, wie ich, kannst du auch mit den Pfeiltasten darauf gehen und RETURN/ENTER drücken. Jetzt befindest du dich im Verzeichnis „html“. Mache im freien, weißen Bereich einen Rechtsklick. Wähle den Menüpunkt „Verzeichnis erstellen“. Im nun erscheinenden Eingabefeld ist schon der Pfad vorgegeben:

DEIN WEBSPACE/html/

Wähle als Verzeichnisnamen „meine_datenbank“ hinter dem letzten Slash. Ohne die Anführungszeichen natürlich! Drücke RETURN/ENTER. Du hast jetzt im Verzeichnis „html“ das Unterverzeichnis „meine_datenbank“ erstellt. Achte bei solchen Webspace-Aktionen immer auf die Groß- und Kleinschreibung. Das nimmt der Apache-Server sehr genau. „meine_datenbank“ ist nicht das Gleiche wie z.B. „Meine_Datenbank“. Nachdem du das Verzeichnis erstellt hast, solltest du ihm jetzt einen .htaccess-Schutz spendieren.

Die Dateien „.htaccess“ und „.htpasswd“ werden gleich im (Unter-)Verzeichnis „meine_datenbank“ auftauchen. Wir erstellen die beiden aber nicht selber und laden sie auch nicht dorthin, sondern das übernimmt der Anbieter bzw. dessen webseitige Anbietersoftware für uns.

Ich beschreibe jetzt den Weg beim Anbieter Alfahosting. Ich mache keine Werbung, wähle den Anbieter, wie du willst, aber ich brauche eine Referenz, auf die ich meine Anleitung beziehen kann. Bei anderen Anbietern ist der Weg wahrscheinlich ähnlich. Logge dich wieder mittels Browser auf deinem Anbieterportal ein. Bild 4-2

Einloggen_auf_Webspace01

Bild 4-2

Wähle das von dir angemietete Produkt. Wähle eine Schaltfläche, die in etwa so heißt wie „Jetzt in Confixx einloggen“. Danach bist du in der Software, die in meinem Beispiel „Confixx“ heißt.

Bild 4-3 Pfeil 1

Gemeint ist die Software, mittels derer du Einstellungen an deinem Webspace vornehmen kannst. Wähle jetzt im linken Bereich den Hauptpunkt „Tools“.

Bild 4-3 Pfeil 2

Wähle dann den Unterpunkt „Passwortschutz“.

Bild 4-3 Pfeil 3

Du bist jetzt im Bereich „Passwortschutz“.

Bild 4-3 Pfeil 4

Jetzt siehst du einen (noch kleinen) Verzeichnisbaum. Nämlich deine Verzeichnisse „html“ und darin „meine_datenbank“. In meinem Bild 4-3 steht „Bereich01“, wo aber bei dir „meine_datenbank“ stehen soll. Daneben ist ein Link / eine Schaltfläche „schützen“, wähle sie. Bild 4-3 Pfeil 5

Passwortschutz_htaccess01

Bild 4-3

Wichtig ist, dass du das Unterverzeichnis „meine_datenbank“ schützt und nicht das darüber „html“. Nun denk dir einen Benutzernamen und ein starkes Passwort aus. Manche Anbieter begrenzen für beides die mögliche Länge. Klicke dann „schützen“ oder „Verzeichnis schützen“ oder „ausführen“ oder „OK“ oder etwas Ähnliches.

Notiere dir Benutzernamen und Passwort sorgfältig. Bewahre die Notiz gut auf. Gib diesen Login nur an Menschen deines Vertrauens weiter.

Nun logge dich aus „Confixx“ (oder wie bei deinem Anbieter diese Software heißt) wieder aus. Logge dich nötigenfalls auch aus dem Portal wieder aus.

Nun heißt es, 15 Minuten zu warten. Während dieser Zeit sollte auch dein FTP-Programm offline sein. Nach Ablauf dieser Zeit geh wie beschrieben mit deinem FTP-Programm online. Im Unterverzeichnis

DEIN WEBSPACE/html/meine_datenbank

sollten nun die Dateien .htaccess und .htpasswd sein. Lass sie immer unangetastet. Lade sie auch nicht herunter und überschreibe sie nicht.

Lade nun die query.html und die query.php in das Unterverzeichnis „meine_datenbank“ hoch.

htaccess-Dateien01

Bild 4-4

Wie in Bild 4-4 sollte es dann auf deinem Webspace, betrachtet mit deinem FTP-Programm, aussehen.

Was haben wir da gerade eigentlich gemacht? Wir haben dafür gesorgt, dass deine Homepage http://www.willi-heinz.de (das ist nur ein Beispiel) zwar öffentlich bleibt. Dass aber der Unterbereich http://www.willi-heinz.de/meine_datenbank passwortgeschützt ist. Das heißt, wenn jemand http://www.willi-heinz.de ansurft, sieht er deine Homepage (was genau er sieht, werden wir gleich bauen), klickt er aber den Link, um zur Bücherdatenbank zu gelangen, wird sein Browser ihn auffordern, Benutzername und Passwort (von dir wie oben beschrieben festgelegt) einzugeben. Sonst ist Essig. Sonst kommt er nicht in den Bücherdatenbank-Bereich deiner Homepage. Und woher soll er das Passwort denn haben? Antwort: Du gibst das Passwort nur an Menschen deines Vertrauens weiter: Familienmitglieder, Freunde, gute Internetbekanntschaften, deine Mitschüler/Kommilitonen, deine Lehrer/Dozenten usw.

Eine index.html bauen

Nun, bis hierher hast du es geschafft? Nein? Kommentiere diesen Blog, frag mich, frage in Foren, Google, was auch immer. Manchmal ist der Durchbruch nur ein kleines Fehlerchen entfernt. Kapitulieren ist langweilig. 🙂

Wir werden jetzt die Datei index.html erstellen. Sie ist erster Ansprechpartner des Webservers, wenn ein Nutzer deine Bücherdatenbank-Homepage http://www.willi-heinz.de (das ist nur ein Beispiel) ansurft. Ich erlaube mir, die Datei hier erst mal komplett zu zeigen:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8">
        <title>Meine B&uuml;cherdatenbank im Internet</title>
    </head>
    
    <body bgcolor="#d4cae2">
    <font size="4" face="Arial,MS Sans Serif">

<h3>Meine B&uuml;cherdatenbank im Internet</h3>

    
    Hallo Besucher! <a href="meine_datenbank/query.html">Hier</a> geht es zu meiner B&uuml;cherdatenbank.
    Viel Spa&szlig;!
    </font>
    </body>
</html>

Code 4-1 (index.html)

So sieht die „index.html“ im Browser dargestellt aus:

index_html_im_Browser01

Bild 4-5

Achte wieder darauf: Dein Windows soll die Dateinamenerweiterungen anzeigen. Bei einem Word-Dokument nicht nur beispiel, sondern eben beispiel.docx. Bei einem Bild nicht nur beispiel, sondern eben beispiel.jpg. Bei unserer index.html nicht nur index, sondern eben index.html. Du erreichst das im Windows-Explorer unter den Ordneroptionen.

Erstelle nun auf deiner Festplatte diese index.html. Es ist jetzt wieder an der Zeit für ein bisschen HTML-Theorie. Wie ist die index.html aufgebaut? Am Anfang stehen zwei Zeilen, die dir schon aus der query.html bekannt sind:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Sie sind eine Orientierung für den Code interpretierenden Browser. Ihre genaue Bedeutung kannst du momentan getrost ignorieren. Es folgt

<html>

womit die eigentliche Datei/das eigentliche Skript beginnt. Dieses Tag (sprich: täg) sagt: Lasse HTML-Code beginnen.

<head>

sagt: Lasse den Kopf des HTML-Skripts beginnen. Es folgt die Zeile

<meta http-equiv=“content-type“ content=“text/html; charset=UTF-8″>

Sie bindet ein sogenanntes Cascading Style Sheet (CSS) ein, das für das Design verantwortlich ist. Ignoriere auch diese Zeile getrost. Aber danach wird es interessant.

<title>Meine B&uuml;cherdatenbank im Internet</title>

sorgt dafür, dass im Tab des Browsers „Meine Bücherdatenbank im Internet“ angezeigt wird. Auch in der Titelleiste des Browsers wird das später stehen, wenn der Tab angewählt ist. Du wunderst dich über das „&uuml;“ statt des „ü“? Es codiert den Umlaut, sodass er, unabhängig vom verwendeten Zeichensatz, richtig dargestellt wird. Der Kopf des HTML-Dokuments ist damit zu Ende und ein

</head>

bestätigt das (Zeile 7).

Nach einer strukturierenden Leerzeile 8 wird in Zeile 9 die Hintergrundfarbe (bg = background) festgelegt. #d4cae2 ist ein Lila. Zeile 10 bestimmt Schriftgröße und Schriftart. Zeile 12 sorgt für eine Überschrift der Klasse 3, die wie der Titel lautet: Meine B&uuml;cherdatenbank im Internet. Alsdann folgt in Zeile 15 die Begrüßung. Was dann kommt und in <a> und </a> eingeschlossen ist, ist der Link zur Datenbank selber. Das gegenwärtige Dokument steht ja noch ungeschützt im Web, wer aber nun den Link klickt, wird zur Passworteingabe aufgefordert. So, wie wir es mit .htaccess gestaltet haben. Im gegenwärtigen Dokument werden dann noch der Körper und das ganze Dokument geschlossen:

</body>
</html>

Fertig. Zeit, diese „index.html“ auf deinen Webspace hochzuladen, und zwar ins Haupt-, das heißt ins html-Verzeichnis. Öffne dein FTP-Programm, verbinde dich in der beschriebenen Weise mit deinem Webspace und lade deine frische index.html ins Hauptverzeichnis html hoch. Sie landet also eine Ebene über „meine_datenbank“. Und weißt du, was jetzt ist? Juche! Jetzt bist du erst mal fertig! Du hast es geschafft. Deine Access-Datenbank wurde ins Internet gebracht. Jeder kann hinsurfen und mit dem von dir erhaltenen Login Bücher-Suchbegriffe eingeben und sich die Ergebnisse anzeigen lassen.

Herzlichen Glückwunsch! 🙂

Pause, feiern.

Navigiere nun bitte zum nächsten Eintrag von streethawk68: Wie man eine Access-Datenbank ins Internet bringt (5)

Advertisements

Über streethawk68

43 years old IT-Fan
Dieser Beitrag wurde unter Uncategorized abgelegt und mit , , verschlagwortet. Setze ein Lesezeichen auf den Permalink.

Kommentar verfassen

Trage deine Daten unten ein oder klicke ein Icon um dich einzuloggen:

WordPress.com-Logo

Du kommentierst mit Deinem WordPress.com-Konto. Abmelden / Ändern )

Twitter-Bild

Du kommentierst mit Deinem Twitter-Konto. Abmelden / Ändern )

Facebook-Foto

Du kommentierst mit Deinem Facebook-Konto. Abmelden / Ändern )

Google+ Foto

Du kommentierst mit Deinem Google+-Konto. Abmelden / Ändern )

Verbinde mit %s